GithubHelp home page GithubHelp logo

fetch-extras's Introduction

fetch-extras logo

Useful utilities for working with Fetch

For more features and conveniences on top of Fetch, check out my ky package.

Install

npm install fetch-extras

Usage

import {withHttpError, withTimeout} from 'fetch-extras';

// Create an enhanced reusable fetch function that:
// - Throws errors for non-200 responses
// - Times out after 5 seconds
const enhancedFetch = withHttpError(withTimeout(fetch, 5000));

const response = await enhancedFetch('/api');
const data = await response.json();

API

See the types for now.

Related

  • is-network-error - Check if a value is a Fetch network error
  • ky - HTTP client based on Fetch

fetch-extras's People

Contributors

sindresorhus avatar

Stargazers

Tony Brown avatar Jatin Jindal avatar Byeongmin Jeon avatar  avatar Rio Chandra avatar nichoth avatar  avatar  avatar  avatar fsubal avatar  avatar Stephen Way avatar Jordan avatar rec avatar Jeffrey Xavier avatar Timmybrick avatar  avatar patrick avatar Takuya Fukuju avatar Meiji Hatakeyama avatar Sam Mason de Caires avatar Thomas Bouffard avatar Enoch avatar kartikeyyy avatar Raul Melo avatar Satoru Ohzawa avatar Mark Leo Cativo avatar Skid avatar Ahmad Bilal avatar huuya avatar Ronit Sarkar avatar Eunsu(Evan) Kim avatar  avatar Lalit avatar henry-yu-lb avatar Gopher avatar Matthew avatar Luís Rodrigues avatar  avatar ComputerGuy avatar Alex Swit avatar 不游 avatar Johnie Hjelm avatar Santhosh Veer avatar Marcos Viana avatar Chantouch Sek avatar Logan McAnsh avatar Evelyn Hathaway avatar ryoppippi avatar Adan Alvarado avatar Simon Babay avatar  avatar Orion Gabriel avatar Emeka Orji avatar Shodipo Ayomide avatar Yukai Huang avatar João Palmeiro avatar Nano Miratus avatar Mitch Stewart avatar Michael Sprague avatar Avin Madhu avatar Ondra Kandera avatar Ali Torki avatar Yuhei Yasuda avatar Christian Owusu avatar Kristóf Poduszló avatar Moinul Moin avatar Brian Gacheru avatar Tobias Pickel avatar Ivan Nikolić avatar Tobias Deekens avatar CondorHero avatar Grafaffel avatar Cole Townsend avatar Zhazha_JiaYiZhen avatar Emmanuel Haguet avatar Guofeng Lin avatar

Watchers

 avatar Dasa Paddock avatar

fetch-extras's Issues

Ideas

  1. withRetry - Automatically retry failed requests with configurable attempts, delays and backoff strategy
  2. withBaseUrl - Add base URL to all requests, useful for API clients
  3. withHeaders - Add default headers to all requests (like auth tokens, content-type)
  4. withCache - Simple in-memory caching for GET requests with configurable TTL
  5. withRateLimit - Implement client-side rate limiting
  6. withProgress - Add upload/download progress tracking

`withTimeout`

Would be useful to have a function to easily get timeout for a fetch function.

import {withTimeout} from 'fetch-extras';

const fetchWithTimeout = withTimeout(fetch, 5000);

const response = await fetchWithTimeout('/api');
const data = await response.json();

POC (untested):

export function withTimeout(fetchFunction, timeout) {
	return async (urlOrRequest, options = {}) => {
		const providedSignal = options.signal ?? (urlOrRequest instanceof Request && urlOrRequest.signal);
		const signal = AbortSignal.any([providedSignal, AbortSignal.timeout(timeout)].filter(Boolean));
		return fetchFunction(urlOrRequest, {...options, signal});
	};
}

Feedback wanted


If this one works out, I imagine we could have more.

const superFetch = withHttpError(withTimeout(fetch, 5000));

const response = await superFetch('/api');
const data = await response.json();

Alternative API:

const betterFetch = createFetch(
    fetchTimeout(5000),
    fetchRetry(3)
);

const response = await betterFetch('/api');
const data = await response.json();

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.