Unauthorized errors when using openapi-fetch with SvelteKit

[MLNW]

Description

I'm trying to integrate openapi-fetch into a SvelteKit application. So far I used the fetch from SvelteKit to request data from the SpaceTraders API. For it to work I use a handleFetch to add the required token as an Authorization header.

While integrating openapi-fetch I provided this fetch function to the call to GET as is described in the documentation for openapi-fetch. That seemed to work as my handleFetch code is called. The header is correctly added to the request but the request itself fails with a 401.

I tried to debug it in multiple ways but from what I found it looks like everything is correct on my end.

Reproduction

The code is opensource and my try at integrating the openapi-fetch is available in this PR: https://github.com/MLNW/skeleton-traders/pull/1

1. Clone the repo
2. Run pnpm i
3. Run pnpm run dev
4. Go to localhost:5137
5. On the right enter a name and click Register
6. Click on any of the ships in the table that you should now see
7. You are redirected to the login page
8. Look at the console log from step 3

The error occurs in both Firefox and Chrome.

The header is set in the src/hooks.server.ts on line 43. The request is made in src/lib/server/api.ts on line 112.

Expected result

The API should respond with a 200 status code, as the correct authorization token is provided in the request header.

Checklist

• [x] I’m willing to open a PR but most likely unable to, based on the perceived complexity of the project (see CONTRIBUTING.md)

[drwpow]

Thanks for the reproduction! In your code the fact that you aren’t explicitly setting the Authorization header on GET means that it’s not there.

Even if you supply a custom fetch() function, that’s just the wrapper that gets called; openapi-fetch still assembles the headers and actually fires off the request. So it doesn’t know about any headers that may/may not have been set in SvelteKit.

But that said, I’m open to proposals if there’s some way openapi-fetch could know what headers SvelteKit had set somehow?

[MLNW]

In your code the fact that you aren’t explicitly setting the Authorization header on GET means that it’s not there.

I guess that makes sense. Though I would have expected it to use the headers set by SvelteKit on its custom fetch() function. I'm not sure how that actually works so I don't know how to improve it. It would be great if this library would support the use case though. I guess we would have to understand how this is handled and then see if it can be taken advantage of when making the final request.

[MLNW]

openapi-fetch still assembles the headers and actually fires off the request

I just had another look at the code and from what I understand this is not entirely correct. After openapi-fetch fires of the request it is intercepted by SvelteKit in its handleFetch() function. The console logs here then show that an Authorization header is set. It still fails and I don't know why.