Easy-to-use Axios-based HTTP client for GraphQL API's. This library is more suitable for back-end interactions with GraphQL servers (not frontends/UI's). The Auto-pagination feature allows fetching of large amounts of data from paginated GraphQL API's without the need to write custom code.
Features:
- Simple API focused on GraphQL use case.
- Auto-pagination (Relay pattern only, such as Github API)
- Event listener for paginated requests
- Configurable retries (and retryDelay)
Using npm:
$ npm install graphios
Using yarn:
$ yarn add graphios
interface Config {
url: string // graphQL endpoint
query: string // graphQl query
headers?: object // Optional headers object
timeout?: number // Optional custom timeout in ms (default to no timeout)
retries?: number // Optional retries (default to 3)
retryDelay?: number // Optional retryDelay in ms (default to 500)
pagination?: boolean // Optional Auto-pagination (default to false)
requestId?: string // Optional request identifier, useful for monitoring page iterations
pageDelay?: number // Optional delay between pagination iterations in ms (default to 200)
}
interface GraphiosResponse {
data: object // Response data
status?: number // not present on auto-paginated requests
statusText?: string // not present on auto-paginated requests
headers?: object // not present on auto-paginated requests
pagesProcessed?: number // Only available for auto-paginated requests
}
import { graphios } from 'graphios';
const query = `{
users {
firstName
email
}
}`
// using promises
graphios({
query,
url: 'https://mygraphql.xyz/graphql'
})
.then( response => {
// handle success
console.log(response.data);
})
.catch( error => {
// handle error
console.log(error);
})
// Using async/await
(async () => {
try {
const response = await graphios({
query,
url: 'https://mygraphql.xyz/graphql',
})
console.log(response.data);
} catch (error) {
console.error(error);
}
})()
For auto-pagination support, a $cursor
variable should be included in the query. The API server must follow the relay pagination pattern using nodes and edges. The paginated query is not required to be on the first level, but only one pagination query is allowed per request.
Example using an usable query for the Github API
// import graphiosEvents for pagination events
import { graphios, graphiosEvents } from 'graphios';
// A query variable $cursor is required.
const query = `
query Repository($cursor:String){
organization(login:"microsoft"){
membersWithRole(first:100, after:$cursor){
edges {
node {
name
}
}
pageInfo {
endCursor
hasNextPage
}
}
}
}
`
const headers = {
'authorization': `Bearer 1234567SuperHardKey8910`
}
// using promises
graphios({
query,
url: 'https://api.github.com/graphql',
headers,
retries: 3,
retryDelay: 500,
pagination: true,
requestId: 'myRepoReq123'
pageDelay: 100
})
.then( response => {
// handle success
console.log(response.data);
})
.catch( error => {
// If any page fails, it will end here
console.log(error);
})
// Using async/await
(async () => {
try {
const response = await graphios({
query,
url: 'https://api.github.com/graphql',
headers,
retries: 3,
retryDelay: 500
pagination: true,
requestId: 'myRepoReq123',
pageDelay: 100
})
console.log(response.data);
} catch (error) {
// If any page fails, it will end here
console.error(error);
}
})()
// Optional pagination event handler
graphiosEvents.on('pagination', pageData => {
console.log(
pageData.page // Page number,
pageData.response, // Response object, same as an individual request
pageData.requestId // Request identifier set on the config: 'myRepoReq123'
})
An optional second object can be passed if any specific configuration from Axios is needed. This will override any configuration made on the graphios config (first parameter).
interface AxiosRequestConfig {
url?: string
method?: Method
baseURL?: string
transformRequest?: AxiosTransformer | AxiosTransformer[]
transformResponse?: AxiosTransformer | AxiosTransformer[]
headers?: any
params?: any
paramsSerializer?: (params: any) => string
data?: any
timeout?: number
withCredentials?: boolean
adapter?: AxiosAdapter
auth?: AxiosBasicCredentials
responseType?: ResponseType
xsrfCookieName?: string
xsrfHeaderName?: string
onUploadProgress?: (progressEvent: any) => void
onDownloadProgress?: (progressEvent: any) => void
maxContentLength?: number
validateStatus?: (status: number) => boolean
maxRedirects?: number
socketPath?: string | null
httpAgent?: any
httpsAgent?: any
proxy?: AxiosProxyConfig | false
cancelToken?: CancelToken
}
Example:
graphios(
{
query: `{ Users { name } }`,
url: 'https://mygraphql.xyz/graphql'
},
{
maxRedirects: 10
}
)
.then( response => {
// handle success
console.log(response.data)
})
.catch( error => {
// If any page fails, it will end here
console.log(error)
})
Relies on the excellent work provided by axios and axios-retry.