项目简介
该项目是基于 TypeScript 实现的 Axios 库,对 Axios 的核心功能进行扩展,为用户提供更灵活、强大的 HTTP 请求功能,方便开发者发送和管理 HTTP 请求。
项目的主要特性和功能
- TypeScript 支持:借助 TypeScript 实现,具备更好的类型检查和自动补全功能。
- 请求方法扩展:支持
get
、post
、put
、delete
等多种 HTTP 请求方法,提供语法糖简化请求配置。 - 拦截器功能:支持请求和响应拦截器,可在请求发送前或响应返回前执行自定义逻辑。
- 跨域请求支持:支持
withCredentials
配置,保证跨域请求时携带 cookie。 - XSRF 防御:自动从 cookie 读取 XSRF token 并添加到请求头,防止跨站请求伪造攻击。
安装使用步骤
安装
通过 npm 或 yarn 安装:
bash
npm install ts-axios --save
或
bash
yarn add ts-axios
使用
在项目中引入并使用: ```typescript import axios from 'ts-axios';
// 发送 GET 请求 axios.get('/api/data').then(response => { console.log(response.data); });
// 发送 POST 请求 axios.post('/api/data', { name: 'John' }).then(response => { console.log(response.data); }); ```
配置请求参数
通过配置对象设置请求头、请求参数等:
typescript
axios.get('/api/data', {
params: { id: 123 },
headers: { 'Authorization': 'Bearer token' }
}).then(response => {
console.log(response.data);
});
使用拦截器
使用拦截器在请求发送前或响应返回前执行自定义逻辑: ```typescript // 请求拦截器 axios.interceptors.request.use(config => { // 在发送请求前做些什么 return config; }, error => { // 对请求错误做些什么 return Promise.reject(error); });
// 响应拦截器 axios.interceptors.response.use(response => { // 对响应数据做些什么 return response; }, error => { // 对响应错误做些什么 return Promise.reject(error); }); ```
跨域请求与 XSRF 防御
通过配置 withCredentials
和 xsrfCookieName
、xsrfHeaderName
启用相关功能:
```typescript
// 配置 withCredentials
axios.get('/api/data', {
withCredentials: true
}).then(response => {
console.log(response.data);
});
// 配置 XSRF 防御 const instance = axios.create({ xsrfCookieName: 'XSRF-TOKEN', xsrfHeaderName: 'X-XSRF-TOKEN' });
instance.get('/api/data').then(response => { console.log(response.data); }); ```
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】