使用Chrome/WebKit調試Access-Control-Allow-Origin

Question

我正嘗試使用Cross-Origin Resource Sharing以及Access-Control-Allow-Origin和相關頭文件。我有工作在Firefox，而Chrome是給我的權限錯誤，看起來像這樣：

XMLHttpRequest cannot load <remote>. Origin <local> is not allowed by Access-Control-Allow-Origin. 

網絡檢查顯示了請求，但沒有任何反應（但不包括在OPTIONS預檢請求和響應）。我使用curl檢查了請求輸出並重新生成了所有頭文件，我所看到的符合規範所暗示的內容（以及Firefox所接受的內容）。我不知道如何進一步調試 - 是否有一些技巧可以在比Chrome通常提供的級別更低的級別上看到網絡活動？有關Chrome如何解釋CORS請求與Firefox不同的信息？

Answer 1

我懷疑你看到的是一個預檢，然後是一個錯誤的Chrome請求失敗。這將解釋爲什麼事情在Firefox中運行，而不是在Chrome中運行。

您是否在請求中發送任何自定義標題？ WebKit中有一個錯誤，其中使用自定義標頭的GET請求失敗（錯誤在這裏：http://code.google.com/p/chromium/issues/detail?id=57836）。我也注意到，即使Content-Type是一個簡單的頭文件，Chrome有時也期望在Access-Control-Allow-Headers列表中的Content-Type頭。

此外，您提到網絡檢查員不包括OPTIONS預檢？你在使用哪個網絡檢查員？我建議使用Wireshark，因爲這會爲您提供Chrome檢查器未提供的實際網絡流量的詳細信息（例如，Wireshark會記錄預檢請求）。

其他一些調試技巧：

出來嘗試在Safari瀏覽器的請求。這將有助於將其縮小至Chrome bug或WebKit錯誤。

我看到你遇到的錯誤（Wireshark顯示一個請求，但不是一個響應），這是因爲我的服務器不包括Access-Control-Allow-Origin頭，它不包括在內因爲Chrome不會發送Origin標頭（請參閱上面的錯誤）。在您的網絡跟蹤中，您是否在請求中看到Origin標頭？你有沒有控制服務器，如果是的話，它是否收到一個Origin頭？

很難在沒有更多細節的情況下調試實際問題。如果您仍然遇到問題，您可以在此發佈請求/響應標題嗎？