解決 ASP.NET Core 6 CORS 問題:headers 未被正常傳送(網頁無法接收 header)

筆者使用 ASP.NET Core 6 建立後端程式,讓使用者可以下載檔案。本來一切正常,但是突然要使用 axios 接收檔案,檔案很容易就抓到,但是檔名卻一直錯誤。
檔名通常會放在 header 的 Content-Disposition 中,在使用瀏覽器中的 F12 開發人員工具都有看到,使用 Postman 也一樣,但是使用 axios 抓取時 header 卻只有三個,一直沒有看到 Content-Disposition。

奮鬥許久,突然想到之前寫的一篇 呼叫 API 發生 CORS 錯誤的原因和 ASP.NET Core 6 的解決方式 ,也是使用瀏覽器中的 F12 開發人員工具和 Postman 都能夠取得資料,但是使用 Axios 就不能。

莫非,這也是因為 CORS?!

經過一翻研究,沒錯,又是 CORS 在搞我(其實是自己菜)!因為在上一篇我們已經設定允許跨來源請求,所以現在只要再加上一行就可以讓瀏覽器放行 Content-Disposition 這個 header,讓網頁順利讀取到檔案名稱!
    
builder.Services.AddCors(options =>
{
    options.AddDefaultPolicy(builder =>
    {
        builder
        	.AllowAnyOrigin()
            .AllowAnyMethod()
            .AllowAnyHeader()
            .WithExposedHeaders("Content-Disposition");
    });
});
    

留言

  1. 非常感謝﹐你解決了我的困擾﹐只是微軟這設計真奇怪﹐明明已經 AllowAnyHeader了卻還要另外設定﹐看來 Any 不一定是 Any

    回覆刪除

張貼留言

如果有任何問題、建議、想說的話或文章題目推薦,都歡迎留言或來信: a@ruyut.com