{"id":16318526,"url":"https://github.com/vic/apollo-phoenix-websocket","last_synced_at":"2025-10-29T00:21:18.674Z","repository":{"id":57182372,"uuid":"78144705","full_name":"vic/apollo-phoenix-websocket","owner":"vic","description":"An Apollo networkInterface for executing GraphQL queries via Phoenix Channels","archived":false,"fork":false,"pushed_at":"2017-10-24T22:31:55.000Z","size":89,"stargazers_count":91,"open_issues_count":9,"forks_count":9,"subscribers_count":10,"default_branch":"master","last_synced_at":"2025-02-21T10:03:44.887Z","etag":null,"topics":["absinthe","absinthe-phoenix","apollo-client","apollo-phoenix-websocket","apollographql-subscriptions","graphql","phoenix-channels","websocket"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vic.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-01-05T20:11:37.000Z","updated_at":"2021-12-06T18:36:46.000Z","dependencies_parsed_at":"2022-09-14T04:40:30.899Z","dependency_job_id":null,"html_url":"https://github.com/vic/apollo-phoenix-websocket","commit_stats":null,"previous_names":[],"tags_count":5,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vic%2Fapollo-phoenix-websocket","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vic%2Fapollo-phoenix-websocket/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vic%2Fapollo-phoenix-websocket/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vic%2Fapollo-phoenix-websocket/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vic","download_url":"https://codeload.github.com/vic/apollo-phoenix-websocket/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243818195,"owners_count":20352629,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["absinthe","absinthe-phoenix","apollo-client","apollo-phoenix-websocket","apollographql-subscriptions","graphql","phoenix-channels","websocket"],"created_at":"2024-10-10T22:23:47.623Z","updated_at":"2025-10-29T00:21:18.605Z","avatar_url":"https://github.com/vic.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# APW - Apollo Phoenix Websocket\n\n\u003ca href=\"https://www.npmjs.com/package/apollo-phoenix-websocket\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/apollo-phoenix-websocket.svg\"\u003e\u003c/a\u003e\n\u003ca href=\"https://travis-ci.org/vic/apollo-phoenix-websocket\"\u003e\u003cimg src=\"https://travis-ci.org/vic/apollo-phoenix-websocket.svg\"\u003e\u003c/a\u003e\n[![help maintain this lib](https://img.shields.io/badge/looking%20for%20maintainer-DM%20%40vborja-663399.svg)](https://twitter.com/vborja)\n\n\n[Apollo] is a feature rich GQL client, APW implements an [Apollo GraphQL Network Layer] for it over [Phoenix Channels] allowing you to re-use a single bidirectional connection for executing your queries and mutations, the backend can send new data via subscriptions, and the Apollo client can update its internal store and update your views accordingly.\n\nSince version `0.6.0`, all Apollo operations are supported: queries, mutations, watchQueries (pooling) and\nsubscriptions.\n\nUsing the [Apollo Client], queries and mutations resolve to promises, and watchQueries and\nsubscriptions resolve to observables.\n\nSee the Apollo client [documentation][Apollo Client] for more info on how to invoke your GQL backend.\n\n\n## Installation\n\n```shell\nnpm install --save apollo-phoenix-websocket\n```\n\n## Usage\n\nJust import the `createNetworkInterface` from APW and use it to create an ApolloClient.\n\nThe `createNetworkInterface` function takes an options object, the only required\nproperty is `uri` which specifies your endpoint websocket address.\n\n```javascript\nimport ApolloClient from 'apollo-client'\nimport {createNetworkInterface} from 'apollo-phoenix-websocket'\n\n// Nothing to configure if you are using an Absinthe backend\n// Otherwise take a look at the Options section.\nconst networkInterface = createNetworkInterface({uri: 'ws://localhost:4000/socket'})\n\nconst apollo = new ApolloClient({networkInterface})\n```\n\n## Options\n\nMost likely, (as you are looking for a phoenix-websocket transport) you might be using\nthe [Absinthe] library to implement your Elixir GQL server. APW is configured by default\nto work out of the box with an [Absinthe backend](#absinthe-backend).\n\nBut if need araises, you can supply some advanced options to customize how it works.\nHere's is a commented example of the options that you can set for APW, with\ntheir respective default values:\n\n\n```javascript\ncreateNetworkInterface({\n\n  // The websockets endpoint to connect to, like ws://example.com:4000/socket\n  uri: WS_URI,\n\n  // how to send queries and mutations\n  channel: {\n    topic: '__absinthe__:control',\n    event: 'doc',\n  },\n\n  // for using websocket subscriptions\n  subscription: (subscriptionResponse) =\u003e ({\n    topic: subscriptionResponse.subscriptionId,\n    event: 'subscription:data',\n\n    // extract the data from the event payload\n    map: payload =\u003e payload.result.data,\n\n    // what to do when unsubscribing\n    off: controlChannel =\u003e {\n      controlChannel.push('unsubscribe', {\n        subscriptionId: subscriptionResponse.subscriptionId\n      })\n    }\n  }),\n\n  // If you want to reuse an existing Phoenix Socket, just provide a function\n  // for APW to get it. By default, it will use the Phoenix Socket module.\n  Socket: options =\u003e new Socket(options),\n})\n```\n\n## Middlewares\n\nYou can use middlewares with `use` just like with\nthe standard apollo network interface. For example, a middleware can set authorization token on every request.\n\n```javascript\nnetworkInterface.use([{\n  applyMiddleware({request, options}, next) {\n    // Here you can modify the interface options, for example\n    // you can change the socket/channel that will handle the request\n    // For example for a channel expecting authenticated queries\n    options.channel.topic = \"gql:restricted\"\n    options.channel.params = {...paramsForTopicJoin}\n\n    // Or Modify the request\n    request.variables = {name: 'Luke'}\n    \n    // Or Just add authorization token\n    options.params = {\n      ...options.params,\n      auth_token: 'my-secret-token',\n    }\n\n    next()\n  }\n}])\n```\n\n## Afterware\n\nYou can use afterwares with `useAfter` just like the standard\napollo network interface. An example use-case is for error handling:\n\n```javascript\nnetworkInterface.useAfter([{\n  applyAfterware({response, options}, next) {\n    // throw an error that will trigger your error handler\n    if (response.error) {\n      throw new Error(response.error)\n    }\n    next();\n  }\n}])\n```\n\n## Absinthe backend\n\n[Absinthe] is an amazing project (kudos to @benwilson512 et al.). It's actually very\nsimple to create a GQL backend with it.\n\nTake a look at the following places for more information:\n\n- The [Absinthe guide][Absinthe] itself for getting started.\n- [Absinthe Phoenix] for implementing websocket subscriptions on your endpoint.\n- [Absinthe.Schema#subscription/2][Absinthe Subscription] docs for how to setup your schema\n\n\n\n# Made with love \u003c3\n\nIf you want to provide feedback or even better if you want to contribute some code feel free to open a [new issue].\nPossible thanks to the awesome work of [our contributors].\n\n\n[Apollo]: http://dev.apollodata.com/\n[Apollo Client]: http://dev.apollodata.com/core/apollo-client-api.html\n[Apollo GraphQL Network Layer]: http://dev.apollodata.com/core/network.html\n[Phoenix Channels]: http://www.phoenixframework.org/docs/channels\n[Absinthe]: http://absinthe-graphql.org/\n[new issue]: https://github.com/vic/apollo-phoenix-websocket/issues\n[our contributors]: https://github.com/vic/apollo-phoenix-websocket/graphs/contributors\n[Absinthe Phoenix]: https://github.com/absinthe-graphql/absinthe_phoenix\n[Absinthe Subscription]: https://hexdocs.pm/absinthe/1.4.0-beta.1/Absinthe.Schema.html#subscription/2\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvic%2Fapollo-phoenix-websocket","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvic%2Fapollo-phoenix-websocket","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvic%2Fapollo-phoenix-websocket/lists"}