From 21c287dcca75d37bdbbd6175d133d93913e24ecf Mon Sep 17 00:00:00 2001 From: Josp3r Date: Thu, 5 Dec 2024 07:43:59 +0000 Subject: [PATCH] deploy: 897e97ddb98a93abde7cb1a5a9a13e63d3e01963 --- 404.html | 2 +- guide/advance/abort-request.html | 2 +- guide/advance/get-response.html | 2 +- guide/advance/intro.html | 2 +- guide/advance/modify-res-data.html | 2 +- guide/advance/response-type.html | 2 +- guide/advance/return-res-data.html | 2 +- guide/advance/set-default-headers.html | 2 +- guide/advance/set-unify-params.html | 2 +- guide/changelog.html | 2 +- guide/examples.html | 2 +- guide/getting-started.html | 2 +- hashmap.json | 2 +- index.html | 2 +- intro/framework.html | 2 +- intro/middleware.html | 2 +- intro/what-is.html | 2 +- intro/wonder.html | 2 +- reference/interface-middleware-builtin.html | 2 +- reference/interface-middleware-common.html | 2 +- reference/interface-service.html | 2 +- reference/npm-server-fetch.html | 2 +- reference/npm-xhr.html | 2 +- 23 files changed, 23 insertions(+), 23 deletions(-) diff --git a/404.html b/404.html index 793243d..4678fb8 100644 --- a/404.html +++ b/404.html @@ -12,7 +12,7 @@
HTTP Service

Appearance

404

PAGE NOT FOUND

But if you don't change your direction, and if you keep looking, you may end up where you are heading.
Take me home
- diff --git a/guide/advance/abort-request.html b/guide/advance/abort-request.html index cb357d4..bf36a4b 100644 --- a/guide/advance/abort-request.html +++ b/guide/advance/abort-request.html @@ -51,7 +51,7 @@ await next() } } - diff --git a/guide/advance/get-response.html b/guide/advance/get-response.html index 3df3df1..df31ac4 100644 --- a/guide/advance/get-response.html +++ b/guide/advance/get-response.html @@ -34,7 +34,7 @@ .catch((err) => { console.log(err) }) - diff --git a/guide/advance/intro.html b/guide/advance/intro.html index 7ffc09c..378acb2 100644 --- a/guide/advance/intro.html +++ b/guide/advance/intro.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

On this page

自定义调整中间件 操作指南 ​

您可以已通过请求发起前和请求响应后根据具体的情况进行自定义的操作

- diff --git a/guide/advance/modify-res-data.html b/guide/advance/modify-res-data.html index f7e1b8b..89e86ba 100644 --- a/guide/advance/modify-res-data.html +++ b/guide/advance/modify-res-data.html @@ -99,7 +99,7 @@ .catch((err) => { console.log(err) }) - diff --git a/guide/advance/response-type.html b/guide/advance/response-type.html index 9b1b30e..7069bbe 100644 --- a/guide/advance/response-type.html +++ b/guide/advance/response-type.html @@ -32,7 +32,7 @@ .catch((err) => { console.log(err) }) - diff --git a/guide/advance/return-res-data.html b/guide/advance/return-res-data.html index ecc8883..00df6c9 100644 --- a/guide/advance/return-res-data.html +++ b/guide/advance/return-res-data.html @@ -45,7 +45,7 @@ .catch((err) => { console.log(err) }) - diff --git a/guide/advance/set-default-headers.html b/guide/advance/set-default-headers.html index f2a1933..d2db817 100644 --- a/guide/advance/set-default-headers.html +++ b/guide/advance/set-default-headers.html @@ -38,7 +38,7 @@ } } ]) - diff --git a/guide/advance/set-unify-params.html b/guide/advance/set-unify-params.html index 68f625b..99248f6 100644 --- a/guide/advance/set-unify-params.html +++ b/guide/advance/set-unify-params.html @@ -77,7 +77,7 @@ }) }, } - diff --git a/guide/changelog.html b/guide/changelog.html index a6633b5..c8e314d 100644 --- a/guide/changelog.html +++ b/guide/changelog.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

