使用C＃和jQuery在預檢請求中的請求資源上不存在“ Access-Control-Allow-Origin”標頭

Question

我在兩個站點之間啟用了cors。 我已在global.asax.cs啟用了cors。

我仍然面臨問題

請求的資源上不存在“ Access-Control-Allow-Origin”標頭

當我添加到我的web.config ：

<customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Methods" value="GET, PUT, POST, DELETE, HEAD" />
    <add name="Access-Control-Allow-Headers" value="Origin, Authorization, X-Requested-With, Content-Type, Accept" />
</customHeaders>

然后我得到錯誤-只允許一個標頭，不允許多個標頭。

Request Header

Access-control-request-headrs : authorization , content-type
Access-control-request-method :GET
Origin- xyz.com

Response Header
Allow:OPTIONS,TRACE,GET,HEAD,POST
CONTENT-LENGHT :0

GENERAL
REQUEST URL: ABC.COM
RQUEST METHOD : OPTIONS
STATUS CODE:200 OK

Answer 1

您忘記將OPTIONS添加到允許的方法列表中：

<customHeaders>
    <add name="Access-Control-Allow-Origin" value="*" />
    <add name="Access-Control-Allow-Methods" value="GET, PUT, POST, OPTIONS, DELETE, HEAD" />
    <add name="Access-Control-Allow-Headers" value="Origin, Authorization, X-Requested-With, Content-Type, Accept" />
</customHeaders>

標頭的正確配置將允許CORS請求。
您的瀏覽器無法看到該端點允許的方法，因為它的OPTIONS請求被拒絕了。
該MDN文章關於飛行前包含更多信息。

我還建議使用新的Fetch API進行Web api調用。 這是一個例子：

fetch('example.com/apiendpoint', {
    mode: 'cors',
    credentials: 'include',
    headers: { 'Authorization': authString }
}).then(
    response => response.json()
); // parses JSON response into native JavaScript objects 

---

附帶說明一下，您的示例CORS標頭指定了所有來源，但明智的做法是僅包括您希望發出這些請求的來源。 另外，要基於每個操作/控制器而不是整個站點使用CORS。