apollo-link-form-data

Send your GraphQL request with apollo-link as FormData or JSON.

Usage no npm install needed!

<script type="module">
  import apolloLinkFormData from 'https://cdn.skypack.dev/apollo-link-form-data';
</script>

README

apollo-link-form-data

Send your GraphQL request with apollo-link as FormData or JSON.

Build Status Code Coverage dependencies Status devDependencies Status

Installation

You can install this package from npm:

npm install apollo-link-form-data graphql

Or with yarn:

yarn add apollo-link-form-data graphql

For Node.js you also need to install following dependencies:

# 1. node-fetch ot any other fetch-compatible library instead of node-fetch
# 2. Note that you need at least 1.5.1 version of the formdata-node package
yarn add node-fetch formdata-node

And add this fetch library to options manually:

import fetch from "node-fetch"

import {createFormDataLink} from "apollo-link-form-data"

const link = createFormDataLink({fetch})

Another thing I have to mention, is that ApolloLinkFormData uses @octetstream/object-to-form-data package under the hood to convert request payload to FormData which means that your data will be sent to server in spetial format. For more info, read the API section of then-busboy documentation: then-busboy#bracket-notation

Of course, it doesn't mean that you have to use then-busboy on your server to process multipart/form-data requests, but it must support mentioned format if you want to get usefull data out-of-the-box.

Usage

Import and initialize with just two lines:

import {createFormDataLink} from "apollo-link-form-data"

const link = createFormDataLink({uri: "https://api.example.com/graphql"})

Usage with Apollo Client:

import ApolloClient from "apollo-client"

import {InMemoryCache} from "apollo-cache-in-memory"
import {createFormDataLink} from "apollo-link-form-data"

const link = createFormDataLink({
  uri: "https://api.example.com/graphql"
})

const cache = new InMemoryCache()

const client = ApolloClient({link, cache})

API

createFormDataLink(options) -> {ApolloLinkFormData}

Creates and instance of ApolloLinkFormData with given options.

  • {object} options.serialize – defines serialization options for @octetstream/object-to-form-data and FormData link
  • {boolean} [options.serialize.force = false] – if true, request payload will be always converted to FormData. Defaults to false which means that payload will be converted to FormData only when it contains at least one File.
  • {boolean} [options.serialize.strict = false] – if true, all falsy booleans will be ignored. (See #1 PR in @octetstream/object-to-form-data for mode info)

More of available options you can find in ApolloLinkHttp documentation.

Related links

  • then-busboy is a promise-based wrapper around Busboy. Process multipart/form-data content and returns it as a single object. Will be helpful to handle your data on the server-side applications.
  • formdata-node is an async-iterator and steam based FormData implementation for Node.js
  • @octetstream/object-to-form-data converts JavaScript object to FormData.
  • Apollo Link is a standard interface for modifying control flow of GraphQL requests and fetching GraphQL results.