On this page

CHANGELOG ​

[v1.0.0-rc.7] - 2024-04-18 ​

Added ​

  • Bundle update

[v1.0.0-rc.6] - 2024-03-19 ​

Added ​

  • Types update

Fixed ​

  • AssembleCtrl compose bug

[v1.0.0-rc.1] - 2024-01-11 ​

Added ​

  • Release RC version
- diff --git a/guide/examples.html b/guide/examples.html index efe91e7..adee147 100644 --- a/guide/examples.html +++ b/guide/examples.html @@ -105,7 +105,7 @@ .catch((err) => { console.log(err) }) - diff --git a/guide/getting-started.html b/guide/getting-started.html index 8404343..9b7eb75 100644 --- a/guide/getting-started.html +++ b/guide/getting-started.html @@ -73,7 +73,7 @@ // 对于http-svc相关的npm包，我们默认都是esm格式，因此如果有依赖额外的公共中间件npm包，理论上都需要在这儿增加 ], }

Polyfill ​

如果您的项目需要在一些低版本（兼容性较差）的环境运行，建议做以下polyfill

shell
npm install --save abortcontroller-polyfill
js
import 'abortcontroller-polyfill/dist/polyfill-patch-fetch'

因为node环境我们要结合node-fetch发起请求，可以使用@http-svc/server-fetch，请参考该中间件的文档

其依赖的AbortController可以使用下列方式引入

shell
npm install --save abortcontroller-polyfill
js
import 'abortcontroller-polyfill/dist/abortcontroller-polyfill-only'
- diff --git a/hashmap.json b/hashmap.json index 8a612b2..c832c3f 100644 --- a/hashmap.json +++ b/hashmap.json @@ -1 +1 @@ -{"guide_advance_set-unify-params.md":"3033ec3e","guide_advance_modify-res-data.md":"d84d3732","guide_advance_response-type.md":"111ac51d","index.md":"f40ab15c","intro_middleware.md":"df62b2a1","intro_framework.md":"82a18f91","guide_changelog.md":"6fdb3fc6","intro_what-is.md":"2be87586","intro_wonder.md":"47b835d3","guide_getting-started.md":"c0e5a31d","guide_advance_return-res-data.md":"0f53354b","guide_advance_abort-request.md":"4fed5130","reference_interface-middleware-builtin.md":"055805ca","reference_interface-middleware-common.md":"eef472ba","reference_npm-server-fetch.md":"77905c07","reference_npm-xhr.md":"6c551628","guide_advance_intro.md":"d196cbd6","guide_examples.md":"f73927d6","reference_interface-service.md":"2980ecce","guide_advance_set-default-headers.md":"2efa8640","guide_advance_get-response.md":"59983eff"} +{"guide_advance_modify-res-data.md":"d84d3732","guide_advance_return-res-data.md":"0f53354b","reference_interface-middleware-builtin.md":"055805ca","guide_advance_intro.md":"d196cbd6","reference_npm-server-fetch.md":"77905c07","guide_getting-started.md":"c0e5a31d","intro_middleware.md":"df62b2a1","intro_what-is.md":"2be87586","intro_wonder.md":"47b835d3","intro_framework.md":"82a18f91","index.md":"f40ab15c","guide_advance_response-type.md":"111ac51d","reference_interface-middleware-common.md":"eef472ba","guide_examples.md":"f73927d6","guide_advance_set-unify-params.md":"3033ec3e","reference_npm-xhr.md":"6c551628","guide_changelog.md":"6fdb3fc6","guide_advance_get-response.md":"59983eff","guide_advance_abort-request.md":"4fed5130","reference_interface-service.md":"2980ecce","guide_advance_set-default-headers.md":"2efa8640"} diff --git a/index.html b/index.html index 053f15d..50cedb2 100644 --- a/index.html +++ b/index.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

HTTP Service

一个基于中间件的请求库

标准化，易扩展，支持浏览器与Node.js

开始
在Github上查看
🏭

专注于中间件

只需要通过注册中间件来组织您的请求过程

🔧

拓展集成

拓展与集成属于您的自定义中间件

⚡

性能出众

基于现代浏览器API，体积精简，按需使用

- diff --git a/intro/framework.html b/intro/framework.html index ef43f1b..8f41fbf 100644 --- a/intro/framework.html +++ b/intro/framework.html @@ -19,7 +19,7 @@ await next() console.log('[MIDDLEWARE_NAME]request after') }
Try it!
Retry
Init Context
Res Data
Body
Timeout
Fetch

设计过程 ​

端语言特点
前端JS(TS)/Node偏灵活，动态
后端Go/Java偏稳固，静态

在注册能力上，后端选择在服务启动时一次性初始化所有插件/中间件， 我们选择保留前端业务灵活、语言动态的特点

因此我们有两个允许：

  1. 允许用户在发起请求时，携带该次请求所需要的临时中间件
  2. 允许中间件内部依赖按需加载

例如：

  1. 可以在需要进行风控验证的接口请求时携带风控验证中间件
  2. 风控验证中间件所依赖的验证SDK可以先不进行初始化，实际触发时再去加载执行

除了以上，我们也要遵守几个原则：

  1. 对一个模块下的公共能力尽量进行最大范围的全局初始化
  2. 每个实例要有明显的使用划分，避免混用，有条件的全局使用一个实例（也取决于前端应用的场景，请灵活决策）

模型图 ​

HTTP Service 的洋葱模型 ​

洋葱模型

KOA 的洋葱模型 ​

洋葱模型

- diff --git a/intro/middleware.html b/intro/middleware.html index 8a61a8a..e5d4b50 100644 --- a/intro/middleware.html +++ b/intro/middleware.html @@ -57,7 +57,7 @@ ctx.request.params.newKey = 'test' await next() }

附内置中间件参考：内置中间件

- diff --git a/intro/what-is.html b/intro/what-is.html index bdd97a0..c148cd3 100644 --- a/intro/what-is.html +++ b/intro/what-is.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

On this page

HTTP Service 是什么 概念介绍 ​

HTTP Service（HTTP服务），是一个可以用于Web前端 CSR（客户端渲染）以及 SSR（服务端渲染）场景下统一的HTTP Request SDK，我们通常称其为请求库或者统一请求库。

其设计模式主要借鉴于服务端框架的 middleware 模式，如koa，在发起请求部分，我们保留了 Axios 用户发起请求的习惯。

在发起请求的部分，我们遵循 WHATWG Fetch 规范，使用 Fetch API 作为发起请求中间件的内核，于是在现代浏览器中，你可以在不使用任何 polyfill 的情况下使用 HTTP Service。当然我们也为旧版浏览器提供了 polyfill 方案以及为NodeJS用户提供了服务端的使用方案。

通过使用 HTTP Service，你可以通过装配中间件的方式来优雅地组织逻辑发起HTTP请求。

想直接使用? 前往 开始上手.

能力对比 ​

  • XMLHttpRequest VS Fetch
特点XMLHttpRequestfetch API
语法使用回调函数处理异步请求基于 Promise，支持 async/await
流式传输不支持支持流式传输（例如可以逐步读取响应体）⭐️
监控请求进度支持⭐️不支持
错误处理只在网络故障或请求被阻止时抛出异常默认不会因 HTTP 错误状态而抛出异常
请求/响应格式支持文本和二进制数据支持多种格式，包括 JSON、文本、FormData、Blob 等⭐️
浏览器支持在所有主流浏览器中广泛支持在现代浏览器中支持，但不支持旧版浏览器
Service Worker不支持支持⭐️
中止请求通过 abort() 方法使用 AbortController
控制重定向不支持支持⭐️
信任策略默认发送带有凭据的请求（如 cookies）默认不包含凭据，但可以配置⭐️
活跃度停止维护不断迭代⭐️

相比XHR，我们为请求库提供了监控请求进度适配方案，详见 监控请求进度中间件

  • 多种SDK横向对比
