1. 程式人生 > 程式設計 >ASP.NET WebAPI2複雜請求跨域設定的方法介紹

ASP.NET WebAPI2複雜請求跨域設定的方法介紹

ASP.Net Core的跨域設定比較簡單 官方都整合了 具體的參見微軟官方文件:

https://docs.microsoft.com/zh-cn/aspnet/core/security/cors?view=aspnetcore-3.1#ecors

跨域條件

跨域是指的當前資源訪問其他資源時發起的http請求由於安全原因(由於同源策略,域名、協議、埠中只要有一個不同就不同源),瀏覽器限制了這些請求的正常訪問,特別需要注意的是這些發生在瀏覽器中。

解決方法

方法1.web.config檔案中的 system.webServer 節點下 增加如下配置:

<system.webServer>
<httpProtocol>
<customHeaders>
<add name="Access-Control-Allow-Methods" value="OPTIONS,POST,GET"/>
<add name="Access-Control-Allow-Headers" value="x-requested-with,content-type"/>
<add name="Access-Control-Allow-Origin" value="*" />
</customHeaders>
</httpProtocol>
</system.webServer>

方法2.Nuget包引用Microsoft.AspNet.Cors,然後在控制器上新增特性
[EnableCors(origins: "*",headers: "*",methods: "*")]

注意以上兩種方法,不要重複設定,設定了兩次會報錯 'Access-Control-Allow-Origin' header contains multiple values '*,*',。

複雜請求問題

以上兩個方法,僅對簡單跨域請求有效,無法處理複雜的跨域請求。

簡單請求:請求方法是GET/HEAD/POST,並且contentType為text/plain、application/x-www-form-urlencoded、multipart/form-data。

不滿足上述條件的視為複雜請求,開發中我們常觸發這個條件大多因為我們的請求的contentType設定的是application/json導致的。

注意:簡單請求如果設定了Authentication認證header也會讓請求“升級”為複雜請求。

複雜請求會在正式通訊之前,增加一次HTTP查詢請求,稱為"預檢"請求(preflight)。瀏覽器先詢問伺服器,當前網頁所在的域名是否在伺服器的許可名單之中,以及可以使用哪些HTTP動詞和頭資訊欄位。只有得到肯定答覆,瀏覽器才會發出正式的XMLHttpRequest請求,否則就報錯,而這次preflight的Http方法就是Options。換句話說,如果你的xhr請求發出前,會先發出一個Options請求,就說明你要執行的請求是複雜請求。

複雜請求處理

在Global.asax檔案中,通過Application_BeginRequest方法進行處理:

protected override void Application_BeginRequest(object sender,EventArgs e)
{
//直接設定所有的可跨域訪問
Response.Headers.Add("Access-Control-Allow-Origin",”*“);
if (Request.Headers.AllKeys.Contains("Origin") && Request.HttpMethod == "OPTIONS")//攔截處理Options請求
{
Response.Headers.Add("Access-Control-Allow-Headers","*");
Response.Headers.Add("Access-Control-Allow-Methods","*");
Response.Flush();
Response.End();
}
base.Application_BeginRequest(sender,e);
}

這樣,對Options跨域請求進行了“可支援跨域”的應答,之後的正式請求到達控制器中的Action,又有相應的跨域訪問處理。那麼對於整個的複雜請求跨域就完成實現了。

微軟官方參考:https://docs.microsoft.com/zh-cn/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api

總結

到此這篇關於ASP.NET WebAPI2複雜請求跨域設定的文章就介紹到這了,更多相關ASP.NET WebAPI2複雜請求跨域設定內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!