fetch API: невозможно добавить авторизацию в заголовок запроса с помощью Chrome

Версия Chrome: 57.0.2987.

На самом деле, в более старой версии Chrome у меня тоже есть эта проблема. Я добавил Authorization в заголовок запроса с моим токеном доступа,

fetch('https://example.com/endpoint', {
  method: 'GET',
  headers: {
    'Authorization': 'Bearer ' + accesstoken
  }  
})

Я всегда получаю Access-Control-Allow-Headers:authorization в заголовке ответа в Chrome. Кроме того, My fetch всегда использует метод запроса: OPTIONS (не отображать GET), тогда Status Code соответствует 200 OK в Chrome.

Но если я запускаю тот же код выборки в Firefox (версия 52.0.1), все работает отлично. Я могу правильно добавить Authorization в Заголовок запроса. Он не будет отображать Access-Control-Allow-Headers:authorization в заголовке ответа в Firefox. Он будет отображать Authorization: Bearer accesstoken в заголовке запроса.

Сторона сервера уже обработала CORS для моего заголовка запроса.

Это ошибка Chrome или ошибка моего кода? Как мне правильно сделать Authorization в Заголовке запроса в Chrome?

На изображении ниже показана подробная информация Сеть в инструменте разработки Chrome: На изображении ниже показана подробная информация о сети в инструменте разработчика Chrome:

На изображении ниже показана подробная информация Сеть в инструменте разработки Firefox: введите здесь описание изображения


http fetch cors fetch-api preflight
person Seven Lee    schedule 19.03.2017    source источник
comment
Как я уже говорил вам в github.com/whatwg/fetch/issues/509, вы действительно нужно поделиться дополнительной информацией. Этого недостаточно, чтобы понять, что происходит.   -  person Anne    schedule 19.03.2017
comment
@Anne Я уже публикую информацию о сети Chrome в вопросе, есть заголовок запроса и заголовок ответа. Я надеюсь, что это может быть полезно. вы найдете какую-нибудь подсказку?   -  person Seven Lee    schedule 19.03.2017
comment
Я имею в виду, это выглядит нормально, так что, вероятно, это что-то другое. Что говорит консоль? Отклоняет ли метод fetch()?   -  person Anne    schedule 19.03.2017
comment
Консоль @Anne ничего не сказала. fetch() не отклонил. Но он не может правильно установить Authorization в заголовке запроса, он просто останавливается на этапе предварительной проверки CORS. Я также публикую Network в firefox. он может завершить предварительную проверку CORS, затем для метода GET правильно установить Authorization в заголовке запроса.   -  person Seven Lee    schedule 19.03.2017
comment
Тогда я не уверен. Возможно, вам придется сообщить об ошибке в Chrome. Можете ли вы воспроизвести его без использования локального хоста?   -  person Anne    schedule 20.03.2017

Ответы (2)


arrow_upward
0
arrow_downward

Как сказал @stackdave, браузер отправляет запрос OPTIONS перед запросом GET, когда междоменный ajax. Затем браузер будет ждать ответа сервера. Моя ситуация, когда сервер не ответил, поэтому браузер просто останавливает статус OPTIONS. Сервер должен справиться с этой проблемой, это все еще проблема CORS, а не ошибка или проблема API.

person Seven Lee    schedule 29.08.2017

arrow_upward
-1
arrow_downward

браузер отправит перед запросом OPTIONS без токена авторизации, а затем отправит реальный запрос

http://www.w3.org/TR/cors/ См. http://metajack.im/2010/01/19/crossdomain-ajax-for-xmpp-http-binding-made-easy/ для дополнительной информации

person stackdave    schedule 21.06.2017