Chrome瀏覽器開啟Ajax跨域訪問調試
由於瀏覽器安全性限制,Ajax是不能跨域訪問的,而我們在日常開發工作中,經常會出現本地開發環境需要訪問其他服務器上的API情況。提示信息為:
Access to XMLHttpRequest at ‘http://****‘ from origin ‘null‘ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin‘ header is present on the requested resource.
在當今前後端分裏模式開發越來越多,使用Ajax進行數據交互時常有跨越發生。
本文說明如何讓Chrome瀏覽器支持開發時的Ajax跨域訪問。
1.升級Chrome到最新版本
參考下面經驗"如何離線安裝Chrome最新版本或某一特定版本?",將Chrome升級到最新版本。
如何離線安裝Chrome最新版本或某一特定版本?
2.創建一個調試用的Chrome快捷方式
右鍵選擇Chrome快捷方式,在彈出的右鍵菜單中選擇"創建快捷方式",重命名新建的快捷方式為Chrome-Debug。
3.打開Chrome-Debug快捷方式屬性
右鍵選擇Chrome-Debug快捷方式,右鍵菜單中選擇"屬性",打開Chrome-Debug快捷方式屬性設置對話框。
4.增加啟動參數
在目標後面增加如下的啟動參數:--user-data-dir="c:\ChromeDebug" --test-type --disable-web-security
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-data-dir="c:\ChromeDebug" --test-type --disable-web-security
註:
- 每個--前面都有一個空格。
- disable-web-security需要搭配user-data-dir參數一起設置。
5.打開Chrome-Debug
因為啟動參數中增加了--user-data-dir="c:\ChromeDebug",表示Chrome會從c:\ChromeDebug中存取用戶數據,因該目錄可能為空,所以新打開的Chrome-Debug窗口是一個全新的Chrome,沒有書簽、歷史、擴展程序等內容,需要再重新安裝擴展程序。
6.調試跨域訪問
再次打開之前出錯的程序,就可以發現Ajax已經可以正常跨域訪問了。
參考自百度經驗
Chrome瀏覽器開啟Ajax跨域訪問調試