Microsoft Edge有可能封鎖Javascript動態載入的問題

今天在使用Microsoft Edge測試網頁的Javascript時發現,我有一個延遲載入Javascript的機制,但是怎麼嘗試都沒有起作用,已經排除語法與同源政策(CORS, Cross-Origin Resource Sharing)的問題,也消除了Ad-Block的可能性,但是還是久久無法排除這樣的錯誤。

我使用的語法如下:

$.ajax({
  url: "YourJavascriptFile.js",
  dataType: "script",
  crossorigin: "anonymous",
  success: function () {
    console.log("Dynamic load JS success!");
  }
});

再怎麼嘗試,瀏覽器的console還是會出現這樣的錯誤訊息:

GET YourJavascriptFile.js net::ERR_BLOCKED_BY_CLIENT

由於使用的是jQuery提供的函式來載入,所以一度以為是jQuery ajax還需要特定的設定,所以改採用下列的寫法:

$("head").append(`<script async crossorigin="anonymous" src="YourJavascriptFile.js" ></script>`);

依然是拿到這個錯誤:

GET YourJavascriptFile.js net::ERR_BLOCKED_BY_CLIENT

有可能是Microsoft Edge封鎖掉動態載入JS行為

排除掉所有錯誤的可能性後,我開始把調查的矛頭指向瀏覽器(Microsoft Edge),原來是內建的防止追蹤在搞鬼,請進入「設定>隱私權、搜尋與服務」,如下圖:

調整選項

理論上只要把防止追蹤的選項降低成基本就可以動了,但這樣做的缺點是對所有網站的防護反而都失效了,因此我的建議是點選例外選項,進入後將localhost加入到排除名單中即可。

設定後再去執行動態載入Javascript的程式碼,應該就可以看到可順利的引入JS了。

Browser MicrosoftEdge Dynamic Dynamically Load Include Javascript JS Fail Error ERR_BLOCKED_BY_CLIENT BUG