Angular 5不包含http请求的标头

Question

我正在尝试非常简单的角度5 http'GET'请求。当我检查chrome开发人员工具时，看不到http标头。

import { HttpClient, HttpHeaders } from '@angular/common/http';
   // ...

   const headers = new HttpHeaders(
      {
        'Authorization': 'Basic ' + btoa(user.username + ':' + user.password)
      }
    );
    this.http.get('xyz-url', { headers }).subscribe((data: any) => {
      // do something
    });

Answer 1

我建议您为此创建拦截器：

@Injectable()
export class TokenInterceptor implements HttpInterceptor {
  // ...

  public intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    request = request.clone({
      setHeaders: {
        Authorization: 'Basic ' + btoa(user.username + ':' + user.password)
      }
    });
    return next.handle(request);
  }
  // ...
}

Answer 2

您可以在“网络”标签中看到

Answer 3

将标头设置为标头属性

this.http.get('xyz-url', { headers : headers }).subscribe((data: any) => {
  // do something
});

此外，请检查network标签以查看请求的详细信息，例如标题。

Answer 4

尝试一下。

从'@ angular / common / http'导入{HttpHeaders};

const httpOptions = {
  headers: new HttpHeaders({
    'Content-Type':  'application/json',
    'Authorization': 'my-auth-token'
  })
};

this.http.get('xyz-url', { httpOptions }).subscribe((data: any) => {
      // do something
});

了解有关在here中添加http标头的更多信息

Answer 5

我认为它可以解决您的问题

# app/models/foo.rb
class Foo < ActiveRecord

# lib/external_service/foo.rb
module ExternalService
  class Foo

# lib/external_service/bar.rb
module ExternalService
  class Bar
    attribute :foo, Foo # not the model