From 3773dae4cf0a5f764b5e4d1e8fdeca444cecf6bb Mon Sep 17 00:00:00 2001
From: fanhaoyuan <418536538@qq.com>
Date: Wed, 11 May 2022 11:44:39 +0800
Subject: [PATCH] docs: add examples for `interceptors`

---
 README.md       | 98 ++++++++++++++++++++++++++++++++++++++++++++++++-
 README.zh-CN.md | 98 ++++++++++++++++++++++++++++++++++++++++++++++++-
 2 files changed, 192 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 007b833..a5a3c18 100644
--- a/README.md
+++ b/README.md
@@ -82,7 +82,7 @@ fatcher({
 #### createScopedRequest
 
 ```ts
-import { createScopedRequest } from 'fatcher';
+import { createScopedRequest, fatcher, isFatcherError } from 'fatcher';
 import { json } from '@fatcherjs/middleware-json';
 
 const fatcher = createScopedRequest({
@@ -117,7 +117,7 @@ fatcher({
 Inline Options `>` Scoped Options `>` Default Options
 
 ```ts
-import { setDefaultOptions } from 'fatcher';
+import { setDefaultOptions, fatcher, isFatcherError } from 'fatcher';
 import { json } from '@fatcherjs/middleware-json';
 
 setDefaultOptions({
@@ -147,6 +147,100 @@ fatcher({
     });
 ```
 
+### Interceptors
+
+It's actually using a custom Middleware to intercept.
+
+#### Request Interceptor
+
+An example for intercepting request before send.
+
+```ts
+import { Middleware, fatcher, isFatcherError } from 'fatcher';
+
+function requestInterceptor(): Middleware {
+    return {
+        name: 'fatcher-middleware-request-interceptor',
+        use(context, next) {
+            if (!context.payload) {
+                return Promise.reject(new Error('Payload is required.'));
+            }
+
+            if (context.method !== 'POST') {
+                return Promise.reject(new Error('Method is not allowed.'));
+            }
+
+            // check anything from context.
+
+            return next();
+        },
+    };
+}
+
+fatcher({
+    url: '/foo/bar',
+    method: 'POST',
+    middlewares: [requestInterceptor()],
+})
+    .then(response => {
+        // response
+        console.log(response);
+    })
+    .catch(error => {
+        if (isFatcherError(error)) {
+            // handle fatcher error;
+            console.error(error.toJSON());
+            return;
+        }
+        // handle other error
+        console.error(error);
+    });
+```
+
+#### Response Interceptor
+
+An example for intercepting response before resolve.
+
+```ts
+import { Middleware, fatcher, isFatcherError } from 'fatcher';
+
+function responseInterceptor(): Middleware {
+    return {
+        name: 'fatcher-middleware-response-interceptor',
+        async use(context, next) {
+            const result = await next();
+
+            // check anything from result.
+
+            if (result.data.status === 50000) {
+                return Promise.reject(result.data);
+            }
+
+            return result;
+        },
+    };
+}
+
+fatcher({
+    url: '/foo/bar',
+    method: 'POST',
+    middlewares: [responseInterceptor()],
+})
+    .then(response => {
+        // response
+        console.log(response);
+    })
+    .catch(error => {
+        if (isFatcherError(error)) {
+            // handle fatcher error;
+            console.error(error.toJSON());
+            return;
+        }
+        // handle other error
+        console.error(error);
+    });
+```
+
 ## Polyfills
 
 -   [Streams API](https://github.com/MattiasBuelens/web-streams-polyfill#readme)
diff --git a/README.zh-CN.md b/README.zh-CN.md
index f17b117..c7ab946 100644
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
@@ -82,7 +82,7 @@ fatcher({
 #### 作用域请求
 
 ```ts
-import { createScopedRequest } from 'fatcher';
+import { createScopedRequest, fatcher, isFatcherError } from 'fatcher';
 import { json } from '@fatcherjs/middleware-json';
 
 // 自定义初始化配置项
@@ -116,7 +116,7 @@ fatcher({
 行内配置 `>` 作用域配置 `>` 全局配置
 
 ```ts
-import { setDefaultOptions } from 'fatcher';
+import { setDefaultOptions, fatcher, isFatcherError } from 'fatcher';
 import { json } from '@fatcherjs/middleware-json';
 
 setDefaultOptions({
@@ -143,6 +143,100 @@ fatcher({
     });
 ```
 
+### 拦截器
+
+实际上是使用自定义中间件来拦截。
+
+#### 请求拦截器
+
+一个在发送前拦截请求的示例。
+
+```ts
+import { Middleware, fatcher, isFatcherError } from 'fatcher';
+
+function requestInterceptor(): Middleware {
+    return {
+        name: 'fatcher-middleware-request-interceptor',
+        use(context, next) {
+            if (!context.payload) {
+                return Promise.reject(new Error('Payload is required.'));
+            }
+
+            if (context.method !== 'POST') {
+                return Promise.reject(new Error('Method is not allowed.'));
+            }
+
+            // 从 context 中检查内容
+
+            return next();
+        },
+    };
+}
+
+fatcher({
+    url: '/foo/bar',
+    method: 'POST',
+    middlewares: [requestInterceptor()],
+})
+    .then(response => {
+        // 响应内容
+        console.log(response);
+    })
+    .catch(error => {
+        if (isFatcherError(error)) {
+            // 处理请求失败的错误
+            console.error(error.toJSON());
+            return;
+        }
+        // 处理其他错误
+        console.error(error);
+    });
+```
+
+#### 响应拦截器
+
+一个在解析前拦截响应的示例。
+
+```ts
+import { Middleware, fatcher, isFatcherError } from 'fatcher';
+
+function responseInterceptor(): Middleware {
+    return {
+        name: 'fatcher-middleware-response-interceptor',
+        async use(context, next) {
+            const result = await next();
+
+            // 从 result 中检查内容
+
+            if (result.data.status === 50000) {
+                return Promise.reject(result.data);
+            }
+
+            return result;
+        },
+    };
+}
+
+fatcher({
+    url: '/foo/bar',
+    method: 'POST',
+    middlewares: [responseInterceptor()],
+})
+    .then(response => {
+        // 响应内容
+        console.log(response);
+    })
+    .catch(error => {
+        if (isFatcherError(error)) {
+            // 处理请求失败的错误
+            console.error(error.toJSON());
+            return;
+        }
+        // 处理其他错误
+        console.error(error);
+    });
+```
+
 ## Polyfills
 
 -   [Streams API](https://github.com/MattiasBuelens/web-streams-polyfill#readme)