Skip to content

Instantly share code, notes, and snippets.

@bruce
Last active June 16, 2017 23:30
Show Gist options
  • Save bruce/4b9acc750af80e9ab3bdc4fc259fd718 to your computer and use it in GitHub Desktop.
Save bruce/4b9acc750af80e9ab3bdc4fc259fd718 to your computer and use it in GitHub Desktop.
Absinthe Subscriptions Sketch

In a vanilla ES6 project, using no framework:

// Configuration

import { Client } from 'absinthe-phoenix';

const client = new Client({
  uri: "http://localhost:3010/graphql",
  wsUri: "ws://localhost:3010/socket"
});

client.connect() // for websocket
  .then(() => console.log('Connected.')
  .catch(e => console.error(`Couldn't connect`, e));

// Example subscription

const subscription = `
subscription {
  commentAdded(repoFullName: "apollographql/apollo-client") {
    repoName
  }
}
`;

client.subscribe({query: subscription}, response => {
  // Executed every time this subscription is broadcast
  console.log('Got subscription data', response);
})
.then(() => console.log("Subscribed."))
.catch(e => console.error(`Couldn't subscribe`, e))

Using Apollo Client:

// Configuration

import { createNetworkInterface } from 'absinthe-phoenix-apollo';

const client = new ApolloClient({
  networkInterface: createNetworkInterface({
    uri: 'http://localhost:3010/graphql',
    wsUri: 'ws://localhost:3010/socket',
    ... otherConfigurationOptions
  })
});

// Use client as normal

Using Relay (Modern):

// Configuration

import { createNetwork } from 'absinthe-phoenix-relay';

const network = createNetwork({
  uri: 'http://localhost:3010/graphql',
  wsUri: 'ws://localhost:3010/socket',
  ... otherConfigurationOptions
});

// Use network as normal (in your environment, etc)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment