- ?重要全局配置：
- axios.create();? 設置axios請求的公共配置信息。
-
service.interceptors.request.use((config)=>{})? ? 請求攔截器
-
service.interceptors.response.use((res)=>{},(err)=>{})? ?響應攔截器
-
const source = axios.CancelToken.source();? ? 用來取消接口請求的。
import axios, { CancelToken } from 'axios';
const usbIP = 'http://192.168.42.1:8080';// 創建默認請求配置數據；
// 每次service() 請求接口時，都會使用默認設置的參數內容。
const service = axios.create({ baseURL: usbIP, // 設置 url 默認前綴timeout: 1000 * 30, // 設置全局超時時長
});// const source = axios.CancelToken.source();
// 用來取消接口的，發送請求時傳入 { cancelToken: source?.token }。
// 然后調用 source.cancel(''); 即可取消接口請求，('')括號內的就是取消[rejct]的信息內容。// 設置接口請求攔截器：每個接口發送請求前，都會從這走一遍。
service.interceptors.request.use((config) => {return config
})// 設置接口響應攔截器：每個接口返回數據時，都會先經過攔截器走一遍。
service.interceptors.response.use((res) => {// ...return Promise.resolve(res.data);},(error) => {return Promise.reject(error);},
);export interface HTTPConfig {url: string;method: 'get' | 'post' | 'delete' | 'head' | 'options' | 'put' | 'patch';data?: object;params?: object;headers?: object;responseType?: any;responseEncoding?: string;baseURL?: string;timeout?: number;cancelToken?: CancelToken;
}type HTTP = <T>(config: HTTPConfig) => Promise<T>;
const useHttp: HTTP = (config) => {return service(config);
};export default useHttp;
調用請求案例：
import http from '@cut/http/request';getDeviceInfo(ip: string, source?: CancelTokenSource, timeout = 1000 * 5) {return http<DeviceInfo>({url: ip + '/device/info',method: 'get',timeout,cancelToken: source?.token,});},
)
