How toPass cookies from a Remix loader to an external API

Imagine we have a cookie set in the user browser that we want to pass as is to an API. This cookie may not have been created using Remix's Cookie or SessionStorage objects, so we want to avoid parsing it.

On browsers we can add credentials: "include" to a fetch call to ask it to send the cookies, but because fetch is not connected in any way with the request we received in the loader (or action) we'll have to grab the header and send it manually.

await fetch(url, {
  headers: { cookie: request.headers.get("cookie") }
})

By doing this, we're passing the exact Cookie header from our request to the fetch, and we can simplify this by sending all headers too:

await fetch(url, { headers: request.headers })

Now every header our Remix application receives from the browser will be forwarded to the URL we're fetching.