diff --git a/README.md b/README.md index 622fb11..023ff2d 100644 --- a/README.md +++ b/README.md @@ -266,11 +266,11 @@ axle.useResponseInterceptor( | Name | Description | | --- | --- | -| [requestHeadersInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/requestHeadersInterceptor.ts) | Used to customize the request header | -| [requestMockInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/requestMockInterceptor.ts) | Used to mock data | -| [responseRetryInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseRetryInterceptor.ts) | Used to realize the request abnormal retry | -| [responseBlobInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseBlobInterceptor.ts) | Used to intercept blob type | -| [responseTimeoutInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseTimeoutInterceptor.ts) | Used to abnormal timeout | +| [requestHeadersInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/requestHeadersInterceptor.md) | Used to customize the request header | +| [requestMockInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/requestMockInterceptor.md) | Used to mock data | +| [responseRetryInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseRetryInterceptor.md) | Used to realize the request abnormal retry | +| [responseBlobInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseBlobInterceptor.md) | Used to intercept blob type | +| [responseTimeoutInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseTimeoutInterceptor.md) | Used to abnormal timeout | ## Vue Composition API diff --git a/README.zh-CN.md b/README.zh-CN.md index 4979027..0331620 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -266,11 +266,11 @@ axle.useResponseInterceptor( | 名称 | 描述 | | --- | --- | -| [requestHeadersInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/requestHeadersInterceptor.ts) | 用于自定义请求头 | -| [requestMockInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/requestMockInterceptor.ts) | 用于模拟数据 | -| [responseRetryInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseRetryInterceptor.ts) | 用于实现请求异常重试 | -| [responseBlobInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseBlobInterceptor.ts) | 用于拦截 blob 类型 | -| [responseTimeoutInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/responseTimeoutInterceptor.ts) | 用于归一化超时异常 | +| [requestHeadersInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/requestHeadersInterceptor.md) | 用于自定义请求头 | +| [requestMockInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/requestMockInterceptor.md) | 用于模拟数据 | +| [responseRetryInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseRetryInterceptor.md) | 用于实现请求异常重试 | +| [responseBlobInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseBlobInterceptor.md) | 用于拦截 blob 类型 | +| [responseTimeoutInterceptor](https://github.com/varletjs/axle/blob/main/src/interceptors/examples/responseTimeoutInterceptor.md) | 用于归一化超时异常 | ## Vue 组合式 API diff --git a/src/interceptors/examples/requestHeadersInterceptor.md b/src/interceptors/examples/requestHeadersInterceptor.md new file mode 100644 index 0000000..1305cb5 --- /dev/null +++ b/src/interceptors/examples/requestHeadersInterceptor.md @@ -0,0 +1,40 @@ +# Request Headers Interceptor + +```js +import { createAxle, requestHeadersInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useRequestInterceptor( + requestHeadersInterceptor({ + // additional headers carried by the request + headers: { + 'Custom-Field': 'custom-field' + }, + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` + +```js +import { createAxle, requestHeadersInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useRequestInterceptor( + requestHeadersInterceptor({ + // headers can also be a getter + headers: () => ({ + 'Authorization': localStorage.getItem('token'), + 'Custom-Field': 'custom-field', + }), + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` \ No newline at end of file diff --git a/src/interceptors/examples/requestMockInterceptor.md b/src/interceptors/examples/requestMockInterceptor.md new file mode 100644 index 0000000..4556f06 --- /dev/null +++ b/src/interceptors/examples/requestMockInterceptor.md @@ -0,0 +1,48 @@ +# Request Mock Interceptor + +```js +import { createAxle, requestMockInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useRequestInterceptor( + requestMockInterceptor({ + // url and handler mapping + mapping: { + '/user/getUsers': { + // request delay time (ms) + delay: 1000, + handler: () => ({ + data: { + code: 200, + data: [ + { + id: 1, + name: 'Mock Jack Ma', + }, + { + id: 2, + name: 'Mock Tom', + }, + ], + message: 'success', + }, + }), + }, + + '/error/**': { + delay: 1000, + handler: () => ({ + // status defaults 200 + status: 500, + data: null + }), + } + }, + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` \ No newline at end of file diff --git a/src/interceptors/examples/responseBlobInterceptor.md b/src/interceptors/examples/responseBlobInterceptor.md new file mode 100644 index 0000000..70af34d --- /dev/null +++ b/src/interceptors/examples/responseBlobInterceptor.md @@ -0,0 +1,25 @@ +# Response Blob Interceptor + +```js +import { createAxle, responseBlobInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useResponseInterceptor( + responseBlobInterceptor({ + // transform blob to normal response type + onResponse: (response) => ({ + ...response, + data: { + code: 200, + data: response.data, + message: 'success', + } + }), + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` \ No newline at end of file diff --git a/src/interceptors/examples/responseRetryInterceptor.md b/src/interceptors/examples/responseRetryInterceptor.md new file mode 100644 index 0000000..10c8011 --- /dev/null +++ b/src/interceptors/examples/responseRetryInterceptor.md @@ -0,0 +1,18 @@ +# Response Retry Interceptor + +```js +import { createAxle, responseRetryInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useResponseInterceptor( + responseRetryInterceptor({ + // retry count + count: 3, + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` \ No newline at end of file diff --git a/src/interceptors/examples/responseTimeoutInterceptor.md b/src/interceptors/examples/responseTimeoutInterceptor.md new file mode 100644 index 0000000..00497f4 --- /dev/null +++ b/src/interceptors/examples/responseTimeoutInterceptor.md @@ -0,0 +1,33 @@ +# Response Timeout Interceptor + +```js +import { createAxle, responseTimeoutInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useResponseInterceptor( + // normalize the timeout error code to TIMEOUT + responseTimeoutInterceptor({ + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` + +```js +import { createAxle, responseTimeoutInterceptor } from '@varlet/axle' + +const axle = createAxle() + +axle.useResponseInterceptor( + // custom error code + responseTimeoutInterceptor({ + normalizeErrorCode: 'CUSTOM', + + // optional filtering options that determine whether the interceptor intercepts + include: ['method:get', 'method:post'], + exclude: ['/user/**'], + }) +) +``` \ No newline at end of file