Question

我已经挣扎了很长时间，已经向第三方REST Api发出了一个简单的GET请求。我已经阅读了一些教程和SO问题，但我无法让它发挥作用。我收到了两个错误之一

预检的响应无效（重定向）

或（如果通过https）

对预检请求的响应未通过访问控制检查：否＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。起源＆＃39; https://localhost:8433＆＃39;因此不允许访问。

关于第二条消息：服务器不支持CORS只是一个问题吗？

我的代码：

＆＃13;

var xmlHttp = new XMLHttpRequest();
var url = 'https://inspirehep.net/record/451647?of=recjson&ot=recid,number_of_citations,authors,title'; //http or https, tried both

/* 
   doing sth with response here like populate dropdown etc.
*/

xmlHttp.open('GET', url, true);
xmlHttp.setRequestHeader("Access-Control-Allow-Headers", "Content-Type, X-Requested-With, Cache-Control");
xmlHttp.setRequestHeader("Content-Type", "application/json");
xmlHttp.setRequestHeader("Access-Control-Allow-Origin", '*');
xmlHttp.setRequestHeader("Access-Control-Allow-Methods", "GET, POST, OPTIONS");
xmlHttp.setRequestHeader("Access-Control-Allow-Credentials", "true");
xmlHttp.send();

＆＃13;

整个应用程序在node.js服务器（localhost）上运行，上面的脚本作为单独的文件包含在.html视图中。

我可以正确地从网络浏览器，小提琴手，邮递员等获取此API的json响应。我还尝试了不同的API（例如Openweather API），认为它是服务器配置的问题，但结果是一样的。

我会感谢任何帮助 - 也许我只是误解了一些关于CORS的东西。

Answer 1

您无法从浏览器设置标题，如果目标网址在您的服务器或您管理的服务器上运行且该服务器运行nodejs，您可以使用cors https://www.npmjs.com/package/cors，但是，如果这是第三方网址，它不允许CORS，那么您应该通过从服务器到第三方服务器配置代理来从您的后端发出请求，这应该可以解决您的问题。

Answer 2

CORS与nodejs的答案很可能是正确的，但我想建议您运行测试以确保您的代码也正常工作。

尝试使用Chrome并下载扩展程序以允许CORS。这样，您将在尝试正确的解决方案之前先测试功能。

Answer 3

如果您不知道如何使用后端服务，建议您使用Web代理。 Web服务器不受同一原始策略的限制。因此，Web服务器可以从另一个域上的服务器请求数据。按照以下步骤使用此api：http://cors-anywhere.herokuapp.com/

const webProxy="http://cors-anywhere.herokuapp.com/"
const apiKey=`${webProxy}https://inspirehep.net/record/451647?of=recjson&ot=recid,number_of_citations,authors,title`

基本上，此网络代理将从inspirehep.net请求数据，将其托管并传递给您。 CDN就是这样工作的。 CDN托管其他站点可以使用的文件

Answer 4

迟到的聚会...

http://cors-anywhere.herokuapp.com/很不错，但是如果您使用XMLHttpRequest（）和GET方法，则不需要它。只需排除您的标头请求...

navigate(['desktop-layout', { outlets: { multiUseMenu: 'idrlogviewer' } }])

Javascript CORS GET请求被阻止或无效

4 个答案: