http - form - fetch API: no se puede agregar autorización en el encabezado de solicitud con Chrome

fetch response

Question

Versión de Chrome : 57.0.2987

En realidad, en la versión anterior de Chrome también tengo este problema. Agregué Authorization on Request Header con mi token de acceso,

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

Siempre obtengo Access-Control-Allow-Headers:authorization en el encabezado de respuesta en Chrome Además, My fetch siempre es Request Method: OPTIONS (no muestra GET), entonces el Status Code es 200 OK en Chrome

Pero si ejecuto el mismo código de búsqueda en Firefox (ver 52.0.1), todo funciona bien. Puedo agregar Authorization en el encabezado de la solicitud correctamente. No mostrará Access-Control-Allow-Headers:authorization en el encabezado de respuesta en Firefox. Mostrará Authorization: Bearer accesstoken en el encabezado Solicitud.

El lado del servidor ya procesó CORS para mi encabezado de solicitud.

¿Este es un error de Chrome o mi código? ¿Cómo debo hacer para que la Authorization en el encabezado de la solicitud sea correcta en Chrome?

Debajo de la imagen está la herramienta de desarrollo de red en Chrome :

Debajo de la imagen está el detalle Herramienta de desarrollo de red en Firefox :

Answer 1

el navegador enviará antes de una solicitud de OPCIONES, sin el token de autorización, y luego enviará la solicitud real

http://www.w3.org/TR/cors/ Ver http://metajack.im/2010/01/19/crossdomain-ajax-for-xmpp-http-binding-made-easy/ para obtener un poco más de información

Answer 2

Como dijo @stackdave, el navegador envía la solicitud OPTIONS antes de la solicitud GET cuando se usa el dominio cruzado ajax. Entonces el navegador esperará la respuesta del servidor. Mi situación es que el servidor no respondió, por lo que el navegador simplemente detiene el estado de OPCIONES. El servidor necesita manejar este problema, sigue siendo un problema CORS, no es un error o problema de la API.