Fetch Calls Removes Authorization Header

This is a duplicate of #1822, and similar to the issue with xhr sandbox in #1016.

We use the Authorization header to pass our JWT token to our backend API. We use fetch, with mode: 'cors', and whitelist the Authorization header in the preflight response using access-control-allow-headers.

This works as expected under normal conditions, and chrome will issue a preflight and pass our Authorization header in the subsequent GET.

However, in hammerhead, the header is stripped out in transform.ts/transformAuthorizationHeader().

The server request then gets a 401, as it’s unauthorized, and hammerhead gives a 222 response to the browser.

Curiously, there also doesn’t appear to be a preflight, although both chrome and firefox issue one without the proxy in place. hammerhead should issue a preflight, as “the request includes any headers other than those which the Fetch spec defines as being a CORS-safelisted request-header”

The fix in #1016 was to prefix the header with AUTHORIZATION.valuePrefix, then strip it out during the header transforms. It looks like this would apply equally well to fetch as it does to xhr.

We also can’t seem to find any combination of fetch params that will force hammerhead to issue a preflight.

[LavrovArtem]

Thank you for the additional information. I’ve reproduced this issue.

[matthias-b]

@LavrovArtem thanks for such a prompt fix! You are awesome.

After much trial and error, we implemented a simple workaround in the meantime, shifting our cache setting from the fetch to the request, like so:

fetch(new Request('http://localhost:2020/fetch', { method: 'GET', headers: { 'Authorization': '123' }, mode: 'cors', cache: 'no-cache' }))