jaydenseric / apollo-upload-client

A terminating Apollo Link for Apollo Client that fetches a GraphQL multipart request if the GraphQL variables contain files (by default FileList, File, or Blob instances), or else fetches a regular GraphQL POST or GET request (depending on the config and GraphQL operation).
https://npm.im/apollo-upload-client
1.53k stars 156 forks source link

Support with @habx/apollo-multi-endpoint-link #340

Closed antonykovalenko closed 9 months ago

antonykovalenko commented 9 months ago

Hello there!

I'm having problem getting to work apollo-upload-client with @habx/apollo-multi-endpoint-link's multiApiLink

My code look like this:

const multiApiLink = new MultiAPILink({
  endpoints: {
    public: GQL_PUBLIC_URL,
    private: GQL_PRIVATE_URL,
  },
  createHttpLink: () => createHttpLink(),
  httpSuffix: '',
});

const link = from([
  errorLink,
  createUploadLink(),
  multiApiLink,
]);

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link,
});

I tried various config parameters of createUploadLink() and createHttpLink() but nothing was successfull. Am I missing something here? Any ideas would help. Thank you in advance!

jaydenseric commented 9 months ago

Hi! The problem is because the upload link is intended to replace the normal HTTP link, but you have tried setting up both at once. In that situation whichever one comes first in the configured links "wins". As per the readme installation instructions:

Apollo Client can only have 1 terminating Apollo Link that sends the GraphQL requests; if one such as HttpLink is already setup, remove it. — https://github.com/jaydenseric/apollo-upload-client/blob/v18.0.1/readme.md#installation

I've never setup MultiAPILink, but maybe try this:

  const multiApiLink = new MultiAPILink({
    endpoints: {
      public: GQL_PUBLIC_URL,
      private: GQL_PRIVATE_URL,
    },
-   createHttpLink: () => createHttpLink(),
+   createHttpLink: () => createUploadLink(),
    httpSuffix: '',
  });

  const link = from([
    errorLink,
-   createUploadLink(),
    multiApiLink,
  ]);

  const client = new ApolloClient({
    cache: new InMemoryCache(),
    link,
  });
antonykovalenko commented 9 months ago

@jaydenseric thank you so much for explanation and solution. I tried it and it work perfectly!