基於資料安全的原則,瀏覽器預設禁止跨網域連線,避免惡意網站讀取其他網站敏感資料。
因此實作Web API Client端呼叫時便會出現,Enabling Cross-Origin Requests 錯誤訊息。
以下是我遇到這個錯誤訊息的處理解決方法,供參考!
Step1: 加入NuGet套件,開啟Package Manager Console,輸入 Install-Package Microsoft.AspNet.WebApi.Cors
Install-Package Microsoft.AspNet.WebApi.Cors
Step2: 修改 App_Start/WebApiConfig.cs
using System.Web.Http;
namespace WebService
{
public static class WebApiConfig
{
public static void Register(HttpConfiguration config)
{
// New code
config.EnableCors(); //加入此段設定
config.Routes.MapHttpRoute(
name: "DefaultApi",
routeTemplate: "api/{controller}/{id}",
defaults: new { id = RouteParameter.Optional }
);
}
}
}
Step3:選擇在Controller或Action加入
[EnableCors(origins: "請輸入請求端URL",headers: "*", methods: "*")]//"*" 代表允許任何來源
[EnableCors(origins: "*",headers: "*", methods: "*")]//允許任何來源寫法,方便測試階段使用
加在Controller
using System.Net.Http;
using System.Web.Http;
using System.Web.Http.Cors;
namespace WebService.Controllers
{
[EnableCors(origins: "http://mywebclient.azurewebsites.net", headers: "*", methods: "*")]
public class TestController : ApiController
{
// Controller methods not shown...
}
}
加在各個不同Action上
public class ItemsController : ApiController
{
[EnableCors(origins: "http://www.example.com", headers: "*", methods: "*")]
public HttpResponseMessage GetAll() { ... }
public HttpResponseMessage GetItem(int id) { ... }
public HttpResponseMessage Post() { ... }
public HttpResponseMessage PutItem(int id) { ... }
}