Apollo-module: Support for adding options for HttpLink

Created on 13 Jul 2018 · 7Comments · Source: nuxt-community/apollo-module

What problem does this feature solve?

Would be nice to be able to set if apollo should use GET or POST for queries. Default behavior is POST.

apollo-http-link have a option called useGETForQueries

_{This feature request is available on Nuxt community (#c112)}

feature-request

Source

lindesvard

Most helpful comment

As @lautr said, adding defaultHttpLink: false I could remove that warning. For example:

import { BatchHttpLink } from 'apollo-link-batch-http';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { onError } from 'apollo-link-error';
import { ApolloLink } from 'apollo-link';

export default function createApolloClient(context) {
  // Create your custom client...
  const cache = new InMemoryCache();
  const batchHttpLink = new BatchHttpLink({
    uri: process.env.GRAPHQL_ENDPOINT,
  });
  const errorHandler = onError(({ networkError, graphQLErrors }) => {
    // ...
  });

  return {
    link: ApolloLink.from([errorHandler, batchHttpLink]),
    cache,
    defaultHttpLink: false, // <--- ADD THIS
  };
}

enzonotario on 22 Oct 2019

👍3

All 7 comments

apollo-module depend on vue-cli-plugin-apollo to create apollo client, so I think you should do a feautre request on that module.

By the way I not tried it yet, but I think you can create your own apollo-http-link to use for your project, because vue-cli-plugin-apollo have a option for you to create your own link. Maybe something like this will work.

In nuxt.config.js

apollo: {
    clientConfigs: {
      default: '~/part-to-apollo-config.js'
    }
}

In part-to-apollo-config.js

import { createHttpLink } from "apollo-link-http";

export default function(context){
  const link = createHttpLink({ uri: "/graphql", useGETForQueries: true });
  .... // Somethings else here
  return {
    httpEndpoint: 'http://localhost:4000/graphql'
    link
  }
}

and yes you might have to handle your own authentication or something else as well :)

kieusonlam on 14 Jul 2018

as @kieusonlam mentioned you would need to provide your own link. Beside that you might also raise an issue on vue-cli-plugin-apollo. Will close this issue now reopen it if you bump into issues with creating your own link.

dohomi on 18 Jul 2018

Sorry for late reply! Worked like a charm. Thanks

lindesvard on 4 Aug 2018

using it like this works with setting the useGETForQueries but leads to a warning:

You are calling concat on a terminating link, which will have no effect

at new LinkError (node_modules\apollo-link\lib\bundle.umd.js:52:32) at concat (node_modules\apollo-link\lib\bundle.umd.js:177:26) at ApolloLink.concat (node_modules\apollo-link\lib\bundle.umd.js:204:20) at node_modules\apollo-link\lib\bundle.umd.js:152:68 at Array.reduce (<anonymous>) at from (node_modules\apollo-link\lib\bundle.umd.js:152:34) at createApolloClient (node_modules\vue-cli-plugin-apollo\graphql-client\dist\index.js:81:35) at module.exports../.nuxt/apollo-module.js.__webpack_exports__.default (server-bundle.js:1417:126) at createApp (server-bundle.js:2243:193)
For reference, adding defaultHttpLink: false alongside the link gets rid of the warning.

lautr on 16 Jan 2019

Same here. Works okay great, but there are a warning shows every time
Error: You are calling concat on a terminating link, which will have no effect

IngvarListard on 18 Jul 2019

As @lautr said, adding defaultHttpLink: false I could remove that warning. For example:

import { BatchHttpLink } from 'apollo-link-batch-http';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { onError } from 'apollo-link-error';
import { ApolloLink } from 'apollo-link';

export default function createApolloClient(context) {
  // Create your custom client...
  const cache = new InMemoryCache();
  const batchHttpLink = new BatchHttpLink({
    uri: process.env.GRAPHQL_ENDPOINT,
  });
  const errorHandler = onError(({ networkError, graphQLErrors }) => {
    // ...
  });

  return {
    link: ApolloLink.from([errorHandler, batchHttpLink]),
    cache,
    defaultHttpLink: false, // <--- ADD THIS
  };
}

enzonotario on 22 Oct 2019

👍3

As @lautr said, adding defaultHttpLink: false I could remove that warning. For example:

import { BatchHttpLink } from 'apollo-link-batch-http';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { onError } from 'apollo-link-error';
import { ApolloLink } from 'apollo-link';

export default function createApolloClient(context) {
  // Create your custom client...
  const cache = new InMemoryCache();
  const batchHttpLink = new BatchHttpLink({
    uri: process.env.GRAPHQL_ENDPOINT,
  });
  const errorHandler = onError(({ networkError, graphQLErrors }) => {
    // ...
  });

  return {
    link: ApolloLink.from([errorHandler, batchHttpLink]),
    cache,
    defaultHttpLink: false, // <--- ADD THIS
  };
}

Thank you ! You literally saved my day !!