网站怎么做框架集,建设企业网站用动态还是静态,设置网站建设方案,长安网站建设好吗文章目录 1、常用的默认配置的是#xff1a;baseURL、method、timeout2、axios配置多个服务器url3、配置api文件4、文件中使用 1、常用的默认配置的是#xff1a;baseURL、method、timeout
① baseURL#xff1a;设置url的基本结构#xff08;请求根地址#xff09;… 文章目录 1、常用的默认配置的是baseURL、method、timeout2、axios配置多个服务器url3、配置api文件4、文件中使用 1、常用的默认配置的是baseURL、method、timeout
① baseURL设置url的基本结构请求根地址域名和协议再结合属性url某个请求路径axios会自动将baseURL 和 url 进行拼接从而得出正确的请求路径。
② method请求方式 get/post
③ timeout延时时间超过多少时间就取消请求【单位是毫秒】
2、axios配置多个服务器url
// 请求时的基础配置VITE_APP_BASE_URL
export const URLMap {base: import.meta.env.MODE development? import.meta.env.VITE_APP_BASE_URL: (window as any).config.VITE_APP_BASE_URL,pdf:import.meta.env.MODE development? import.meta.env.VITE_APP_BASE_URL_PDF: (window as any).config.VITE_APP_BASE_URL_PDF,
}const REQUESTS : Recordstring, AxiosInstance {}declare module axios {interface AxiosResponseT any {errorinfo: nulldoc: anytime: anyx: anyy: any}export function create(config?: AxiosRequestConfig): AxiosInstance
}Object.keys(URLMap).forEach((item) {const REQUEST: AxiosInstance axios.create({baseURL: URLMap[item],headers: {Content-Type: application/json;charsetUTF-8,},timeout: 300000,withCredentials: item data,})REQUESTS[item] REQUEST
})// 请求拦截器
Object.keys(REQUESTS).forEach((item) {REQUESTS[item].interceptors.request.use(async (config: AxiosRequestConfig) {const headerToken await getToken()config.headers config.headers || {}if (headerToken)config.headers.Authorization headerTokenif (config.headers.type form) {delete config.headers.typeconfig.data qs.stringify(config.data)config.headers[Content-Type] application/x-www-form-urlencoded}return config})
})// 响应拦截器
Object.keys(REQUESTS).forEach((item) {REQUESTS[item].interceptors.response.use(async (response: AxiosResponse) {const { status, data {}, statusText } responseconst errorText serverCodeMessage[status] || statusTextconst error if (status)return Promise.resolve(data)message.error(error)return Promise.reject(error)},(error) {message.error(String(new Error(error)))return Promise.reject(new Error(error))},)
})export default REQUESTS
3、配置api文件
import requests from /service/indexexport const getAll (data: paramsInter) requests.base({url: xx/xx,method: POST,data,
})
export const get (data: paramsInter) requests.pdf({url: xx/xx,method: POST,data,
})这样不同的接口实现从不同的服务器获取资源
4、文件中使用
import { getAll} from /service/xx/index
onMounted(() {getXX()
})function getXX() {getAll(params).then((res) {// xxx
}
