Question

试图理解为什么这样一个简单的休息调用api不能从localhost工作（使用angular-cli）。

这是服务代码：

commandsUrl ='http://www.mocky.io/v2/...';
  headers = new Headers({ 'Access-Control-Allow-Origin': '*' });
  options = new RequestOptions({ headers: this.headers, withCredentials: true });

  getMyList (): Observable<any> {
    return this.http.get(this.commandsUrl, this.options)
      .map(this.extractData)
      .catch(this.handleError);

  }
  private extractData(res: Response) {
    let body = res.json();
    return body.data || { };
  }
  private handleError (error: Response | any) {
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }

浏览器的错误是：

XMLHttpRequest无法加载http://www.mocky.io/v2/ ...响应预检请求未通过访问控制检查：否请求中存在“Access-Control-Allow-Origin”标头资源。因此不允许来源“http://localhost:4200” 访问。

Answer 1

您必须阅读CORS。在发送真正的AJAX请求之前，GET会发送一个OPTIONS请求，并且服务器必须使用“Access-Control-Allow-Origin”标题进行响应，这些标题允许您访问它。

即，“http://www.mocky.io/v2/ ...”的服务器必须配置为接受来自服务器的CORS请求（或使用通配符）

https://www.html5rocks.com/en/tutorials/cors/

试图理解为什么简单的角度2 http.get（）无法在localhost

1 个答案: