# web-api-kit

**Repository Path**: DcdSyc/web-api-kit

## Basic Information

- **Project Name**: web-api-kit
- **Description**: 基于 axios 封装的可扩展 HTTP 请求工具类
- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-06-29
- **Last Updated**: 2025-12-08

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# web-api-kit

基于 Axios 的可扩展 HTTP 请求工具类，提供类型安全支持和拦截器功能，简化前端和后端的网络请求操作。

## 特性

- 基于 Axios 二次封装，提供强大的 HTTP 请求能力
- 支持 TypeScript 类型提示，提升开发体验
- 可配置的请求/响应拦截器，实现灵活的请求处理逻辑
- 支持 GET、POST、PUT、DELETE 和 PATCH 请求方法
- 高度可配置的请求参数设置

## 安装

```bash
npm install web-api-kit
```

## 快速开始

### 创建实例

```typescript
import WebApiKit from 'web-api-kit';

// 创建带默认配置的实例
const http = new WebApiKit({
  axiosConfig: {
    baseURL: 'https://api.example.com',
    timeout: 10000,
  },
  interceptorConfig: {
    reqHandler: (config) => {
      // 添加请求拦截逻辑
      console.log('Request:', config.url);
      return config;
    },
    resHandler: (response) => {
      // 添加响应拦截逻辑
      console.log('Response:', response.status);
      return response;
    }
  }
});
```

### 发送 GET 请求

```typescript
// 发送 GET 请求
http.get('/users')
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// 带参数的 GET 请求
http.get('/search', { q: 'test' })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));
```

### 发送 POST 请求

```typescript
// 发送 POST 请求
http.post('/login', { username: 'user1', password: 'pass123' })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// 带参数和自定义配置的 POST 请求
http.post(
  '/upload', 
  formData,
  { params: { id: 123 } },
  { headers: { 'Content-Type': 'multipart/form-data' } }
)
  .then((data) => console.log(data))
  .catch((error) => console.error(error));
```

### 发送 PUT 请求

```typescript
// 发送 PUT 请求
http.put('/update', { id: 1, name: 'updatedName' })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// 带参数的 PUT 请求
http.put(
  '/update', 
  { id: 1, name: 'updatedName' },
  { params: { userId: 123 } }
)
  .then((data) => console.log(data))
  .catch((error) => console.error(error));
```

### 发送 DELETE 请求

```typescript
// 发送 DELETE 请求
http.delete('/delete', { id: 1 })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// 带查询参数的 DELETE 请求
http.delete('/delete', { params: { id: 123 } })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));
```

### 发送 PATCH 请求

```typescript
// 发送 PATCH 请求
http.patch('/partial-update', { id: 1, name: 'patchedName' })
  .then((data) => console.log(data))
  .catch((error) => console.error(error));

// 带参数的 PATCH 请求
http.patch(
  '/partial-update', 
  { id: 1, name: 'patchedName' },
  { params: { userId: 123 } }
)
  .then((data) => console.log(data))
  .catch((error) => console.error(error));
```

## API 文档

### `new WebApiKit(initialConfig?)`

创建一个新的 WebApiKit 实例。

#### 参数

- `initialConfig` (可选): 初始配置对象，包含以下属性：
  - `axiosConfig`: Axios 请求配置
  - `interceptorConfig`: 拦截器配置

### `get<T>(url: string, params?: Record<string, any>, config?: Omit<AxiosRequestConfig, "params">): Promise<T>`

发送 GET 请求。

#### 参数

- `url`: 请求地址
- `params`: 请求查询参数
- `config`: 请求配置（不包括 params）

### `post<T>(url: string, data?: any, params?: Record<string, any>, config?: Omit<AxiosRequestConfig, "params">): Promise<T>`

发送 POST 请求。

#### 参数

- `url`: 请求地址
- `data`: 请求体数据
- `params`: 请求查询参数
- `config`: 请求配置（不包括 params）

### `put<T>(url: string, data?: any, params?: Record<string, any>, config?: Omit<AxiosRequestConfig, "params">): Promise<T>`

发送 PUT 请求。

#### 参数

- `url`: 请求地址
- `data`: 请求体数据
- `params`: 请求查询参数
- `config`: 请求配置（不包括 params）

### `delete<T>(url: string, params?: Record<string, any>, config?: Omit<AxiosRequestConfig, "params">): Promise<T>`

发送 DELETE 请求。

#### 参数

- `url`: 请求地址
- `params`: 请求查询参数
- `config`: 请求配置（不包括 params）

### `patch<T>(url: string, data?: any, params?: Record<string, any>, config?: Omit<AxiosRequestConfig, "params">): Promise<T>`

发送 PATCH 请求。

#### 参数

- `url`: 请求地址
- `data`: 请求体数据
- `params`: 请求查询参数
- `config`: 请求配置（不包括 params）

## 拦截器配置

### `InterceptorsConfig`

定义拦截器配置接口。

#### 属性

- `reqHandler`: 请求成功拦截器
- `reqErrHandler`: 请求错误拦截器
- `resHandler`: 响应成功拦截器
- `resErrHandler`: 响应错误拦截器

## 开发环境搭建

```bash
# 克隆项目
git clone https://gitee.com/DcdSyc/web-api-kit.git

# 进入项目目录
cd web-api-kit

# 安装依赖
npm install

# 开始开发
npm run dev
```

## 构建

```bash
npm run build
```

## 许可证

MIT License