.NET Core WebApi 加入CORS
有時候我們希望測試Client端呼叫Server的Api,但若domain不相同或是沒有合理的開放的話,Browser會直接進行安全性的封鎖
<html>
<head>
</head>
<body>
<script language="javascript">
window.onload = function(e){
// Make a request for a user with a given ID
axios.get('https://localhost:5001/api/test/history')
.then(function (response) {
// handle success
console.log(response.status);
})
.catch(function (error) {
console.log(error.response.status);
// handle error
console.log(error);
})
.then(function () {
// always executed
});
}
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.27.2/axios.min.js" integrity="sha512-odNmoc1XJy5x1TMVMdC7EMs3IVdItLPlCeL5vSUPN2llYKMJ2eByTTAIiiuqLg+GdNr9hF6z81p27DArRFKT7A==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
</body>
</html>

若我們真的去打了一個404不存在的網頁,但實際上Server有接到請求,所以回的了404,但是js端卻會因為CORS的Policy導致報錯,這個錯誤的例外,會導致js拿到ERR_NETWORK而且也無其他訊息或完整的異常資訊
.Net Core Startup.cs中,找到以下段落
//public void ConfigureServices(IServiceCollection services)內
services.AddCors(options => { options. AddPolicy(name: "MyAllowSpecificOrigins", policy => { policy. AllowAnyOrigin() . AllowAnyHeader(); }); });
//public void Configure(IApplicationBuilder app, IWebHostEnvironment env)內
app.UseRouting();
app.UseCors("MyAllowSpecificOrigins");
app.UseSentryTracing(); // 要啟用 Sentry 上的 Performance Monitoring 需加這行
app.UseAuthentication();
備註:UseCors的呼叫必須放在UseRouting之後 ,但在UseAuthorization之前,若有具名的policy,就也要具名UseCors加進來,若有具名但沒有UseCors(“xxxxxx”)的話,仍視為無效
所以成功加進去後,axios套件也是可以抓到

MSDN Reference∶ https://docs.microsoft.com/zh-tw/aspnet/core/security/cors?view=aspnetcore-6.0