Angular 2 CORS问题

我有以下Angular 2 http请求;Angular 2 CORS问题

const endpoint = '<auth_url>'; 
 
const body = { 
 
    prompt: 'consent', 
 
    grant_type: 'authorization_code', 
 
    redirect_uri: '<redirect_url>', 
 
    code: '<authorization_code>' 
 
}; 
 

 
const headers = new Headers(); 
 
headers.append('Authorization', 'Basic <auth>'); 
 
headers.append('Content-Type', 'application/x-www-form-urlencoded') 
 

 
const options = new RequestOptions({ headers }); 
 

 
this.http.post(endpoint, body, { headers: headers }) 
 
.map(res => res.json()) 
 
.subscribe(
 
    data => console.log(JSON.stringify(data)), 
 
    error => console.error(JSON.stringify(error)), 
 
() => console.log('Request complete') 
 
);

这是连接到已经连接到ExpressJS实例node-oidc-provider，我遇到的问题是CORS作为请求的，因为预检的服务器上OPTIONS结束。这应该不是这样，因为我已经指定了Content-Type标题，如上所见。令人讨厌的是，我试图弄清楚这是服务器还是我的Angular2代码的问题？

我是否需要在ExpressJS应用程序上显式启用CORS，如果没有，为什么要在POST上设置正确的标题没有任何影响？

来源

2017-02-03 MindVox

CORS需要在服务器上配置。在JS中没有什么可以做的（因此Angular也不能）。在某些情况下，可以使用JSONP解决这个问题，但这非常有限。 –

谢谢，请参阅我的评论下面的答案 – MindVox

是的，你需要在服务器端启用CORS。那就是如果你在服务器上有控制权。这里是应该从服务器返回启用CORS

Access-Control-Allow-Origin: * 
Access-Control-Allow-Methods: GET,POST,PUT,DELETE 
Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept

你可以分享你的服务器，如果你想从代码或Web服务器自身添加这些头像一些细节的头。

关于在POST请求中设置标题的原因没有效果的问题。浏览器在您的XHTTP请求之前发出OPTION请求，以向服务器询问有关接受CORS的权限。

所以，如果你在服务器上有控制权，那么你可以添加我之前提到的标题。如果没有，那么你可以使用一些浏览器插件来克服这个检查。

这里是开发工具，网络选项卡应该怎么看起来像

来源

2017-02-03 10:44:25

有一件事，但如果我向这个服务器发出curl请求，我会得到预期的响应，并且没有设置'Content-Type'头部，我也可以将该头部设置为POSTMAN并获得所需的响应。节点应用程序在PhusionPassenger的NGINX实例后面，所以我可以在那里添加它们，对吧？奇怪的是，这个请求使用上述技术，但不适用于Angular？ – MindVox

由于“浏览器”正在进行印前检查，因此它并不适用于角度。从curl或邮递员那里，POST请求会像其他任何请求一样直接进入服务器。 CORS检查由浏览器强制执行。是的，你可以直接将它们作为固定标题添加到服务器中。我的建议是从代码中添加它们以更好地控制它。 –

出于安全原因，浏览器限制从javascript内发起的跨源HTTP请求。在浏览器中运行角度:) – PierreDuc

Angular 2 CORS问题

回答

相关问题