javascript - 从本地驱动器建立 API 连接

Question

我正在尝试从本地驱动器访问网站 API 以处理他们的数据。我遵循 MDN 上的 JSON 文档 ( https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/JSON )，效果很好。我可以使用下面的代码访问并获取与文档中所示相同的数据。但是，当我更改为其他网站的 API 时，我收到“Access-Control-Allow-Origin”错误。例如，如果我使用( http://quotesondesign.com/wp-json/posts )。

在网上搜索了一下，似乎与某些服务器上的 CORS 设置有关。我通读了 CORS 文档 ( https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS )，但仍然遇到问题。

一些搜索结果还提到了一种解决方法，例如使用代理，但我不愿意使用它，因为它看起来很笨拙。我还尝试了 Jquery 和 AJAX，但当它尝试打开请求时仍然遇到相同的错误。

   <script>
var header = document.querySelector('header');
var section = document.querySelector('section');
var requestURL = 'https://mdn.github.io/learning-area/javascript/oojs/json/superheroes.json';   

var request = new XMLHttpRequest();
request.open('GET', requestURL);
request.responseTYPE = 'json';
request.send();

request.onload=function() {
    var superHeroes = JSON.parse(request.response);  //Parse the files
    populateHeader (superHeroes);
    showHeroes(superHeroes);
}

...

当我说本地驱动器时，我的意思是我将 html 代码保存在 C:\document 驱动器上的记事本文件中，并在那里运行该文件。有什么建议吗？谢谢。

Answer 1

Web 浏览器默认同意服务器 CORS 策略。开发人员有时会禁用安全保护来进行测试。请务必将其重新打开以进行正常浏览。

与 Chrome on windows ，此标志使该 API 能够为我工作:

chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security

这在特殊用途的快捷方式中效果很好。

有关在 Chrome 和 FireFox 中绕过 CORS 的更多信息，请参见此处: https://pointdeveloper.com/how-to-bypass-cors-errors-on-chrome-and-firefox-for-testing/

更新:在 Firefox 中，禁用“strict_origin_policy”的 about:config 选项受到限制。因此，要使其正常工作，您可以尝试 CORS Everywhere add-on 。这对我在 Firefox 52.8 上有效。

单击 CORS Everywhere 图标后，该图标将切换为绿色，从而启用 CORS。