nuxt-modules / apollo

Nuxt.js module to use Vue-Apollo. The Apollo integration for GraphQL.
https://apollo.nuxtjs.org
MIT License
956 stars 198 forks source link

feat: add context to query #549

Closed Digni closed 1 year ago

Digni commented 1 year ago

Add Context to useAsyncQuery and useLazyAsynQuery. Extended prep function to extract context and forward it to apollo client. This allows context configuration per query, e.g. custom headers.

netlify[bot] commented 1 year ago

Deploy Preview for apollo-module canceled.

Name Link
Latest commit 6a1bf0f4fb00980817bf337e7d80f0e4756ee33b
Latest deploy log https://app.netlify.com/sites/apollo-module/deploys/650966029286960008d29120
Digni commented 1 year ago

This should enable issue #508

Khaledhesham commented 1 year ago

this is very useful can it get merged sooner

Kevintjuhz commented 1 year ago

This would be very useful for us. Any updates?

Kevintjuhz commented 1 year ago

Thanks for merging, much appreciated.

Diizzayy commented 1 year ago

@Digni @Kevintjuhz It'll be apart of the next minor release (coming shortly).

gerbenvandijk commented 1 year ago

@Diizzayy

Just tested this and it works nicely for my use (setting custom headers from within a global middleware). However; it is required for me to set cache:false on my request.

If I don't - then useAsyncQuery will simply return the previously queried data and completely disregards that new request headers were set.

Is this intended? It feels like it would be useful to make the caching mechanism aware of changes in the newly added context :)

The same applies to the Apollo DevTools Chrome extension that can be enabled via connectToDevTools: true in nuxt.config.ts. It is also not aware of the new context and crashes.

fosterdouglas commented 1 year ago

Just tested this and it works nicely for my use (setting custom headers from within a global middleware). However; it is required for me to set cache:false on my request.

If I don't - then useAsyncQuery will simply return the previously queried data and completely disregards that new request headers were set.

Is this intended? It feels like it would be useful to make the caching mechanism aware of changes in the newly added context :)

The same applies to the Apollo DevTools Chrome extension that can be enabled via connectToDevTools: true in nuxt.config.ts. It is also not aware of the new context and crashes.

@gerbenvandijk Can you share where exactly you're setting cache: false ? I'm having the same issue.

gerbenvandijk commented 1 year ago

Just tested this and it works nicely for my use (setting custom headers from within a global middleware). However; it is required for me to set cache:false on my request. If I don't - then useAsyncQuery will simply return the previously queried data and completely disregards that new request headers were set. Is this intended? It feels like it would be useful to make the caching mechanism aware of changes in the newly added context :) The same applies to the Apollo DevTools Chrome extension that can be enabled via connectToDevTools: true in nuxt.config.ts. It is also not aware of the new context and crashes.

@gerbenvandijk Can you share where exactly you're setting cache: false ? I'm having the same issue.

@fosterdouglas useAsyncQuery has a parameter for that:

    const { data } = await useAsyncQuery({
        query, // -> for me this is an imported .gql file
        cache, // -> true or false
        context: {
            headers: {} //  -> an object with my custom headers
        }
    })