Detaillierte Erläuterung der Konfigurationsmethode des Vue-Anforderungs-Interceptors

 // HTTP-Anforderungs-Interceptor, wenn ein Token-Wert vorhanden ist, konfigurieren Sie den Token-Wert. Importieren Sie Axios von „Axios“.
Promise von 'promise' importieren
importiere util aus „./utils“;
Store aus „./../store/index“ importieren;
const service = axios.create({
    Timeout: 60000, // Anforderungs-Timeout-Header: {
        // Autorisierung: Autorisierung,
        „Inhaltstyp“: „Anwendung/json;Zeichensatz=UTF-8“
    }
});
// HTTP-Anforderungs-Interceptor service.interceptors.request.use(
    Konfiguration => {
        Verwenden Sie stattdessen tokenExist.
        wenn (TokenExist) {
            // bus.$emit('toggleloading', true) //Anzeige wird geladen
            //Wenn das Token vorhanden ist, config.headers['Authorization'] = `Bearer ${util.getToken()}`;
        }
        // Toast.laden({
        // Nachricht: „Wird geladen …“,
        // Dauer: 0,
        // forbidClick: true
        // });
        Konfiguration zurückgeben;
    },
    Fehler => {
        Versprechen.Ablehnen(Fehler);
    }
)
// HTTP-Antwortserver-Antwort-Interceptor,
//Fangen Sie hier 401-Fehler ab und springen Sie zurück zur Anmeldeseite, um das Token erneut abzurufen.
Dienst.Interceptors.Antwort.Verwendung(
    Antwort => {
        wenn (Antwort.Status === 200) {
            //Kommunikation erfolgreich// Toast.clear();
            /****************
             * response.data.status === 0 Fehler* response.data.status === 100 Erfolg* response.data.status === 401 Token abgelaufen*
             * *************/
            // bus.$emit('toggleloading', false) // Laden ausblenden
            wenn (Antwort.Daten.Status === 401) {
                //Wenn das Token abgelaufen ist, springe zum Login. Message.error("Login ist abgelaufen, bitte erneut anmelden!");
                store.commit('SET_TOKEN', '');
                util.goLogin();
            } sonst wenn (Antwort.Daten.Zustand === 0) {
                // Nachricht.Fehler(Antwort.Daten.Nachricht);
                Antwortdaten zurückgeben;
            } anders {
                Antwortdaten zurückgeben;
            }
        }
    },
    Fehler => {
        //Anfrage fehlgeschlagen//;
        const Antwort = Fehler.Antwort;
        wenn (Antwort.Status === 401) {
            // Toast.fail(Antwort.Daten.Nachricht);
            Message.error("Login ist abgelaufen, bitte erneut anmelden!");
            util.goLogin();
        } sonst wenn (Antwort.status === 403) {
            $router.push({
                Name: '403'
            });
        } anders {
            // Toast.fail(response.data.message ? response.data.message : 'Systemfehler, bitte kontaktieren Sie den Administrator');
            // Nachricht.Fehler({
            //Meldung: „Kein Dienst, bitte kontaktieren Sie den Administrator“
            // });
        }
        returniere Promise.reject(Fehler);
    }
);
Standarddienst exportieren;

 Anfrage aus „./request“ importieren;
// Store aus „./../store/index“ importieren;
const http = {
    Anfrage(Konfiguration) {
        Anfrage(Konfiguration);
    },
    post(URL, Daten) {
        // wenn (Dateninstanz des Objekts) {
        // }anders{
        // Daten = {
        // ...Daten
        // };
        // }
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'post',
            Daten
        });
    },
    postFile(url, daten, inhaltstyp) {
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'post',
            Daten,
            Inhaltstyp
        });
    },
    get(url, params) {
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'get',
            Parameter
        });
    },
    setze(URL, Daten) {
        Rückgabeanforderung({
            URL (URL = URL ...
            Methode: 'put',
            Daten
        });
    },
    löschen(URL) {
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'löschen'
        });
    },
    herunterladen(URL, Parameter) {
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'get',
            Parameter,
            Antworttyp: „Blob“
        });
    },
    downloadPost(url, daten) {
        Rückgabeanforderung({
            URL (URL = URL = URL),
            Methode: 'post',
            Daten,
            Antworttyp: „Blob“
        });
    }
};
Standard-HTTP exportieren;

 Store aus „../store/index“ importieren;
lass util = {
    //Token abrufen
    getToken() {
        gibt store.getters.token zurück;
    },
    //Beurteilen, ob das Token existiert tokenExist() {
        lass Flagge;
        sei Token = store.getters.token;
        wenn (Token && Token !== '') {
            Flagge = wahr;
        } anders {
            Flagge = falsch;
        }
        Token zurückgeben;
    },
}
Standard-Dienstprogramm exportieren 

 Vue von „vue“ importieren
Vuex von „vuex“ importieren
importiere VuexPersistence von „vuex-persist“;
importiere db aus './db'
Vue.Verwenden(Vuex)
//Vuex-Statuspersistenz const vuexLocal = new VuexPersistence({
    Speicher:window.localStorage
})
const store = neuer Vuex.Store({
    Zustand:{},
    Mutationen:{},
    Aktionen:{},
    Module: {
        db
    },
    Plugins: [vuexLocal.plugin]
})
Standardspeicher exportieren

 Konstante db = {
    Zustand: {
        Token: '',
    },
    Getter: {
        token:status => status.token
    },
    Mutationen:
        //Token speichern
        setToken: (Status, Wert) => {
            Status.Token = Wert
        }
    },
    Aktionen: {}
}
Standard-DB exportieren

 importiere http von "../common/http"
/***********Anmelden und registrieren*************/
//Schnittstellenfunktion testen text(params){
    gibt http.get("api/Test/GetList", Parameter) zurück
}
//Anmelden Funktion Login(params) {
    gibt http.post("api/Login/Login", Parameter) zurück
}
// Hol dir den grafischen Verifizierungscode function GetValidateCode(params) {
    gibt http.post zurück("api/Login/GetValidateCode", Parameter)
}
// Holen Sie sich den Telefonbestätigungscode. Hinweis: Sie müssen die Mensch-Maschine-Verifizierung im Voraus überprüfen, sonst besteht die Gefahr, dass Sie böswillig per SMS gestohlen werden. Funktion GetPhoneCode (Params) {
    gibt http.post("api/Login/GetPhoneCode", Parameter) zurück
}
//Informationen zur Registrierungsüberprüfung Funktion RegisterUserVerify(params) {
    return http.post("api/Login/RegisterUserVerify", Parameter)
}
// Registrieren, Passwort festlegen und Benutzerinformationen registrieren Funktion RegisterUserInfo(params) {
    gibt http.post("api/Login/RegisterUserInfo", Parameter) zurück
}
// Kennwort vergessen - Bestätigungsname und Telefonnummer - Funktion ResetPasswordVerify(params) {
    return http.post("api/Login/ResetPasswordVerify", Parameter)
}
// Passwort vergessen Passwort-Update-Funktion ResetPassWord(params) {
    gibt http.post zurück("api/Login/ResetPassWord", Parameter)
}
exportieren {
    Login,
    Text,
    GetPhoneCode,
    RegisterUserVerify,
    GetValidateCode,
    Passwort zurücksetzenVerify,
    Passwort zurücksetzen,
    RegisterUserInfo
}