Angular 5 не включает заголовки для HTTP-запроса

Question

Я пытаюсь выполнить очень простой угловой запрос http 5 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

Я думаю, что это может решить вашу проблему

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

@Injectable()
export class HttpService {

    constructor(private httpClient: HttpClient) {
    }
       /**
        * Request options.
        * @param headerOptions
        * @returns {RequestOptionsArgs}
        */

        private requestOptions(headerOptions?: any): any {
            let options = {
                        headers: new HttpHeaders({
                            "Authorization": "Bearer " + 
                             this.session.get('token),
                            "Content-Type": "application/json"
                        })
                    }

            } 
            return options;
        }
/**
     * This method is use for send GET http Request to API.
     * @param url - Additional request URL.
     * @param body - params.
     * @param options  - Header(s) which will pass with particular request.
     */
    get(url: string, options?: any): Observable<any> {

        return this.httpClient.get(url, this.requestOptions(options))
    }

Answer 2

Попробуйте это.

import {HttpHeaders} из '@ angular / common / http';

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

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

Подробнее о добавлении заголовков http в здесь

Answer 3

Я бы порекомендовал вам создать перехватчик для этого:

@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 4

Установить заголовки в свойство заголовка

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

Кроме того, перейдите на вкладку network, чтобы увидеть подробности запроса, такие как заголовки.

Answer 5

Вы можете увидеть в «вкладке сети»