Angular2 http.request无法添加页眉 [英] Angular2 http.request not able to add headers

问题描述

我在Angular2打字稿这个code，其中我尝试添加页眉像下面这样。

I have this code in Angular2 TypeScript where I am trying to add headers like the following.

['access-token', localStorage.getItem( 'token' )],
['client', localStorage.getItem( 'client' )],
['uid', localStorage.getItem( 'email' )],
['withCredentials', 'true'],
['Accept', 'application/json'],
['Content-Type', 'application/json' ]

发送请求我看不到头在我的要求。
我工作的一个跨域设置。有一些其他的方式来做到这一点？

While sending the request I can't see the headers in my request. I am working on a cross domain setup. Is there some other way to do it?

private _request(url: string | Request, options?: RequestOptionsArgs) : Observable<Response> {

    let request:any;
    let reqOpts = options || {};
    let index:any;

    if(!reqOpts.headers) {
        reqOpts.headers = new Headers();
    }

    for( index in this._config.authHeaders ) {
        reqOpts.headers.set( this._config.authHeaders[index][0], this._config.authHeaders[index][1] );
    }

    request = this.http.request(url, reqOpts);

    return request;
}

这是我的响应头

推荐答案

如果您的请求是跨域之一，所以CORS的概念也适用。你可以看看这个链接了解详情： HTTP： //restlet.com/blog/2015/12/15/understanding-and-using-cors/ 。当然，作为冈特说，有些事做在服务器端返回CORS头，让你的浏览器来处理响应。

If your request is a cross domain one so CORS concepts apply. You can have a look at this link for more details: http://restlet.com/blog/2015/12/15/understanding-and-using-cors/. Sure, as Günter said, there is something to do on the server side to return the CORS headers to allow your browser to handle the response.

下面是添加页眉在HTTP请求中的示例服务：

Here is a sample service that adds headers in an HTTP request:

export class MyService { 
  constructor(private http:Http) {
  }

  createAuthorizationHeader(headers:Headers) {
    headers.append('Authorization', 'Basic ' +
      btoa('a20e6aca-ee83-44bc-8033-b41f3078c2b6:c199f9c8-0548-4be7-9655-7ef7d7bf9d33')); 
  }

  getCompanies() {
    var headers = new Headers();
    this.createAuthorizationHeader(headers);

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

修改

我刚才看到你尝试设置 withCredential 头。我认为你混用不同的东西。 withCredentials 不是一个标准的头，但有XHR的JavaScript对象在 withCredentials 属性。请参阅此链接：的https：//developer.mozilla .ORG / EN-US /文档/网络/ API / XMLHtt prequest / withCredentials 。这应该工作而无需使用 withCredentials 自定义标题。

I just saw that you try to set the withCredential header. I think that you mix different things. withCredentials isn't a standard header but there is a withCredentials property on the XHR JavaScript object. See this link: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials. This should work without using the withCredentials custom header.

在此提醒您，如果您想使用自定义标题，您需要将接入控制允许标题报头内添加服务器端。

As a reminder, if you want to use a custom header, you need to add it on the server side within the Access-Control-Allow-Headers header.

希望它可以帮助你，
蒂埃里

Hope it helps you, Thierry

这篇关于Angular2 http.request无法添加页眉的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！