angularjs – Angular2到REST WebApi CORS问题

发布时间：2020-12-17 07:42:56 所属栏目：安全来源：网络整理

导读：我正在使用angular2前端和WebApi后端. webapi启用CORS var cors = new EnableCorsAttribute("*","*","*");GlobalConfiguration.Configuration.EnableCors(cors); 它的作品,因为我有不同的网站(jquery / javascript)使用这个api.但是对于角度2,它不会.我收到

我正在使用angular2前端和WebApi后端.
webapi启用CORS

var cors = new EnableCorsAttribute("*","*","*");
GlobalConfiguration.Configuration.EnableCors(cors);

它的作品,因为我有不同的网站(jquery / javascript)使用这个api.但是对于角度2,它不会.我收到以下消息：

Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

也许与“预检要求”有关？

谢谢你的帮助.
马科斯

我的Angular2应用程序中有同样的问题.
如已经说明的那样,问题在于,在客户端发出的每个请求都将预检要求发送到服务器之前.

这种请求有一个OPTIONS类型,服务器有责任发送状态为200的预检应答,并设置接收来自该客户端的请求的头文件.

这是我的解决方案(带快递)：

// Domain you wish to allow
res.setHeader('Access-Control-Allow-Origin','http://localhost:3000');

// Request methods you wish to allow
res.setHeader('Access-Control-Allow-Methods','GET,POST,PUT,DELETE');

// Request headers you wish to allow
res.setHeader('Access-Control-Allow-Headers','YOUR-CUSTOM-HEADERS-HERE');

// Set to true if you need the website to include cookies in  requests
res.setHeader('Access-Control-Allow-Credentials',true);

// Check if preflight request
if (req.method === 'OPTIONS') {
    res.status(200);
    res.end();
}
else {
    // Pass to next layer of middleware
    next();
}

如您所见,我设置标题,然后如果请求类型为OPTIONS,则提取.在这种情况下,我发回状态200并结束响应.

以这种方式,客户端将被授权,您还可以在所有请求中设置自定义标头.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!