【问题标题】:Angular2: make the browser call an api on a subdomainAngular2:让浏览器调用子域上的 api
【发布时间】:2017-08-05 00:08:04
【问题描述】:

我提供来自mysite.com 的 angular2 webapp

我的 webapp 正在从浏览器调用 nodejs 后端。

目前我使用mysite.com/api/ 调用api。

出于系统架构的原因,我希望通过使用子域以不同的方式调用 api:

api.mysite.com/

如何解决跨域问题?

【问题讨论】:

  • 配置api.mysite.com 以发送Access-Control-Allow-Origin 响应标头和您的方案中可能需要的任何其他Access-Control-* 响应标头。见developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
  • 这仅适用于图像或其他静态资源,不适用于 xhr 请求。我们谈论的是客户端,而不是服务器端的 cors 问题
  • 如果无权在 api.mysite.com 上配置任何内容,那么如果不使用代理 stackoverflow.com/questions/20035101/…,就无法“摆脱跨域问题”。
  • 但是如果您确实有权在api.mysite.com 配置 Web 服务器,那么您可以对其进行配置以使其与跨域 XHR 请求一起工作。至少,您只需将其配置为在响应中发送Access-Control-Allow-Origin 响应标头。如果是这样,并且您的 XHR 请求是一个不会触发预检的简单请求,那么您只需要这样做即可。
  • 文件由 google cloud cdn 在云存储桶上提供服务。我可以设置元数据,所以应该没问题。但我不确定我的请求只是简单的获取请求。明天早上试试

标签: node.js angular cross-domain


【解决方案1】:

使用JsonP看看这里:Jsonp

 import { JsonP } from '@angular/http"; 
 @Injectable()
 export class dataService{
      constructor(jsonp:Jsonp) {

      }

      getData(){
        let url = 'http://api.mysite.com&c=JSONP_CALLBACK';
        jsonp.request(url, { method: 'Get' })
         .map( res => /...);
      }
    }

【讨论】:

  • 谢谢,将对此进行测试。您能否详细说明这如何解决跨源问题,我认为它对人们有用:) 感谢您的编辑,非常有用!
  • 我没有资格,但是你可以参考wiki:en.wikipedia.org/wiki/JSONP
  • 别忘了在你的 AppModule 中导入 JsonpModule
  • 您的链接 403s?
猜你喜欢
  • 2012-08-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-02-02
  • 1970-01-01
  • 2014-08-10
  • 1970-01-01
  • 2017-01-23
相关资源
最近更新 更多