最近在使用jquery讀取本地json文件時,遇到了一些問題。我試圖使用下面的代碼來讀取json文件:
$.getJSON("data.json", function(data) {
console.log(data);
});
然而,我卻遇到了一個奇怪的錯誤:
Access to XMLHttpRequest at 'file:///C:/path/to/data.json' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
看起來是CORS(跨域資源共享)的問題。我檢查了一下路徑,發現路徑是正確的,在我的本地文件系統上。
經過一番研究,我發現解決方法是使用http協議在本地啟動一個服務器,并在服務器上打開html文件。我用npm安裝了http-server,并在cmd中輸入以下命令:
http-server C:\path\to\folder -p 8080
在瀏覽器中打開http://localhost:8080,這樣就可以成功讀取本地json文件了。
總之,通過在本地啟動一個http服務器,在服務器上打開html文件,可以避免jquery讀取本地json文件時出現的CORS錯誤。希望這篇文章對其他人有所幫助。
下一篇jquery通訊錄網頁