Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »


    AbortController polyfill for abortable fetch()

    npm version

    Minimal stubs so that the AbortController DOM API for terminating fetch() requests can be used in browsers that doesn't yet implement it. This "polyfill" doesn't actually close the connection when the request is aborted, but it will call .catch() with == 'AbortError' instead of .then().

    const controller = new AbortController();
    const signal = controller.signal;
    fetch('/some/url', {signal})
      .then(res => res.json())
      .then(data => {
        // do something with "data"
      }).catch(err => {
        if ( == 'AbortError') {
    // controller.abort(); // can be called at any time

    You can read about the AbortController API in the DOM specification.

    How to use

    $ npm install --save abortcontroller-polyfill

    If you're using webpack or similar, you then import it early in your client entrypoint .js file using

    import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'
    // or:

    Using it on browsers without fetch

    If you need to support browsers where fetch is not available at all (for example Internet Explorer 11), you first need to install a fetch polyfill and then import the abortcontroller-polyfill afterwards.

    The unfetch npm package offers a minimal fetch() implementation (though it does not offer for example a Request class). If you need a polyfill that implements the full Fetch specification, use the whatwg-fetch npm package instead. Typically you will also need to load a polyfill that implements ES6 promises, for example promise-polyfill, and of course you need to avoid ES6 arrow functions and template literals.

    Example projects showing abortable fetch setup so that it works even in Internet Explorer 11, using both unfetch and GitHub fetch, is available here.

    Using it along with 'create-react-app'

    create-react-app enforces the no-undef eslint rule at compile time so if your version of eslint does not list AbortController etc as a known global for the browser environment, then you might run into an compile error like:

      'AbortController' is not defined  no-undef

    This can be worked around by (temporarily, details here) adding a declaration like:

      const AbortController = window.AbortController;

    Using the AbortController/AbortSignal without patching fetch

    If you just want to polyfill AbortController/AbortSignal without patching fetch you can use:

    import 'abortcontroller-polyfill/dist/abortcontroller-polyfill-only'

    Using it on Node.js

    You can either import it as a ponyfill without modifying globals:

    const { AbortController, abortableFetch } = require('abortcontroller-polyfill/dist/cjs-ponyfill');
    const { fetch } = abortableFetch(require('node-fetch'));
    // or
    // import AbortController, { abortableFetch } from 'abortcontroller-polyfill/dist/cjs-ponyfill';
    // import _fetch from 'node-fetch';
    // const { fetch } = abortableFetch(_fetch);

    or if you're lazy

    global.fetch = require('node-fetch');

    If you also need a Request class with support for aborting you can do:

    const { AbortController, abortableFetch } = require('abortcontroller-polyfill/dist/cjs-ponyfill');
    const _nodeFetch = require('node-fetch');
    const { fetch, Request } = abortableFetch({fetch: _nodeFetch, Request: _nodeFetch.Request});
    const controller = new AbortController();
    const signal = controller.signal;
    fetch(Request("", {signal}))
      .then(r => r.json())
      .then(j => console.log(j))
      .catch(err => {
          if ( === 'AbortError') {

    See also Node.js examples here







    npm i abortcontroller-polyfill

    Downloadslast 7 days







    last publish


    • avatar