Global headers can be overridden

[tacxou]

Describe the feature

Example ?

export const useApiFetch = <P extends GETPlainPaths<paths>>(
  path: MaybeRefOrGetter<P>,
  opts?: Omit<UseOpenApiDataOptions<paths[`/${P}`], IgnoreCase<keyof paths[`/${P}`] & "get">>, "method"> | undefined,
): AsyncData<P | undefined, FetchError<any>> => {
  return useApiData(path, <any>{
    ...opts,
    onRequest(context): Promise<void> | void {
      context.options.headers = {
        ...context.options.headers,
        'x-api-key': '123', //TODO: get api key from authjs
      }
    }
  })
}

Additional information

• [X] Would you be willing to help implement this feature?
• [ ] Can you think of other implementations of this feature?

Final checks

• [X] Check existing issues.

[johannschopplich]

Indeed, global headers can be overridden by any composable. This is intentional and not a bug, since for a specific request you may want to adapt a certain header, which you have already declared in the apiParty module options. This allows users to have full control without being bound to global defaults in every call.

useApiData(path, {
  headers: {
    // Will overriden the global `foo` header if present
    foo: 'baz'
  }
})

[tacxou]

In fact, I want to act globally. Except that I can't type the composable so that it retains OpenAPI autocompletion. I think an example of this very common authentication case would be necessary.

[johannschopplich]

I see. Please take a look into the module configuration docs. You can define global headers per API endpoint:

export default defineNuxtConfig({
  apiParty: {
    endpoints: {
      myApi: {
        url: process.env.MY_API_BASE_URL!,
        // Define global headers here. They will be used with every `$myApi` or `useMyApiData` call.
        headers: {
          Authorization: `Bearer ${process.env.MY_API_TOKEN}`
        }
      },
    }
  }
})

[tacxou]

What if I want to take my header from a blind in this case? Doesn't your approach work?