Question

我想使用angular2 typescript从另一个域调用Web服务。我正在使用以下代码来调用api

    var req_dict = { 
               method: RequestMethod.Get,
               url: 'http//127.0.0.1:5000/users/',
               headers: this.head
              }
    var options = new RequestOptions(req_dict);
    var req = new Request(options);
    this.http.request(req).subscribe({});

我在http // 127.0.0.1：8000中托管了我的应用程序。我想从端口5000使用api。当我检查控制台时，请求即将发生的 http://127.0.0.1:8000/http//127.0.0.1:5000/users/ 我只想打电话给 http // 127.0.0.1：5000 / users / 。如何在angular2中通过绝对URL调用api？

Answer 1

事实上，它不是TypeScript或Angular2的问题，而是CORS问题。这些博客文章可以帮助您详细了解其工作原理：

简而言之，在跨域请求的情况下，浏览器会自动在请求中添加Origin标头。有两种情况：

简单请求。如果我们使用HTTP GET，HEAD和POST方法，则此用例适用。对于POST方法，仅支持具有以下值的内容类型：text/plain，application/x-www-form-urlencoded和multipart/form-data。
预检请求。当＆＃34;简单请求＆＃34;用例不适用，第一个请求（使用HTTP OPTIONS方法）用于检查在跨域请求的上下文中可以做什么。

因此实际上大多数工作必须在服务器端完成以返回CORS头。主要的是Access-Control-Allow-Origin。

200 OK HTTP/1.1
(...)
Access-Control-Allow-Origin: *

要调试此类问题，您可以在浏览器中使用开发人员工具（“网络”标签）。

关于Angular2，只需像任何其他请求一样使用Http对象（例如，相同的域）：

return this.http.get('https://angular2.apispark.net/v1/companies/')
           .map(res => res.json()).subscribe(
  ...
);

希望它可以帮到你，亨利

如何从另一个域角度打字稿调用api？

1 个答案: