xior

Xior

An Axios replacement request library use fetch, and more.

Features:

• 🫡 Similiar axios.create / axios.interceptors.request.use / axios.interceptors.response.use / .get/post/put/patch/delete/head/options
• 🔥 Use fetch
• 🚀 Lightweight ~5KB, Gzip ~2.0KB
• 🤙 Support timeout and cancel request
• 👊 Unit tests
• 💪 100% Write in TypeScript
• 🥷 Plugins support: error retry, cache, repeat requests avoid plugin 😎

Getting Started

import xior from 'xior';

const http = xior.create({ baseURL: 'https://exmaple.com', timeout: 120 * 1000 });

http.interceptors.request.use((config) => {
  // do something
  return config;
});

http.interceptors.response.use((result) => {
  const { config, response, data } = result;
  // do something
  return result;
});

async function getList() {
  const { data } = await http.get('/list', { params: { page: 1, perPage: 20 } });
  return data;
}

async function create() {
  const { data } = await http.post(
    '/create',
    { name: 'test', desc: 'foobar..foobar' },
    { params: { redirect: '/list' } }
  );
  return data;
}

Custom plugin

xior.plugins.use(async (request, response, error) => {
  const inRequestPhase = !response;
  const inResponsePhase = Boolean(response);
  const isError = Boolean(error);

  if (isError) {
    //
  }
  if (inRequestPhase) {
    //
  } else if (inResponsePhase) {
    //
  }
});

FAQ

• Is xior 100% compatiable with axios? No.
• How to cancel request? Ok
• How to upload files? Ok
• How to show upload progress like axios? Don't support.
• What about response of 'stream' | 'document' | 'arraybuffer' | 'blob' ? Use responseType: 'stream' | 'document' | 'arraybuffer' | 'blob', will return original { response }
• More: Anything else? create new issues let me know!

Changelog

v0.0.2 2024-02-18

• Feat: improved error handling compatibility with Axios's response interceptor.