Заголовки не отправленные угловые-5 - PullRequest
Новая
       30

Заголовки не отправленные угловые-5

0 голосов
/ 17 мая 2018

Хочу отправить токен авторизации в моих заголовках, пробовал два разных подхода, но ни один из них не отправляет токен, который я использую для запроса на публикацию:

Подход 1 использует перехватчик :

   @Injectable()
export class AuthInterceptor implements HttpInterceptor {
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    console.log('inter')
    const authHeader = 'JWT eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbWFpbasdImahQHNdwc25ldC5jb20iLCJ1c2VySWQiOjk5MjI2MDYsImlhdCI6MTUyNjQ2Mzc2NywiZXhwIjoxNTI2NjM2NTY3fQ.v9RjU25kt-neRFHl8P3q5k4VokpJdNm1Kgn7BU10Zoc';
    // Clone the request to add the new header.
    const authReq = req.clone({headers: req.headers.set('Authorization', authHeader)});
    // Pass on the cloned request instead of the original request.
     console.log('intercepted') //got this message in console
    return next.handle(authReq);
  }
}

функция post 

   post(url: String, data: any) {

    return this.http.post(url, data)
      .map(res => res)
      .catch(this.handleError);
  }

добавлено в app.module.ts при печати консоли на сервисе. Я вижу сообщениена моей консоли

да перехватили, но получили это изображение в результате:

no headers present

Второй подход гораздо проще и использовал его в angular2но получая ошибку с angular5 

      post(url: String, data: any) {
    const headers = new Headers({'Content-Type': 'application/json'});
    headers.append('Authorization',  'JWT eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyasdasdasImhhbXphQHNwc25ldC5jb20iLCJ1c2VySWQiOjk5MjI2MDYsImlhdCI6MTUyNjQ2Mzc2NywiZXhwIjoxNTI2NjM2NTY3fQ.v9RjU25kt-neRFHl8P3q5k4VokpJdNm1Kgn7BU10Zoc');
    const options = new RequestOptions({headers});
    return this.http.post(url, data)
      .map(res => res)
      .catch(this.handleError);
  }

получая эту ошибку

response

то же самое работает с опциями запроса angular2, но не с angular5

Токен правильно проверен, и я отправляю запрос через POSTMAN

Ответы [ 2 ]

0 голосов
/ 17 мая 2018

Это связано с тем, как работает CORS. Браузеры, как правило, не отправляют пользовательские заголовки, такие как Authorization заголовок в OPTIONS запросах. Вам нужно исправить свой сервер так, чтобы он не ожидал заголовка Authorization для OPTIONS запроса

0 голосов
/ 17 мая 2018

Вот как я это делаю с Angular5 

intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>
{ 
  request = request.clone({
    setHeaders: 
    {
      // Adding Authorization header with token stored in local storage
      Authorization: `Bearer ${localStorage.getItem("token")}`
    }
  });

  return next.handle(request).do((event: HttpEvent<any>) =>
  {
    if (event instanceof HttpResponse)
    {
      // You can do something with success response here
    }
  },
  (err: any) =>
  {
    // Do something with errors here
    if (err instanceof HttpErrorResponse)
    {
      // On UNAUTHORIZED, navigate to login page and clear token from local storage
      if (err.status == 401)
      {
        this.router.navigate(["login"]);
        localStorage.clear();
      }
  }
});
...