Headers

You often need to add authorization token to your outgoing requests like Authorization or localization info like Content-Languageheader.

You can pass in a context function to the createClient function. The context factory function should return an object that looks like this:

// The same options passed to `fetch` but without a body prop.
interface FetchOptions extends Omit<RequestInit, 'body'> {}

// The context fn result.
interface GraphQLRequestContext {
  fetchOptions?: FetchOptions;
}

type ContextFactory = () => GraphQLRequestContext;

This means you are able to change the headers sent with the requests, for example:

import { createClient } from 'vue-gql';

const client = createClient({
  endpoint: '/graphql',
  context: () => {
    return {
      fetchOptions: {
        headers: {
          Authorization: 'bearer TOKEN'
        }
      }
    };
  }
});