Vue는 타사 요청을 구현합니다. 1. "'axios'에서 axios 가져오기;"를 통해 axios를 가져옵니다. 2. 프로토타입 체인에 axios를 배치합니다. 3. "axios.interceptors.request"와 같은 코드로 요청 인터셉터를 추가합니다. use(config => {...}".
이 튜토리얼의 운영 환경: Windows 10 시스템, vue3 버전, DELL G3 컴퓨터
vue는 타사 요청을 어떻게 구현합니까?
in vue --axios
import axios from 'axios'; Vue.prototype.axios = axios;
axios.request(config)
axios.request(config)
axios.get(url[, config])
axios.delete(url[, config])
axios.head(url[, config])
axios.options(url[, config])
axios.post(url[, data[, config]])
axios.put(url[, data[, config]])
axios.patch(url[, data[, config]])
axios.get(url[, config])
axios.delete(url[, config])
🎜🎜axios .options(url[, config])
🎜🎜🎜🎜axios.post(url[, data[, config]] )
🎜🎜🎜🎜axios.put(url [, data[, config]])
🎜🎜🎜🎜axios.patch(url[, data[, config]] )
🎜🎜🎜🎜6 Interceptor🎜// 添加请求拦截器 axios.interceptors.request.use(config => { // 在发送请求之前做些什么 return config; }, error => { // 对请求错误做些什么 return Promise.reject(error); }); // 添加响应拦截器 axios.interceptors.response.use(response => { // 对响应数据做点什么 return response; }, error => { // 对响应错误做点什么 return Promise.reject(error); });
axios.interceptors.request.use(config => { // 在发送请求之前做些什么 let token = sessionStorage.getItem('userTk'); if (token) { config.headers.Authorization = token } return config }, error => { // 对请求错误做些什么 return Promise.reject(error); });
axios.interceptors.response.use(response => { if (response.data.code === '200') { Auth.setToken(sessionStorage.getItem('userId')) } return response; }, error => { console.warn(error); console.warn(error.response); if ((error.response.status && error.response.status === 401) || error.response.statusCode === 401) { // 已超时 Auth.removeToken(sessionStorage.getItem('userId')); sessionStorage.clear(); router.replace('/login') return Promise.reject('身份已过期,请重新登录!'); } if(error.response && error.response.status === 500) return Promise.reject('服务异常,请稍后重试!'); });
위 내용은 Vue에서 타사 요청을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!