open-index/open-npm huggingface dataset:
npm package: @http-svc/middleware
Description: HTTP Service base middleware
Latest version: 1.0.1

# Http Service 基础中间件

## 使用方式

派生自定义组件

```js
import { HttpSvcMiddleware } from "@http-svc/middleware"

async function customHanlder(ctx, next) {
    ...
    return await next()
}

class HttpSvcCustomMiddleware extends HttpSvcMiddleware {
    name = 'CUSTOM_NAME'
    constructor() {
        super(customHanlder)
    }
}
// 全局注册(参考 http-svc的init文档)
const http = new HttpService([
    new HttpSvcCustomMiddleware(customHanlder)
])
```
npm package: @http-svc/server-fetch
Description: http service 中间件：服务端fetch
Latest version: 1.0.0-rc.1

# Http Service ServerFetch

## 使用方式

### 接入

```js
import { HttpSvcServerFetch } from "@http-svc/server-fetch"

// 全局注册
const httpSvc = new HttpService({
    fetch: new HttpSvcServerFetch()
})

// entry-server.js
httpSvc.setFetch(new HttpSvcServerFetch())
```
npm package: @http-svc/xhr
Description: 使用XHR来作为fetch中间件，可以使用xhr的事件监听
Latest version: 1.0.0-rc.1

# @http-svc/xhr

本中间件为替换HTTPService里的Fetch, 用于一些需要使用xhr监听的场景

## 使用方式

```js
import { HttpSvcXhr } from "@http-svc/xhr"

const xttpSvc = new HttpService({
    fetch: new HttpSvcXhr()
})

xttpSvc
    .with('XHR', {
        onCreated(xhr) {
            xhr.upload.addEventListener('progress', (e) => {
                console.log(`${Math.round((e.loaded * 100) / e.total)}%`)
            })
        }
    })
    .request({
        url: '/upload',
        data: ((f) => {
            const formData = new FormData()
            formData.append('file', f)
            return formData
        })(file)
    })
    .then(() => {
        ...
    })

```