使用外部 API 处理 Angular 4 中的跨域问题

Question

我正在使用 邮政 PIN 码 API 在 Angular 5 应用程序中通过邮政 PIN 码获取邮局详细信息搜索。以下是外部 API 的 url：

http://postalpincode.in/api/pincode/{**PINCODE}**

我正在从应用程序发出 GET 请求，但它给了我以下错误：

请求的资源上不存在“Access-Control-Allow-Origin”标头。 Origin 'http://localhost:4200' 因此不允许访问

虽然这个请求在浏览器和邮递员中运行良好。我知道我们需要使用跨域策略配置我们的服务器以接受跨域请求，但这是一个外部 API，我无法控制它。我该如何解决这个问题？

提前致谢！！

Answer 1

最佳：CORS 标头（需要更改服务器） CORS（跨域资源共享）是服务器说“我会接受你的请求，即使你来自不同的来源”的一种方式。这需要服务器的配合——因此，如果您无法修改服务器（例如，如果您使用外部 API），则此方法将不起作用。

修改服务器以添加标头 Access-Control-Allow-Origin: * 以启用来自任何地方的跨域请求（或指定域而不是 *）。这应该可以解决您的问题。

第二个选择：代理服务器如果你不能修改服务器，你可以运行自己的代理。如果该代理与您的页面不在同一来源，则此代理可以返回 Access-Control-Allow-Origin 标头。

您无需向某个远程服务器发送 API 请求，而是向您的代理发出请求，代理会将它们转发到远程服务器。

这里有一些代理选项。

参考：https://daveceddia.com/access-control-allow-origin-cors-errors-in-angular/