Search code examples
typescriptgraphqlshopifyapollo

Pass a custom fetch function into Apollo client?

I'm using a library that exposes an authenticatedFetch function (from Shopify app bridge), which takes a uri and options (RequestInit) and makes the request. Is there any way that I can make the Apollo client use this function? I know about ApolloLink but as far as I've seen I haven't found a way to make it use my own request function.

I expected that I can use Apollo client to make a GraphQL request with my fetch function, but it seems like I can only make REST requests and not GraphQL ones.

Solution

  • This requires building a link and passing your customFetch function:

    import { ApolloLink, HttpLink, from } from '@apollo/client';
const uri = 'https://yourserver/graphql'; 

const customFetch = (uri, options) => {
 // do your thing
};

// define any other links… ex: link1, link2

const httpLink = new HttpLink({ uri, fetch: customFetch });
export const link = from([link1, link2, httpLink]);