Apollo-module: Trouble with Phoenix (Elixir) & Absinthe

[rvcas]

I'm not 100% sure what the problem is but it seems that this module is sending off an initial HTTP GET to the socket endpoint that I config for my phoenix/absinthe server.

I've had to give this a try: https://github.com/e-lam/apollo-module-absinthe. but it'd feel a little nicer to use the officially supported library.

Is there something I can do to override some configs? Still a little new to vue/nuxt coming from React land.

_{This question is available on Nuxt community (#c155)}

[cmty[bot]]

This issue as been imported as question since it does not respect apollo-module issue template. Only bug reports and feature requests stays open to reduce maintainers workload.
If your issue is not a question, please mention the repo admin or moderator to change its type and it will be re-opened automatically.
Your question is available at https://cmty.app/nuxt/apollo-module/issues/c155.

[rvcas]

Ok sorted something out:

yarn add @absinthe/socket @jumpn/utils-graphql @absinthe/socket-apollo-link apollo-link apollo-link-http apollo-cache-inmemory phoenix

in nuxt.config.js:

...

modules: ['@nuxtjs/apollo'],

  /*
  ** Apollo config
  */
  apollo: {
    tokenExpires: 7,
    includeNodeModules: true,
    authenticationType: 'Bearer',
    clientConfigs: {
      default: '~/graphql/apollo/default.js' // or wherever you want, doesn't matter but another file ideally
    }
  },

...

in ~/graphql/apollo/default.js:

import * as AbsintheSocket from '@absinthe/socket'
import { createAbsintheSocketLink } from '@absinthe/socket-apollo-link'
import { Socket as Phoenix } from 'phoenix'
import { ApolloLink } from 'apollo-link'
import { createHttpLink } from 'apollo-link-http'
import { hasSubscription } from '@jumpn/utils-graphql'
import { InMemoryCache } from 'apollo-cache-inmemory'

export default ctx => {
  const link = new ApolloLink.split(
    operation => hasSubscription(operation.query),
    createAbsintheSocketLink(
      AbsintheSocket.create(new Phoenix('ws://localhost:4000/socket'))
    ),
    createHttpLink({ uri: 'http://localhost:4000/graphql' })
  )

  return {
    link,
    cache: new InMemoryCache(),
    defaultHttpLink: false // this stops the warning/error cannot call concat on terminating link
  }
}