简体繁体 English

Auth0登录，添加本地存储管理用户访问

[英]Auth0 login, adding local storage to manage user access

原文 2020-11-02 18:33:48 7 1 node.js/ reactjs/ local-storage/ auth0/ mern

I am constructing a demo app using the MERN Stack.我正在使用 MERN Stack 构建一个演示应用程序。 I currently use auth0 to login through react, and I want to give my user special access to certain parts of the app they couldn't have prior to logging in. My question is about the correct architectural design.我目前使用 auth0 通过 react 登录，我想让我的用户在登录之前对应用程序的某些部分具有特殊访问权限。我的问题是关于正确的架构设计。 From what I have read, after logging in through Auth0, I should initialize some sort of session management variable in local storage, and check for this variable across my app to restrict or enable users to certain aspects of the app.从我读到的内容来看，通过 Auth0 登录后，我应该在本地存储中初始化某种会话管理变量，并在我的应用程序中检查此变量以限制或允许用户访问应用程序的某些方面。 Does this sound like the correct design or am I misinterpreting what I am reading, and if possible, feel free to add any other suggestions on how to advance my user management/session through a MERN stack app with Auth0 authentication, thanks in advance!这听起来像正确的设计还是我误解了我正在阅读的内容，如果可能，请随时添加有关如何通过具有 Auth0 身份验证的 MERN 堆栈应用程序推进我的用户管理/会话的任何其他建议，提前致谢！

1 个解决方案

The thing you are looking for is saving the users JWT (JSON web token) inside the local storage after logging in.您正在寻找的是在登录后将用户 JWT（JSON Web 令牌）保存在本地存储中。

If the user now sends a request to the backend API he will be authenticated with this token.如果用户现在向后端 API 发送请求，他将使用此令牌进行身份验证。

If the backend returns a 401 error, your frontend wont allow him to continue using the restricted parts of your application.如果后端返回 401 错误，您的前端将不允许他继续使用应用程序的受限部分。

This can be realized using React Router Private Routes ( good example here) .这可以使用 React Router Private Routes 来实现（这里是一个很好的例子）。 Hope this will help you designing your auth flow.希望这将帮助您设计您的身份验证流程。