diff --git a/README.md b/README.md index a0892c7..9bcbbae 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,6 @@ axios-miniprogram 是一款为小程序平台量身定制的轻量级请求库 ## 特性 - 支持 `Typescript`,健全的类型系统,智能的 `IDE` 提示。 -- 支持 `Promise`。 - 支持 动态地址。 - 支持 校验状态码。 - 支持 参数序列化。 @@ -35,9 +34,10 @@ axios-miniprogram 是一款为小程序平台量身定制的轻量级请求库 - 支持 错误处理。 - 支持 转换数据。 - 支持 取消请求。 +- 支持 扩展实例。 +- 支持 中间件。 - 支持 拦截器。 -- 支持 派生领域。 -- 支持 适配器。 +- 支持 平台适配器。 ## 目前内部支持的平台 diff --git a/docs/pages/advanced/middleware.md b/docs/pages/advanced/middleware.md index f6053e4..c6b09eb 100644 --- a/docs/pages/advanced/middleware.md +++ b/docs/pages/advanced/middleware.md @@ -5,26 +5,120 @@ title: 中间件 # {{ $frontmatter.title }} ::: tip {{ $frontmatter.title }} -洋葱模型中间件。 +基于洋葱模型的中间件。 ::: +## 前言 + +如果您了解或者使用过[koa](https://github.com/koajs/koa),相信您一定十分了解什么是洋葱模型,中间件该怎么写。 + +中间件是一个异步函数,接收 `context` 和 `next` 两个参数。 + +`context` 是一个对象,提供了 `req` 对象和 `res` 对象作为其做成部分。 + +- `context.req`:请求配置。 + +- `context.res`:请求完成后服务端返回的响应体,它的初始值是 `null`,请求完成之后才能对其进行操作。 + +`next` 是一个异步函数,如果希望程序继续执行后续逻辑,请手动调用它。 + +```ts +async (ctx, next) => { + // 请求发送前 + const { + // 请求配置 + req, + + // 此时为 null + res, + } = ctx; + + // 调用 next 继续执行后续逻辑,最终发送请求 + await next(); + + // 请求完成后 + const { + // 请求配置 + req, + + // 服务端返回的响应体 + res, + } = ctx; +}; +``` + +## 全局中间件 + +可以添加全局中间件,对发送的每个请求生效。 + ```ts import axios from 'axios-miniprogram'; -axios.use(async (ctx, next) => { - console.log('start1'); - await next(); - console.log('end1'); -}); +// use 会返回 this,可以链式添加多个 +axios + .use(async (ctx, next) => { + console.log('1'); + await next(); + console.log('4'); + }) + .use(async (ctx, next) => { + console.log('2'); + await next(); + console.log('3'); + }); -axios.use(async (ctx, next) => { - console.log('start2'); - await next(); - console.log('end2'); -}); - -// start1 -> start2 -> /test -> end2 -> end1 +// 洋葱模型执行顺序 +// 1 -> 2 -> /test -> 3 -> 4 axios('/test'); ``` -未完待续。。。 +## 实例中间件 + +可以为实例添加中间件,对实例发送的每个请求生效。 + +```ts +import axios from 'axios-miniprogram'; + +const instance = axios.create({ + baseURL: 'https://api.com', +}); + +instance.use(async (ctx, next) => { + console.log('instance request'); + await next(); + console.log('instance response'); +}); + +// instance request -> 'https://api.com/test -> instance response +instance('https://api.com/test'); +``` + +## 扩展实例中间件 + +可以为扩展实例添加中间件,扩展实例同时也可以复用父级中间件。 + +```ts +import axios from 'axios-miniprogram'; + +axios.defaults.baseURL = 'https://api.com'; + +axios.use(async (ctx, next) => { + console.log('axios request'); + await next(); + console.log('axios response'); +}); + +const instance = axios.extend({ + baseURL: '/test', +}); + +instance.use(async (ctx, next) => { + console.log('instance request'); + await next(); + console.log('instance response'); +}); + +// 复用父级中间件 +// axios request -> instance request -> https://api.com/test/uesr -> instance response -> axios response +instance('/user'); +``` diff --git a/docs/pages/advanced/request-interceptor.md b/docs/pages/advanced/request-interceptor.md index 4d9a3a1..6295631 100644 --- a/docs/pages/advanced/request-interceptor.md +++ b/docs/pages/advanced/request-interceptor.md @@ -5,7 +5,7 @@ title: 请求拦截器 # {{ $frontmatter.title }} ::: tip {{ $frontmatter.title }} -用于请求发出前拦截请求。 +用于请求发送前拦截请求。 通常会用于转换请求配置,或实现一些自定义功能。 ::: diff --git a/docs/pages/basics/transform-data.md b/docs/pages/basics/transform-data.md index 570f7bf..324c5f9 100644 --- a/docs/pages/basics/transform-data.md +++ b/docs/pages/basics/transform-data.md @@ -5,7 +5,7 @@ title: 转换数据 # {{ $frontmatter.title }} ::: tip {{ $frontmatter.title }} -请求发出前转换请求数据,响应到达 `then` 之前转换响应数据。 +请求发送前转换请求数据,响应到达 `then` 之前转换响应数据。 ::: ## 转换请求数据 diff --git a/package.json b/package.json index 4371445..d329bf6 100644 --- a/package.json +++ b/package.json @@ -25,6 +25,10 @@ "homepage": "https://axios-miniprogram.com", "license": "MIT", "type": "module", + "engines": { + "node": ">=16", + "pnpm": ">=7" + }, "scripts": { "cz": "simple-git-hooks && czg", "build": "esno scripts/build.ts", diff --git a/src/core/Axios.ts b/src/core/Axios.ts index 7d2430b..d9f555f 100644 --- a/src/core/Axios.ts +++ b/src/core/Axios.ts @@ -470,6 +470,7 @@ export default class Axios { }); chain.push(errorHandler); + const source = Promise.resolve(mergeConfig(this.defaults, config)); return chain.reduce( (next, { resolved, rejected }) => next.then( @@ -477,7 +478,7 @@ export default class Axios { resolved, rejected, ), - Promise.resolve(mergeConfig(this.defaults, config)), + source, ) as Promise; }; diff --git a/test/request/cancel.test.ts b/test/request/cancel.test.ts index b123aab..cf3d912 100644 --- a/test/request/cancel.test.ts +++ b/test/request/cancel.test.ts @@ -115,7 +115,7 @@ describe('src/request/cancel.ts', () => { expect(() => s.token.throwIfRequested()).toThrowError('1'); }); - test('应该可以在请求发出之前取消', async () => { + test('应该可以在请求发送之前取消', async () => { const cb = vi.fn(); const s = CancelToken.source(); @@ -131,7 +131,7 @@ describe('src/request/cancel.ts', () => { expect(isCancel(cb.mock.calls[0][0])).toBeTruthy(); }); - test('应该可以在请求发出之后取消', async () => { + test('应该可以在请求发送之后取消', async () => { const cb = vi.fn(); const s = CancelToken.source();