Adding headers to endpoint requests

[AidosMarcos]

Context

using nuxt-auth with local external provider and my external API demans an 'ApiKey' header to authorize any request to be made.
So far i was unable to find a way to had custom header to the endpoints defined in nuxt-auth config, Is there any way to do this?

Already tried creating plugin trying to "catch" fetch request and manually add header but does not seem to work with fetch call made by nuxt-auth.

Describe the feature

Possibility to add request headers to defined endpoints.

How would you implement this?

Add another prop do the object that defines endpoint like:

endpoints: { signIn: { path: 'login', method: 'post', headers: { ... } }, signOut: { path: 'logout', method: 'post', headers: { ... } }, signUp: { path: 'register', method: 'post', headers: { ... } }, getSession: { path: 'session', method: 'get', headers: { ... } }, }

Additional information

• Would you be willing to help implement this feature?

Provider

• AuthJS
• Local
• Refresh
• New Provider

[phoenix-ru]

Thank you for the issue. I've been in general considering if we could add something similar to AuthJS callbacks so that any developers are able to customize all the aspects of the outgoing request for a local/refresh provider. It seems to be quite a requested feature in one way or another.

I will give it some thought and try to come up with a good extensible solution similar to refreshHandler but more flexible

[clcoco]

Thank you for the issue. I've been in general considering if we could add something similar to AuthJS callbacks so that any developers are able to customize all the aspects of the outgoing request for a local/refresh provider. It seems to be quite a requested feature in one way or another.

I will give it some thought and try to come up with a good extensible solution similar to refreshHandler but more flexible

Would it be possible to also add the solutions proposed by @AidosMarcos for simpler and more straightforward use-cases (ie. to support httpOnly cookies)? I can work on it today if it's not a problem

[phoenix-ru]

Related issue: #722

[blparker]

Not sure if this is helpful, but I am using the signIn method:

const { signIn } = useAuth();

And, in looking at the code, there is a signInHeaders parameter that sets the headers:

const signIn: SignInFunc<Credentials, any> = async (credentials, signInOptions, signInParams, signInHeaders) => {
...
}

You should be able to call it with:

await signIn(creds, {}, {}, {
    'X-ApiKey': '1234'
});

[asugomez]

I'm also facing with this issue, this solution would solve most of my problems 🤞🏼 (my developer problems)