Angular 2 个 http 服务中的访问控制允许来源问题

Question

我在从 laravel 服务器获取数据时遇到问题。

这是客户端代码：

private surveysUrl = 
'http://107.170.59.79/services/public/api/v1/countries';
private headers = new Headers({'Content-Type': 'application/json'});

constructor(private http: Http) { }

getSurveys(): Promise<Survey[]> {
return this.http.get(this.surveysUrl)
   .toPromise()
   .then(response => response.json() as Survey[])
   .catch(this.handleError);
}

但我收到的错误如下：

XMLHttpRequest 无法加载 {{link 设置在变量 "surveysUrl"}} 中。 'Access-Control- Allow-Origin' header 的值 '{{Some random link}}' 不是等于提供的原点。因此，来源 'http://localhost:4200' 是不允许访问。

我该如何解决这个错误？

PS：我不允许 post 超过两个 link，所以我不得不从错误消息中删除 link。我已将其替换为 {{ }} 以使其可读。

Answer 1

如果您使用的是 apache，那么您需要允许原始访问，即

Header set Access-Control-Allow-Origin "*"

将其包含在 .htaccess 文件中。

Angular 2 个 http 服务中的访问控制允许来源问题

Access Control Allow Origin issue in Angular 2 http services

javascript

cors

angular-http

angular-services

angular