Exemple headers with graphql-request

[perroudsky]

I've tried to set headers in requests thanks to the docs of graphql-request without success.
Seems easy but I'm having trouble doing it since there is already a queryClient declare!

I'm following this exemple :

const client = new GraphQLClient(endpoint)

const query = gql`
  query getMovie($title: String!) {
    Movie(title: $title) {
      releaseDate
      actors {
        name
      }
    }
  }
`

const variables = {
  title: 'Inception',
}

const requestHeaders = {
  authorization: 'Bearer MY_TOKEN'
}

// Overrides the clients headers with the passed values
const data = await client.request(query, variables, requestHeaders)

Can anybody help ? :)

[jasondotlee]

I'm interested in this same thing as well. I'm using graphql-request and per the docs, you can create a requestHeaders object and pass it in per request, or assign it to all default headers at instantiation of the query instance. Neither of these are working for me

[TkDodo]

I have no experience with graphql, but if you have a minimal codesandbox example that shows the issue, preferably in typescript, I can take a look :)

[jasondotlee]

const variables = {id: ids};

const requestHeaders = {
         authorization: Bearer ${customerToken},
        'Content-Type': 'application/json',
    };
  
  return useQuery(
    ['products', variables, requestHeaders],
    async () => {
      const data = await request(
        PRODUCT_ENDPOINT,
        PRODUCT_QUERY,
        variables,
        requestHeaders,
      );
      return data;
    },
    {
      enabled: !!variables.id,
    },
  );
};

[TkDodo]

you probably want variables.id in the queryKey?

can you create a runnable example with http://codesandbox.io/ maybe?

[jasondotlee]

Same result-I'll try and add a codesandbox example later. This query runs as expected, I'm just not seeing the authorization header on the request object.