Как вызвать API с токеном - PullRequest
Новая
       35

Как вызвать API с токеном

0 голосов
/ 18 декабря 2018

У меня есть API, который будет вызываться с использованием токена.

В настоящее время в интерфейсе Swagger я могу аутентифицировать этот API с помощью токена

Пример, если я добавлю «Token 6ec8f4023d8148209749a1ed972xxxx» в авторизациюbox

См. ниже:

Authorize Box

, который находится справа вверху, я мог бы ввести токен, показанный выше, и аутентифицировать

enter image description here

После нажатия на кнопку «Аутентификация» она выглядит так, как вошли в систему, как показано ниже:

enter image description here

Теперь я могу вызвать API, перечисленные в пользовательском интерфейсе Swagger, нажав кнопку «Выполнить», и я могу увидеть данные json, перечисленные там.

enter image description here

Вышеуказанный APIМне нужно позвонить через Angular, я знаю, что могу использовать функцию get из службы Angular,

Не могли бы вы подтвердить код, который я должен добавить в заголовок?

Например: ниже нет возможности поместить токен в заголовок, только опция - имя пользователя и пароль.Как мне передать токен? 

getToken() {
    let headers: HttpHeaders = new HttpHeaders();
    headers = headers.append('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
    return this.http.post('http://myapi/api.php/user', {
      username: 'admin',
      password: 'password'
    }, { headers });
  }

Ответы [ 2 ]

0 голосов
/ 18 декабря 2018

Лучший способ сделать это - реализовать Перехватчик : 

@Injectable()
export class TokenInterceptor implements HttpInterceptor {

  constructor(public auth: AuthService) {}

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

    request = request.clone({
      setHeaders: {
        Authorization: `${this.auth.getToken()}`
      }
    });

    return next.handle(request);
  }
}

Перехватчик меняет каждый HTTP-запрос, который вы делаете.В этом случае он добавляет заголовок авторизации.

Не забудьте включить Interceptor в ваш AppModule: 

  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: TokenInterceptor,
      multi: true
    }
  ]

Полный пример здесь

Грязный и быстрый способ: 

this.http.post('http://myapi/api.php/user', {
      username: 'admin',
      password: 'password'
    }, { headers: new Headers({'Authorization': token}) });
0 голосов
/ 18 декабря 2018

Вы можете использовать Angular Headers для установки значения: 

import {Headers} from 'angular2/http';
var headers = new Headers();
headers.append(headerName, value);

headerName вы можете поставить токен и значение здесь.Затем в бэкэнде вы можете извлечь значение из заголовка запроса и проверить его.

Лучший способ - реализовать перехватчик HTTP.Создайте перехватчик и добавьте его в свой app.module.ts.Он прикрепляет токен каждый раз, когда вы делаете HTTP-запрос.

...