Question

我正在编写一个React JS应用程序，从localhost：8080运行，然后是我自己的网站，向the API that openweathermap.org provides发出AJAX调用。

然后它让我想知道，对于本地主机：8080和我的网站，比如说www.mysite.com，是不是从http://api.openweathermap.org/data/2.5/forecast获取数据的AJAX调用违反了同源策略？

如果样本实际上是在GitHub页面上托管的，那么AJAX调用实际上无法通过，因为GitHub页面现在使用https，而对API的AJAX调用使用http并且不能https，它无法获取数据。

P.S。很确定AJAX不是通过JSONP完成的，因为我实际上在控制台中看到了请求已经完成，而响应只是纯JSON数据。（因此没有使用脚本标记方法）。

Answer 1

http://api.openweathermap.org/data/2.5/forecast发送Access-Control-Allow-*标题：

$ curl -I http://api.openweathermap.org/data/2.5/forecast
HTTP/1.1 401 Unauthorized
Server: openresty
Date: Sat, 01 Apr 2017 02:11:30 GMT
Content-Type: application/json; charset=utf-8
Content-Length: 107
Connection: keep-alive
X-Cache-Key: /data/2.5/forecast?
Access-Control-Allow-Origin: *
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: GET, POST

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS解释了这些响应标头对浏览器的影响 - 但要点是，如果在浏览器中运行的客户端JavaScript代码发送跨源请求，并且返回的响应包括Access-Control-Allow-Origin响应标头，然后浏览器将对您的代码公开该响应。但如果响应不包含Access-Control-Allow-Origin响应标头，则浏览器将不允许您的代码访问响应。

为什么AJAX调用提供API的其他网站不违反同源策略？

1 个答案: