{"id":47620,"library":"fetch-multipart-graphql","title":"fetch-multipart-graphql","description":"Cross-browser function to fetch and parse streaming multipart GraphQL responses, enabling support for the @defer directive in GraphQL clients like Apollo Server and Relay Modern. Current stable version is 2.3.1, released with moderate cadence. Key differentiators: supports both fetch and XMLHttpRequest, handles streaming multipart responses out-of-the-box, and works with Relay's Observable pattern. Requires polyfill for TextEncoder/TextDecoder in older browsers.","status":"active","version":"2.3.1","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/relay-tools/fetch-multipart-graphql","tags":["javascript"],"install":[{"cmd":"npm install fetch-multipart-graphql","lang":"bash","label":"npm"},{"cmd":"yarn add fetch-multipart-graphql","lang":"bash","label":"yarn"},{"cmd":"pnpm add fetch-multipart-graphql","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Polyfill required for TextEncoder/TextDecoder in browsers that lack native support (e.g., older Edge, IE11).","package":"text-encoding-utf-8","optional":true}],"imports":[{"note":"Default export is a function. The package is ESM-only; CommonJS require() will not work.","wrong":"const fetchMultipart = require('fetch-multipart-graphql');","symbol":"default export","correct":"import fetchMultipart from 'fetch-multipart-graphql';"},{"note":"TypeScript users should use import type for the options type to avoid runtime inclusion.","wrong":"import { FetchMultipartOptions } from 'fetch-multipart-graphql';","symbol":"type for options (TypeScript)","correct":"import type { FetchMultipartOptions } from 'fetch-multipart-graphql';"},{"note":"There is no named export; only the default function is exported.","wrong":"import { fetchMultipart } from 'fetch-multipart-graphql';","symbol":"Named exports (none)","correct":"Only default export available."}],"quickstart":{"code":"import fetchMultipart from 'fetch-multipart-graphql';\n\nconst query = `\n  query {\n    viewer {\n      name\n      ...DeferredFields @defer\n    }\n  }\n  fragment DeferredFields on User {\n    email\n  }\n`;\n\nfetchMultipart('/graphql', {\n  method: 'POST',\n  headers: { 'content-type': 'application/json' },\n  body: JSON.stringify({ query }),\n  credentials: 'include',\n  onNext: (parts) => {\n    console.log('Received parts:', parts);\n    // parts is an array of GraphQL responses\n  },\n  onError: (err) => {\n    console.error('Error:', err);\n  },\n  onComplete: () => {\n    console.log('Stream complete');\n  }\n});","lang":"typescript","description":"Fetches a multipart GraphQL response with @defer and logs each chunk. Uses credentials: 'include' for cookies."},"warnings":[{"fix":"Install and import 'text-encoding-utf-8' before using fetchMultipart.","message":"The package requires TextEncoder/TextDecoder to be available globally. In browsers like IE11 or older Edge, you must provide a polyfill, otherwise requests will fail silently.","severity":"gotcha","affected_versions":"all"},{"fix":"Ensure the server supports multipart responses (e.g., Apollo Server with @defer). Otherwise, use a regular fetch.","message":"If the server does not return a multipart response (e.g., single JSON response), fetchMultipart will hang because it expects a stream. This is a common pitfall when @defer is not properly configured.","severity":"breaking","affected_versions":"all"},{"fix":"Update onNext to expect an array: parts => /* handle array */","message":"The onNext callback receives an array of parts. In earlier versions, it received a single part object. If you are migrating, check your callback signature.","severity":"deprecated","affected_versions":">=2.0.0 <2.3.0"},{"fix":"Test your specific browser scenario; consider using fetch if possible.","message":"When using credentials: 'same-origin' or 'include', the XHR path may have different behavior than fetch in some browsers regarding CORS.","severity":"gotcha","affected_versions":"all"}],"env_vars":null,"search_vec":"'2.3.1':36 'apollo':27 'box':56 'browser':7,70 'cadenc':40 'client':25 'cross':6 'cross-brows':5 'current':32 'defer':21 'differenti':42 'direct':22 'enabl':17 'fetch':2,10,45 'fetch-multipart-graphql':1 'function':8 'graphql':4,15,24 'handl':48 'javascript':71 'key':41 'like':26 'moder':39 'modern':31 'multipart':3,14,50 'observ':62 'older':69 'out-of-the-box':52 'pars':12 'pattern':63 'polyfil':65 'relay':30,60 'releas':37 'requir':64 'respons':16,51 'server':28 'stabl':33 'stream':13,49 'support':18,43 'textencoder/textdecoder':67 'version':34 'work':58 'xmlhttprequest':47","created_at":"2026-06-07T16:52:27.168013+00:00","updated_at":"2026-06-07T16:52:27.168013+00:00","problems":[{"fix":"npm install text-encoding-utf-8 and import it before fetchMultipart.","cause":"Missing TextEncoder/TextDecoder polyfill in browsers that don't support it natively.","error":"TextEncoder is not defined"},{"fix":"Use: import fetchMultipart from 'fetch-multipart-graphql';","cause":"Incorrect import: using named import instead of default import.","error":"fetchMultipart is not a function"},{"fix":"Provide onNext, onError, and onComplete as options object properties.","cause":"Missing or incorrectly named options callback (e.g., onNext vs onData).","error":"Cannot read property 'onNext' of undefined"},{"fix":"Configure server to allow the Origin, methods, and headers.","cause":"The request uses credentials or non-simple headers triggering CORS preflight; server must respond with appropriate CORS headers.","error":"Request aborted due to CORS preflight"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":null,"cli_version":null,"type":"library","homepage":"https://github.com/relay-tools/fetch-multipart-graphql#readme","github":"ssh://git@github.com/relay-tools/fetch-multipart-graphql","docs":null,"changelog":null,"pypi":null,"npm":"fetch-multipart-graphql","openapi_spec":null,"status_page":null,"smithery":null,"categories":["api"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-07","next_check":"2026-09-05","install_tag":null}}