xfetch

一个简单的 fetch 模块，支持 nodejs & browser，支持自定义中间件，类似 koa2 的中间件用法。

Why

觉得 koa2 的中间件模式很有趣，所以简单封装了一下，方便使用。 在实际场景中，每个业务对请求都会有一定固定的需求，例如添加 token，添加 Authorization header，支持缓存，统一处理错误，等等。 用中间件的方式自己感觉是比较清晰一些。

Useage

const xfetch = require('x-fetch-middleware');

// get /api/products
await xfetch('/api/products');
// get /api/products?page=1&pageSize=10
await xfetch.get('/api/products', { params: { page: 1, pageSize: 10 } });
// post /api/products?from=app  body: { name: 'test', price: 10 }
await xfetch.post('/api/products', { params: { from: 'app' }, body: { name: 'test', price: 10 } });
// 其他
xfetch.put(url, options);
xfetch.delete(url, options);
xfetch.patch(url, options);

// 中间件
// 添加一个from字段和时间戳到queryString
xfetch.use(async (ctx, next) => {
  ctx.req.params.from = 'app';
  ctx.req.params.t = Date.now();
  await next();
});

// 添加一个缓存中间件，请自行添加过期时间
xfetch.use(async (ctx, next) => {
  const { req } = ctx;
  if (!req.cache) return next();

  const key = ctx.req.url + JSON.stringify(req.params) + JSON.stringify(req.body);
  const cached = sessionStorage.getItem(key);
  if (cached) {
    const response = new Response(new Blob([cached]));
    return response.json();
  } else {
    await next();
    const cache = await ctx.res.clone().text();
    sessionStorage.setItem(key, cache);
  }
});

// 添加多个中间件
xfetch.use([cache, checkStatus]);

License

MIT