PackageBundle SizeExtensibilityBrowser Compatibility
Axios☁️☁️☁️🔧🔧⭐️⭐️⭐️
Fetch+polyfill☁️+☁️☁️🔧⭐️⭐️+⭐️
HTTP Service☁️☁️+☁️🔧🔧🔧⭐️⭐️⭐️

体积方面：

  • Axios 31KB | 11KB(gzipped)
  • Fetch 0K(Modern Browser or NodeJS v18+) | Polyfill 8.8K | 3K(gzipped)
  • HTTP Service 22KB | 13KB(gzipped) | 20K(With Fetch Polyfill) ✅

Tips：上为请求服务最基本的package size，不含各项扩展能力

拓展性方面：

  • Axios 提供了 Interceptors（拦截器）作为主要干预请求前后的能力
  • Fetch 是一个底层库，主要作为基础请求能力来进行封装
  • HTTP Service 基于链式调用中间件（类似插件形式），灵活，拓展性强 ✅

浏览器兼容性方面：

  • Axios 已经稳定运行多年，兼容性良好
  • Fetch 在较老的浏览器上没有支持，因此业务引入的时候需要考虑polyfill
  • HTTP Service 基于Fetch协议，面向未来，同时可以根据项目运行环境按需引入polyfill，从而使兼容性无需担忧 ✅

致谢 ​

感谢以下项目，它们的设计和实现为HTTP Service的开发提供了宝贵的参考：

  • axios：承载了众多HTTP请求处理的优秀实践，在API层面，我们充分考虑到前端领域中 Axios 的影响，因此也保留了一些Axios用户的使用习惯。
  • koa：现代的Web框架，其中间件架构为我们的设计提供了灵感。
  • vitepress：本文档站点由 VitePress 驱动。
  • wonder：如果您阅读到了这里，非常感谢您的耐心，这里有一个精心准备的异想，希望能对您有所帮助。
- diff --git a/intro/wonder.html b/intro/wonder.html index 3f8c20a..6a1cce5 100644 --- a/intro/wonder.html +++ b/intro/wonder.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

On this page

Wonder ​

💡Fetch Done
Retry
InitCtx
ResData
Body
Timeout
- diff --git a/reference/interface-middleware-builtin.html b/reference/interface-middleware-builtin.html index 815b5b7..dd3eb2e 100644 --- a/reference/interface-middleware-builtin.html +++ b/reference/interface-middleware-builtin.html @@ -40,7 +40,7 @@ // 重试前的回调 onRetry?: IRetryCallback } - diff --git a/reference/interface-middleware-common.html b/reference/interface-middleware-common.html index 21854e0..d1712e3 100644 --- a/reference/interface-middleware-common.html +++ b/reference/interface-middleware-common.html @@ -15,7 +15,7 @@
HTTP Service

Appearance

On this page

公共中间件 ​

这些中间件大多源自业务中那些高度复用的逻辑而形成，如接口上报、服务端渲染、接口验签、风控等，您可以根据具体的业务、技术场景自由选择。

当然，您也可以根据自己的业务需求，开发自定义的中间件，具体开发方式和经典案例中的自定义fetch中间件 类似。

公共中间件和内置中间件无任何关联。

- diff --git a/reference/interface-service.html b/reference/interface-service.html index 54a29d9..a65d8ee 100644 --- a/reference/interface-service.html +++ b/reference/interface-service.html @@ -223,7 +223,7 @@ }) }) .request(cfg1) - diff --git a/reference/npm-server-fetch.html b/reference/npm-server-fetch.html index a6868d9..7e797aa 100644 --- a/reference/npm-server-fetch.html +++ b/reference/npm-server-fetch.html @@ -20,7 +20,7 @@ const httpSvc = new HttpService({ fetch: new HttpSvcServerFetch() }) - diff --git a/reference/npm-xhr.html b/reference/npm-xhr.html index be55f85..2de77fb 100644 --- a/reference/npm-xhr.html +++ b/reference/npm-xhr.html @@ -44,7 +44,7 @@ // 生命钩子，在xhr 创建完毕后 onCreated?: (xhr: XHRHttpRequest) => void } -