How can I set http timeout for GraphQLClient rawRequest?

[egacl-agilesoft]

Hi!

I need your help to know How can I set http timeout for GraphQLClient rawRequest? I was read the documentation but I didn't found anything about.

Thanks

[egacl-agilesoft]

I found into source code RequestInit object that contains a timeout attribute. These param can set into GraphQLClient constructor.

[egacl-agilesoft]

I did install "2.1.0-next.1" version with NPM. In this version RequestInit doesn't have "timeout" attribute. How can I set http timeout with this version?

[maximvsidorenko]

Hi!

I checked the repository for usages of the timeout, and it seems this option along with others are just transferred to CrossFetch. As far as I can see CrossFetch does not support timeout.

So, it seems there is no support of the timeout in neither of the versions. Is it something that is under development?

Thanks

[sc0Vu]

I got client stuck on request today, and thanks @maximvsidorenko your work did save my time to find how to setup timeout. The cross-fetch is a proxy to the node-fetch and the github fetch (issue: lquixada/cross-fetch#62).

And both of these libraries can setup timeout in this way:

import AbortController from 'abort-controller'

const controller = new AbortController()
const timeoutID = setTimeout(() => {
	controller.abort();
}, 150)

try {
  const response = await crossFetch('https://example.com', {signal: controller.signal})
  const data = await response.json()
} catch (error) {
  if (error instanceof crossFetch.AbortError) {
    console.log('request was aborted')
  }
} finally {
  clearTimeout(timeoutID)
}

So you can setup timeout in Graph Client:

import { GraphQLClient, gql } from 'graphql-request'
import AbortController from 'abort-controller'

const controller = new AbortController();
const timeoutId = setTimeout(() => {
  controller.abort()
  console.log('timeout')
}, 10)
const graphClient = new GraphQLClient(url, {
  signal: controller.signal
})

// request
await graphClient.request(query, variables)

// rawRequest
graphClient.rawRequest(query, variables)

Didn't add try catch in last piece of code, sorry for that.
Hope it helps.

[w33ble]

Note about the above solution; you'll need to clear that timeout or abort would still be called. A try/finally would work.

There's also an example of how to do this in examples/request-cancellation.ts that doesn't rely on another npm module, using the native AbortController.

https://github.com/jasonkuhrt/graphql-request/blob/6b3396bbd4c3b678f84abe8bcf697a26e563721c/examples/request-cancellation.ts

[awesomedevv]

Hi

Please try with this code block.

import { GraphQLClient } from 'graphql-request';

const graphqlClient = new GraphQLClient(endpoint);

const fetchOptions = {
  timeout: 5000, // 5 seconds
};

graphqlClient.rawRequest(query, variables, { ...fetchOptions })
  .then(data => {
    // Handle response
  })
  .catch(error => {
    // Handle error
  });