當我透過 AJAX 從 file:// URL 取得映像時，為什麼會出現「Access-Control-Allow-Origin 不允許 Origin null」？

從file:// URL 請求時出現「Access-Control-Allow-Origin 不允許Origin null」

中嘗試透過AJAX從Panoramio 檢索映像時，Chrome 中反覆出現錯誤：「XMLHttpRequest 無法載入[Panoramio API URL]。代碼未將請求類型指定為JSONP。隨後，jQuery 採用了 XMLHttpRequest，它依賴跨域資源共用 (CORS) 來進行跨域請求。但是，瀏覽器僅透過 Access-Control-Allow-Origin 標頭透過伺服器授權支援 CORS。

1. 來自 file:// URL 的 Null Origin:因為程式碼是從下列位置執行的file:// URL，產生了一個 null Origin 標頭。這個 null Origin 無法從伺服器回顯，導致授權失敗。
   
2. 解決方案：
   
要解決這些問題，請進行以下更正：

使用$.getJ與callback=?:

使用$.getJSON 代替$.get，並附加callback=?到請求 URL。這指示 jQuery 使用 JSONP，它會自動將請求類型設為「jsonp」。

確保 HTTP 協定：
1. 確保從 HTTP URL 執行程式碼 (http: //) 而不是檔案://。這使得 CORS 能夠正常運作。
   
2. 修訂的程式碼：
   

故障排除提示：

故障排除提示：

$.getJSON('http://www.panoramio.com/wapi/data/get_photos?v=1&key=dummykey&tag=test&offset=0&length=20&minx=-30&miny=0&maxx=0&maxy=150&callback=?', function (data) {
  // Process data
});

（例如，URL 包含回呼=？） $.get 請求。

使用 HTTP URL 進行跨來源 XMLHttpRequest 請求。

• 驗證瀏覽器對 CORS 的支援（例如，Opera 和 Internet Explorer 可能不完全支援）。

以上是當我透過 AJAX 從 file:// URL 取得映像時，為什麼會出現「Access-Control-Allow-Origin 不允許 Origin null」？的詳細內容。更多資訊請關注PHP中文網其他相關文章！