Heim > Web-Frontend > uni-app > Hauptteil

Lassen Sie uns darüber sprechen, wie Sie sich in Uniapp abmelden

PHPz
Freigeben: 2023-04-14 15:43:47
Original
2417 Leute haben es durchsucht

UniApp ist ein plattformübergreifendes Entwicklungsframework, mit dem Anwendungen für mehrere Plattformen wie iOS, Android, H5 usw. erstellt werden können. Wenn Entwickler UniApp zum Entwickeln von Anwendungen verwenden, kann es vorkommen, dass sie sich abmelden müssen . In diesem Artikel erfahren Sie, wie Sie sich in UniApp abmelden.

  1. Lokalen Speicher löschen

Beim Abmelden ist es am einfachsten, den lokalen Speicher zu löschen, um zu verhindern, dass sich der Benutzer abmeldet Stellen Sie nach dem Abmelden den vorherigen Anmeldestatus wieder her, wenn Sie die App erneut öffnen. Um den lokalen Speicher zu löschen, verwenden Sie die Methode uni.removeStorageSync(key). Unter diesen stellt der Schlüssel den lokal gespeicherten Schlüsselwert dar, der gelöscht werden muss.

Zum Beispiel:

uni.removeStorageSync('token');
Nach dem Login kopieren

Dadurch wird der Schlüsselwert mit dem Namen „token“ im lokalen Speicher gelöscht.

  1. Rufen Sie die Hintergrundschnittstelle auf Der Hintergrundserver löscht den Anmeldestatus des aktuellen Benutzers. Beim Aufruf der Hintergrundschnittstelle muss der Tokenwert des Benutzers an den Server übergeben werden, damit dieser den aktuellen Benutzer identifizieren kann.
Zum Beispiel:

uni.request({
  url: 'http://localhost:3000/logout',
  method: 'POST',
  data: {
    token: uni.getStorageSync('token')
  },
  success: (res) => {
    // 请求成功,清除本地存储中的 token 值
    uni.removeStorageSync('token');
  }
});
Nach dem Login kopieren
In diesem Code wird eine Anfrage über die uni.request-Methode an den Backend-Server gesendet und der Tokenwert des aktuellen Benutzers wird an diesen übergeben Der Server. Wenn die Anfrage erfolgreich ist, löschen Sie den Tokenwert im lokalen Speicher.

Plug-Ins verwenden

  1. Neben dem manuellen Löschen des lokalen Speichers und dem Aufrufen der Hintergrundschnittstelle bietet UniApp auch ein spezielles Plug-In für Implementieren Sie die Abmeldefunktion. Zum Beispiel das Uni-Simple-Router-Plugin.
Mit diesem Plug-In können Sie Folgendes erreichen:

import {UniSimpleRouter} from 'uni-simple-router';
const router = new UniSimpleRouter({
  routes,
  login: {
    path: '/pages/login/login'
  },
  forbidNamed: ['index']
});

router.beforeEach((to, from, next) => {
  if (to.allowAnonymous === undefined) { // 不是通过 allowAnonymous 允许的匿名则判断登录状态
    const isLogin = uni.getStorageSync('isLogin');
    if (!isLogin) { // 如果未登录
      uni.removeStorageSync('token'); // 清除 token
      if (router.LOGIN_PAGE_NAME) { // 如果有指定的登录页面,则跳转到该页面
        router.push({name: router.LOGIN_PAGE_NAME});
      } else if (router.options.login) { // 如果有指定的全局登录页面,则跳转到该页面
        router.push({path: router.options.login.path});
      } else { // 否则跳转到默认登录页面
        router.push({name: 'login'});
      }
      next(false);
    } else { // 如果已登录,则继续执行
      next();
    }
  } else { // 如果是通过 allowAnonymous 允许的匿名,则直接执行
    next();
  }
});

export default router;
Nach dem Login kopieren
Verwenden Sie in diesem Code das Uni-Simple-Router-Plug-In, um sich abzumelden Löschen Sie den Tokenwert, springen Sie dann zur angegebenen Seite und melden Sie sich erneut an.

Zusammenfassung

Die oben genannten drei Methoden können die Funktion des Abmeldens in UniApp einfacher realisieren, erfordern jedoch das Herunterladen und Konfigurieren des Plug-Ins Um dies zu erreichen, erfordern das Löschen des lokalen Speichers und das Aufrufen der Hintergrundschnittstelle eine manuelle Verarbeitung, die für allgemeine kleine Anwendungen geeignet ist. Unabhängig von der verwendeten Methode muss der Anmeldestatus gelöscht werden, um zu verhindern, dass der Benutzer nach dem Abmelden beim erneuten Öffnen der App zum vorherigen Anmeldestatus zurückkehrt.

Das obige ist der detaillierte Inhalt vonLassen Sie uns darüber sprechen, wie Sie sich in Uniapp abmelden. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage