Analyse von 2 Token-Gründen und Beispielcode in der Webprojektentwicklung

Vue von „vue“ importieren
Axios von „Axios“ importieren
Importieren Sie VueAxios von „vue-axios“.
importiere { getToken, setToken } aus './token'
Router aus „../router/index.js“ importieren
importiere { Toast } von 'vant'
Vue.use(VueAxios, axios)
const Instanz = axios.create({
  baseURL: 'Basis-URL',
  Zeitüberschreitung: 100000
})
// Anforderungs-Interceptor hinzufügen instance.interceptors.request.use(
  Funktion (Konfiguration) {
    //Token einheitlich hinzufügen
    getToken() && (config.headers['Authorization']= `Träger ${getToken().token}`)
    Konfiguration zurückgeben
  },
  Funktion (Fehler) {
    returniere Promise.reject(Fehler)
  }
)
//Antwort-Interceptor hinzufügen/**
 * 1.wenn 401, sonst ist es egal* 2.wenn ein Token vorhanden ist, sonst zur Anmeldeseite springen* 3.try-catch verwende refresh_token, um das Token abzurufen, wenn erfolgreich, sonst ist refresh_token ungültig, zur Anmeldeseite springen* 4.Speichern Sie das erhaltene Token, aktualisieren Sie es und fahren Sie mit der Ausführung der vom Benutzer gewünschten Operation fort*/
Instanz.Interceptors.Antwort.Verwenden(
  Funktion (Antwort) {
    Antwort zurückgeben
  },
  asynchrone Funktion (Fehler) {
    if (401 === Fehler.Antwort.Status) {
      setTimeout('Konsole.löschen()', 2000)
      wenn (getToken()) {
        versuchen {
          // Angemeldet, aber das kurze T ist abgelaufen. Verwenden Sie das lange T, um das kurze T abzurufen (Benutzertoken aktualisieren).
          lass res = warte auf axios({
            URL: 'Basisadresse/v1_0/Autorisierungen',
            Methode: 'PUT',
            Header: {Autorisierung: `Träger ${getToken().refresh_token}`}
          })
          // Kurzes T aktualisieren
          let token = getToken()
          token.token = res.daten.daten.token
          setzeToken(Token)
          // Benutzervorgang fortsetzen return instance(error.config)
        } Fehler abfangen {
          // Long T schlägt fehl, springe zur Anmeldeseite Toast.fail('Bitte zuerst anmelden')
          router.push({ Pfad: '/login' })
        }
      } anders {
        // Nicht angemeldet, springe zur Anmeldeseite Toast.fail('Bitte zuerst anmelden')
        router.push({ Pfad: '/login' })
      }
    }
    returniere Promise.reject(Fehler)
  }
)
Standardinstanz exportieren