ホームページ > ウェブフロントエンド > uni-app > uniappでログアウトする方法について話しましょう

uniappでログアウトする方法について話しましょう

PHPz
リリース: 2023-04-14 15:43:47
オリジナル
2446 人が閲覧しました

UniApp は、iOS、Android、H5 などの複数のプラットフォーム用のアプリケーションを構築するために使用できるクロスプラットフォーム開発フレームワークです。開発者が UniApp を使用してアプリケーションを開発する場合、ログアウトが必要な状況が発生することがあります。この記事ではUniAppでログアウトする方法を紹介します。

  1. ローカル ストレージのクリア

ログアウトするときに、ユーザーがファイルを開いたときに元の状態に戻らないようにするために、ローカル ストレージをクリアするのが最も簡単な方法です。ログアウト後にアプリケーションを再度実行する 以前のログイン状態。ローカル ストレージをクリアするには、uni.removeStorageSync(key) メソッドを使用します。このうち、key は、クリアする必要があるローカルに保存されたキーの値を表します。

例:

uni.removeStorageSync('token');
ログイン後にコピー

これにより、ローカル ストレージ内の「token」という名前のキー値がクリアされます。

  1. バックグラウンド インターフェイスを呼び出す

ログアウトするときは、ローカル ストレージをクリアするだけでなく、バ​​ックグラウンド インターフェイスを呼び出して、バックグラウンド サーバーに現在のユーザーのデータをクリアさせることもできます。ログインステータス。バックグラウンド インターフェイスを呼び出すときは、サーバーが現在のユーザーを識別できるように、ユーザーのトークン値をサーバーに渡す必要があります。

例:

uni.request({
  url: 'http://localhost:3000/logout',
  method: 'POST',
  data: {
    token: uni.getStorageSync('token')
  },
  success: (res) => {
    // 请求成功,清除本地存储中的 token 值
    uni.removeStorageSync('token');
  }
});
ログイン後にコピー

このコードでは、uni.request メソッドを通じてリクエストがバックエンド サーバーに送信され、現在のユーザーのトークン値がサーバーに渡されます。リクエストが成功した場合は、ローカル ストレージのトークン値をクリアします。

  1. プラグインの使用

ローカル ストレージを手動でクリアしてバックエンド インターフェイスを呼び出すことに加えて、UniApp はログアウト機能を実装するための特殊なプラグインも提供します。たとえば、uni-simple-router プラグインです。

このプラグインを通じて、次のことを実現できます:

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;
ログイン後にコピー

このコードでは、uni-simple-router プラグインを使用してログアウトします。具体的な方法は、トークン値をクリアすることです。指定したページにジャンプして、再度ログインしてください。

まとめ

上記 3 つの方法はいずれも UniApp でのログアウト機能を実現できます。プラグインを使用することは比較的簡単ですが、実現するにはプラグインのダウンロードと設定が必要です; ローカル ストレージのクリアとバックグラウンドの呼び出し このインターフェイスは手動処理を必要とし、一般的な小規模アプリケーションに適しています。どちらの方法を使用する場合でも、ログアウト後に再度アプリを開いたときに以前のログイン状態に戻らないように、ログイン状態をクリアする必要があります。

以上がuniappでログアウトする方法について話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート