原因:缺少 CORS 標頭“Access-Control-Allow-Origin”
原因
Reason: CORS header 'Access-Control-Allow-Origin' missing
哪裡出錯了?
對CORS請求的響應缺少必需的Access-Control-Allow-Origin頭部,該頭部用於確定當前來源中的內容是否可以訪問資源。
如果伺服器受您控制,請將請求站點來源新增到允許訪問的域名集中,方法是將其新增到Access-Control-Allow-Origin頭部值中。
例如,要允許https://example.com上的站點使用CORS訪問資源,則頭部應為
http
Access-Control-Allow-Origin: https://example.com
您還可以透過使用*萬用字元配置站點以允許任何站點訪問它。您應該僅將此用於公共API。私有API絕不應使用*,而應設定特定的域名或域名集。此外,萬用字元僅適用於使用crossorigin屬性設定為anonymous的請求,並且它會阻止在請求中傳送cookie等憑據。
http
Access-Control-Allow-Origin: *
警告:使用萬用字元允許所有站點訪問私有API是一個壞主意。
要允許任何站點進行CORS請求而無需使用*萬用字元(例如,啟用憑據),您的伺服器必須讀取請求的Origin頭部的值並使用該值設定Access-Control-Allow-Origin,並且還必須設定Vary: Origin頭部以指示某些頭部正在根據來源動態設定。
常見 Web 伺服器的示例
設定頭部的確切指令取決於您的Web伺服器。
在下面的示例中,
在Apache(文件)中,將以下類似行新增到伺服器的配置中(在相應的<Directory>、<Location>、<Files>或<VirtualHost>部分內)。配置通常位於.conf檔案中(httpd.conf和apache.conf是這些檔案的常用名稱),或在.htaccess檔案中
apacheconf
Header set Access-Control-Allow-Origin 'https://example.com'
對於Nginx(文件),設定此頭部的命令為
nginx
add_header 'Access-Control-Allow-Origin' 'https://example.com' always;