Добавить аутентификацию в запрос OPTIONS

Как я могу добавить заголовки к OPTIONS запрос сделан к междоменному API?

API, с которым я работаю, требует, чтобы токен JWT был установлен как Authorization заголовок по всем запросам.

Когда я пытаюсь получить доступ к API, Angular сначала выполняет OPTIONS запрос, который не заботится о моих заголовках, которые я настроил для "реального" запроса, например:

this._headers = new Headers({
    'Content-Type': 'application/x-www-form-urlencoded',
    'Authorization': 'Bearer my-token-here'
});

return this._http
            .post(AppConfig.apiUrl + 'auth/logout', params, {headers: this._headers})
            ...
            ...

Если токен не предоставлен, API возвращает HTTP-статус 401, и Angular считает, что OPTIONS запрос не выполнен

3 ответа

Решение

Согласно спецификации CORS при выполнении предполётного запроса учетные данные пользователя исключаются.

(...) используя метод OPTIONS и со следующими дополнительными ограничениями:

  • (...)
  • Исключить заголовки запроса автора.
  • Исключить учетные данные пользователя.
  • (...)

(акцент мой)

Имея это в виду, проблема, кажется, на стороне API вещей, которые должны быть приняты OPTIONS запросы без аутентификации.

Если вы используете шаблон Cloudformation, вы должны объявить AddDefaultAuthorizerToCorsPreflightв качестве falseкак в этом примере:

      MyApiGateway:
  Type: AWS::Serverless::Api
  Properties:
    StageName: !Ref Stage
    Auth:
      Authorizers:
        CognitoAuthorizer:
          UserPoolArn: !GetAtt UserPool.Arn
      DefaultAuthorizer: CognitoAuthorizer
      AddDefaultAuthorizerToCorsPreflight: false
    Cors:
      AllowMethods: "'POST,OPTIONS'"
      AllowHeaders: "'Access-Control-Allow-Origin,Content-Type,X-Amz-Date,Authorization,X-Api-Key,x-requested-with,x-requested-for'"
      AllowOrigin: "'*'"

Это позволит OPTIONS принимать запросы без заголовков авторизации.

Можно обеспечить аутентификацию для запросов предварительной проверки CORS, используя withCredentials вариант:

      @Injectable()
export class AuthInterceptor implements HttpInterceptor {
  constructor() {
  }

  intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    request = request.clone({
      withCredentials: true
    });
    return next.handle(request);
  }
}

Смотрите также:

/questions/22814331/uglovoj-2-http-s-uchetnyimi-dannyimi/22814345#22814345

Другие вопросы по тегам