fusion-apollo-universal-client

A simple universal client for GraphQL apps using fusion-apollo.

Usage no npm install needed!

<script type="module">
  import fusionApolloUniversalClient from 'https://cdn.skypack.dev/fusion-apollo-universal-client';
</script>

README

fusion-apollo-universal-client

Build status

A simple universal client for GraphQL apps using fusion-apollo.

The Apollo Client is the entrypoint for most Apollo applications. This plugin provides a client with the minimum amount of configuration necessary to create a universally rendered Apollo application.


Table of contents


Installation

yarn add fusion-apollo-universal-client

Usage

Usage with fusion-apollo

import App, {ApolloClientToken} from 'fusion-plugin-apollo';
import GetApolloClient from 'fusion-apollo-universal-client';
import unfetch from 'unfetch';

export default () => {
  const app = new App(root);
  app.register(ApolloClientToken, GetApolloClient);
  __NODE__ && app.register(FetchToken, unfetch);
  return app;
};

Usage with local server

If your app hosts the Apollo server a schema must be provided. The schema can be provided using the GraphQLSchemaToken from fusion-apollo.

import App, {ApolloClientToken, GraphQLSchemaToken} from 'fusion-plugin-apollo';
import {makeExecutableSchema} from 'graphql-tools';
import GetApolloClient from 'fusion-apollo-universal-client';
import unfetch from 'unfetch';

export default () => {
  const app = new App(root);
  app.register(ApolloClientToken, GetApolloClient);
  app.register(GraphQLSchemaToken, makeExecutableSchema(...));
  __NODE__ && app.register(FetchToken, unfetch);
  return app;
};

See the Apollo Documentation for how to generate a schema.

Authorization

Authorization will work with hosted GraphQL services such as scaphold and graph.cool. This works by passing a stored authentication token inside of the authorization header. This token is currently assumed to stored in a cookie and cookies by the value provided in ApolloClientAuthKeyToken (defaults to "token").


API

Registration API

ApolloClientAuthKeyToken
import {ApolloClientAuthKeyToken} from 'fusion-apollo-universal-client';

(Optional) A configuration value that provides the value of an authentication token to use from the document cookies. If provided, this token is used in the Apollo auth middleware as an authorization header.

Type
  • string - Required. Name of the cookie which contains the authorization token.
Default value

If no token name is provided, authorization headers are not sent.

GetApolloClientCacheToken
import {GetApolloClientCacheToken} from 'fusion-apollo-universal-client';

(Optional) A function that returns an Apollo cache implementation.

Type
  • (ctx: Context) => ApolloCache - Optional.
Default value

The default cache implementation uses InMemoryCache.

ApolloClientCredentialsToken
import {ApolloClientCredentialsToken} from 'fusion-apollo-universal-client';

(Optional) A configuration value that provides the value of credentials value passed directly into the fetch implementation.

Type
  • string - Optional.
Default value

The default value is same-origin.

GetApolloClientLinksToken
import {GetApolloClientLinksToken} from 'fusion-apollo-universal-client';

(Optional) A configuration value that provides a array of ApolloLinks. The default links are provided as an argument to the provided function.

Type
  • (Array<ApolloLinkType>) => Array<ApolloLinkType> - Optional.
ApolloClientResolversToken
import { ApolloClientResolversToken } from "fusion-apollo-universal-client";

(Optional) Provides the resolvers for local state management.

Type
  • ResolverMap | $ReadOnlyArray<ResolverMap> - Optional.

Dependencies

FetchToken
import {FetchToken} from 'fusion-tokens';

A fetch implementation. Browser-only.

Type
type Fetch = (url: string, options: Object) => Promise<Response>;
  • url: string - Required. Path or URL to the resource you wish to fetch.
  • options: Object - Optional. You may optionally pass an init options object as the second argument. See Request for more details.
  • [return]: Promise<Request> - Return value from fetch. See [Response](A function that loads appropriate translations and locale information given an HTTP request context) for more details.
Default value

If no fetch implementation is provided, window.fetch is used.