Dieses Mal werde ich Ihnen vue+axios zum Abfangen von Anmeldeanfragen vorstellen. Was sind die Vorsichtsmaßnahmen für vue+axios zum Abfangen von Anmeldeanfragen?
Wenn wir Schnittstellenanforderungen stellen, z. B. bei der Beurteilung des Anmeldezeitlimits, gibt die Schnittstelle normalerweise einen bestimmten Fehlercode zurück. Wenn wir dann für jede Schnittstelle eine zeit- und arbeitsaufwändige Schnittstelle beurteilen, können wir verwenden Der Interceptor führt ein einheitliches Abfangen von HTTP-Anfragen durch.
1. Axios installieren und konfigurieren
cnpm install --save axios
Wir können eine JS-Datei erstellen, um diese einheitliche Verarbeitung durchzuführen Erstellen Sie wie folgt eine neue axios.js
import axios from 'axios'
import { Indicator } from 'mint-ui';
import { Toast } from 'mint-ui';
// http request 拦截器
axios.interceptors.request.use(
config => {
Indicator.open()
return config;
},
err => {
Indicator.close()
return Promise.reject(err);
});
// http response 拦截器
axios.interceptors.response.use(
response => {
Indicator.close()
return response;
},
error => {
Indicator.close()
});
export default axiosund führen Sie dann diese js-Datei
import axios from './axio'; Vue.prototype.$axios = axios;
in main.js ein, damit Sie axios zum Anfordern verwenden können, und Sie können this.axios verwenden in der Komponente. Der Aufruf von
rrreekann nur über die axios.js-Anforderungsschnittstelle abgefangen werden. Sie können die von Ihnen benötigten Vorgänge in den beiden Zuständen ausführen
Ergänzung:
Axios verwendet Interceptoren, um alle http-Anfragen einheitlich zu verarbeiten
Axios verwendet Interceptoren Anfragen oder Antworten abfangen, bevor sie bis dahin verarbeitet oder abgefangen werden.
•http-Request-Interceptorthis.$axios({
url:requestUrl+'homePage/v1/indexNewPropertiesResult',
method:'POST',
}).then(function(response){ //接口返回数据
console.log(response)
that.modulesArr=response.data.data.modules;
// that.getRecommendGoods(0);
});
// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
});
// 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});
var myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);
Empfohlene Lektüre:
Detaillierte Erläuterung der Verwendung von dev zu prdDetaillierte Erläuterung der Schritte zur Verwendung von dev -Server im WebpackDas obige ist der detaillierte Inhalt vonvue+axios fängt Anmeldeanfragen ab. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
