Heim >Web-Frontend >js-Tutorial >vue+axios verbietet die Anmeldung

vue+axios verbietet die Anmeldung

php中世界最好的语言
php中世界最好的语言Original
2018-06-12 09:52:351341Durchsuche

Dieses Mal werde ich Ihnen die Vorsichtsmaßnahmen zum Deaktivieren der Anmeldung in vue+axios vorstellen. Das Folgende ist ein praktischer Fall, schauen wir uns das an.

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 eine neue axios.js wie folgt

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 axios

und fügen 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 Der Aufruf von

this.$axios({ 
    url:requestUrl+'homePage/v1/indexNewPropertiesResult', 
    method:'POST', 
   }).then(function(response){ //接口返回数据 
    console.log(response) 
    that.modulesArr=response.data.data.modules; 
//   that.getRecommendGoods(0); 
   });

kann nur über die Axios-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-Anfrage-Interceptor

// 添加请求拦截器
axios.interceptors.request.use(function (config) {
  // 在发送请求之前做些什么
  return config;
 }, function (error) {
  // 对请求错误做些什么
  return Promise.reject(error);
 });

•http-Antwort-Interceptor

// 添加响应拦截器
axios.interceptors.response.use(function (response) {
  // 对响应数据做点什么
  return response;
 }, function (error) {
  // 对响应错误做点什么
  return Promise.reject(error);
 });

•Interceptor entfernen

var myInterceptor = axios.interceptors.request.use(function () {/*...*/});
axios.interceptors.request.eject(myInterceptor);

•Interceptor für benutzerdefinierte Axios-Instanz hinzufügen

var instance = axios.create();
instance.interceptors.request.use(function () {/*...*/});
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Dinge finden Sie hier php Chinesisch Weitere verwandte Artikel online!

Empfohlene Lektüre:

JS filtert Chinesisch und Englisch heraus und zählt Zeichen


Verwendung der FileReader-API

Das obige ist der detaillierte Inhalt vonvue+axios verbietet die Anmeldung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn