一、認識到這不是我代碼的問題,是服務器傳輸過程中瀏覽器不支持的問題:
在使用ueditor編輯的過程中無法上傳圖片,谷歌火狐瀏覽器提示Cross-Origin Read Blocking (CORB) blocked cross-origin response http://XXX?action=config&callback=bd__editor__dkhbuv with MIME type text/plain,怎么解決?
查看該文件請求,發現服務器返回頭中多了這么個玩意 X-Content-Type-Options: nosniff,這個是什么意思呢?
查閱資料X-Content-Type-Options: nosniff,文檔:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/X-Content-Type-Options,看了之后還是有點懵逼。查了資料還是簡單備注下該玩意:
服務器發送響應頭 "X-Content-Type-Options: nosniff",則 script 和 styleSheet 元素會拒絕包含錯誤的 MIME 類型的響應。這是一種安全功能,有助於防止基於 MIME 類型混淆的攻擊,過濾掉不安全的文件。即服務器發送含有 "X-Content-Type-Options: nosniff" 標頭的響應時,此更改會影響瀏覽器的行為。影響行為如下:
對於樣式文件:如果通過 styleSheet 參考檢索到的響應中接收到 "nosniff" 指令,則 瀏覽器 不會加載“stylesheet”文件,除非 MIME 類型匹配 "text/css"。
對於js文件:如果通過 script 參考檢索到的響應中接收到 "nosniff" 指令,則 瀏覽器不會加載"script"文件,除非 MIME 類型匹配以下值之一:
"application/ecmascript" 或 "application/javascript" 或 "application/x-javascript" 或 "text/ecmascript" 或 "text/javascript" 或 "text/jscript" 或 "text/x-javascript" 或 "text/vbs" 或 "text/vbscript"
從上面可以看出對於此問題需要服務器端解決:
第一種方式:X-Content-Type-Options 頭設置允許加載靜態資源文件
由於咋后台是用的java 的 springboot ,因此設置 http.headers().contentTypeOptions().disable(); 允許加載靜態資源就可以
第二種方式:
讓后台改變響應頭:Content-Type: application/javascript ,如下:
二、解決方法
===============>>#1 票數:42
檢查文件路徑是否正確並且文件是否存在 - 在我的情況下是問題 - 當我修復它時,錯誤消失了
===============>>#2 票數:21
這可以通過更改您的URL來修復,例如:
https://raw.githubusercontent.com/svnpenn/bm/master/yt-dl/yt-dl.js
Content-Type: text/plain; charset=utf-8
示例好:
https://cdn.rawgit.com/svnpenn/bm/master/yt-dl/yt-dl.js
content-type: application/javascript;charset=utf-8
rawgit.com是github的緩存代理服務。 您還可以轉到此處,以交互方式獲取原始raw.githubusercontent.com URL的相應URL。 查看其常見問題
===============>>#3 票數:7
檢查您的路徑,如果文件不存在於給定路徑中,則會出現此錯誤。
===============>>#4 票數:4
在我的情況下,我剛剛錯過了get_template_directory_uri()之后的斜杠“/”,因此導致/生成的路徑錯誤:
我的錯誤代碼:
wp_enqueue_script( 'retina-js', get_template_directory_uri().'js/retina.min.js' );
我的更正代碼:
wp_enqueue_script( 'retina-js', get_template_directory_uri().'/js/retina.min.js' );
===============>>#5 票數:2
這可能是因為瀏覽器無法訪問文件。 在使用node.js創建應用程序時,我偶然發現了這種類型的錯誤。 您可以嘗試直接請求腳本文件(復制和粘貼URL),看看是否可以檢索它。 你可以看到真正的問題是什么。 這可能是因為文件所在的文件夾的權限,或者由於路徑不正確而導致瀏覽器無法找到它。 在node.js中,指定路由到文件后,所有工作。
===============>>#6 票數:2
我已經通過將js文件中的字符集從沒有BOM的UTF-8更改為Notepad ++中的簡單UTF-8來解決了這個問題
===============>>#7 票數:2
你在使用快遞嗎?
檢查你的路徑(注意/ public /后面的“ /
”):
app.use(express.static(__dirname + "/public/"));
//注意:在“css”之前你不需要“/”,因為它已經包含在上面:
rel="stylesheet" href="css/style.css
希望這可以幫助
===============>>#8 票數:2
我們的devops團隊通過添加X-Content-Type-Options: nosniff
更改了Web服務器配置后,我們開始在生產中遇到此錯誤。 現在,由於這個原因,瀏覽器被迫解釋響應頭的content-type
參數中提到的資源。
現在,我們的應用程序服務器從一開始就將js文件的內容類型顯式設置為text/plain
。 由於X-Content-Type-Options: nosniff
未在webserver中設置,瀏覽器自動將js文件解釋為JavaScript文件,盡管內容類型被提及為text / plain。 這被稱為MIME嗅探。 現在,在設置X-Content-Type-Options:nosniff之后,瀏覽器被迫不進行MIME嗅探並采用響應頭中提到的內容類型。 因此,它確實將js文件解釋為純文本文件,並拒絕執行它們或阻止它們。 您的錯誤中也會顯示相同的內容。
解決方案:是讓您的服務器將JS文件的content-type
設置為
application/javascript;charset=utf-8
這樣,它將正常加載所有JS文件,問題將得到解決。
===============>>#9 票數:1
這可能是一條錯誤的道路。 確保在您的主應用程序文件中:
app.use(express.static(path.join(__dirname,"public")));
您的css示例鏈接為:
<link href="/css/clean-blog.min.css" rel="stylesheet">
類似於鏈接到js文件:
<script src="/js/clean-blog.min.js"></script>
===============>>#10 票數:0
請參閱HTTPS和HTTP協議
有時,如果您使用混合協議[這主要發生在JSONP回調中],您最終可能會遇到此錯誤。
確保Web頁面和資源頁面都具有相同的HTTP協議。
三、最終我的問題及解決
將用到的github文件version.js上傳到博客園文件中:
https://blog-static.cnblogs.com/files/phoenixash/version.js
成功解決!