Angular 2 CORS 解决承诺时的问题

Question

我正在 Angular 中进行服务调用，但它给了我错误

XMLHttpRequest cannot load http://geo.groupkt.com/ip/172.217.3.14/json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access

当我看到网络名称时，我找到了 json，当我看到详细信息时，我找到了响应

Request URL:http://geo.groupkt.com/ip/172.217.3.14/json
Request Method:GET
Status Code:200 OK
Remote Address:127.0.0.1:8888
Response Headers
view source
Age:1
Cache-Control:no-cache, no-store, max-age=0, must-revalidate
Content-Encoding:gzip
Content-Length:232
Content-Type:application/json;charset=UTF-8
Date:Thu, 19 Jan 2017 14:51:51 GMT
Expires:0
Pragma:no-cache
Server:Apache-Coyote/1.1
Vary:Accept-Encoding
Via:1.1 localhost.localdomain
X-Content-Type-Options:nosniff
X-Frame-Options:DENY
X-XSS-Protection:1; mode=block
Request Headers
view source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8,hi;q=0.6,es;q=0.4
Host:geo.groupkt.com
Origin:http://localhost:3000
Proxy-Connection:keep-alive
Referer:http://localhost:3000/
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36

我现在怀疑即使网络发出呼叫，CORS 也会发生？ 为什么会这样说，又是我调试代码的时候没能成功。

Answer 1

CORS 可防止您的 JavaScript 调用外部服务器（例如，由于 XSS）。为了让您的应用程序有权连接到您的服务器，它需要使用一些标头进行响应：

Access-Control-Allow-Origin: yourHost.com   <the most important one>
Access-Control-Allow-Methods: POST, GET, OPTIONS <list of methods which you want to perform>
Access-Control-Allow-Headers: authorization, content-type
Access-Control-Allow-Credentials: true

有关标题的更多信息： https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers部分CORS

您可以在这里阅读更多内容：

https://www.w3.org/TR/cors https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS