localStorageを使用したReact認証

Question

Reactアプリケーションの基本的なログイン/サインアップ機能を構築する方法を理解しようとしています。だから私は、ログインしているかどうかを確認するなどの作業を行うHoC /親クラスを作成することを検討しています。 これで、ユーザーがログインしているかどうかを保存する最良の方法を見つけました。私が見たものは、localStorageを使用しています。しかし、誰かが実際にアクセスできるので、isLoggedInなどのフラグを保存できますか？ username.passwordなどのトークンを暗号化してから、すべてのページを読み込んでDBにコールする必要がありますか？それは少しそうです。または、何か勘違いしたことがありますか？

Answer 1

JSON Webトークン（JWT）を使用できます。

ユーザがログインすると、バックエンドのsay/loginを呼び出して、データベースに対してパスワードを確認します。成功した場合は、ユーザー名とそのロールを含むJWTを発行します（たとえば、ではなく、パスワードはです）。

トークンの暗号化署名をJavascriptで直接確認してログインしていることをユーザーに知らせることができます（ユーザー名などの読み取り可能なコンテンツが変更された場合、署名はこれ以上一致しません） 。この方法では、トークンが期限切れになるまでデータベースに問い合わせる必要はありません。

私が見たところでは、localStorageを使用しています。しかしそれは本当に誰でもアクセスすることができます

番号もあります。同じドメインからしかアクセスできないクッキーにはadvantageもあります。原則としてはです。あなたのトークンが盗まれる方法です（例えば、XSS attacks、またはあなたが離れている場合はノートパソコンの開発ツールからコピーします）。しかし、それに追加する有効期限はほんの数時間有効です。