前端的用户角色/权限 - React / GraphQL / Apollo Client
User Roles / Permissions on Frontend - React / GraphQL / Apollo Client
最近开始使用 React / Apollo Client / Auth0 / Hasura 并且对处理前端权限有一些疑问。我正在使用 Auth0 来处理我对用户是否登录的授权，并让我的后端设置在处理突变/查询时也进行检查。我现在的问题是如何在前端处理它。
用户可以创建一个团队，将信息存储在我的“团队”table 中，并在我的“team_staff”table 中创建一条记录，作为经理或教练。这一切都是直截了当的。我现在要做的是当用户访问时，例如：www.mysite.com/team/update/1 检查用户是否存在于“team_staff”table 中，如果不存在则向他们显示错误消息甚至重定向。还希望在查看团队时根据他们是否是工作人员隐藏某些按钮。
我是否应该在登录时处理此问题并查询用户所属的所有团队并将其存储在会话/cookie 中，或者每次调用时都在该组件内部进行查询/检查？还是我偏离了方向，应该换一种方式？
希望这个问题是有道理的。谢谢！
这个问题很有道理，相信很多开发者都会有类似的问题。
TLDR；
在 componentDidMount 中发出 API 请求以获得正确的权限（当然是在登录之后）。
对于这个问题，我们有很多解决方案，哪个是最好的，取决于你的基础设施，你的团队等等。基本上你需要调用 API 来检查权限，因为你的权限存储在后端。切勿在前端存储（如会话、cookie 等）上存储权限
我可以给一些方法。
首先，登录后立即调用API获取权限信息，例如：
- 获取允许的路由列表，然后，每当用户浏览到特定路由时，检查以确保该路由在允许的路由列表中。
- 获取允许的团队列表，如团队 ID 数组，然后在每条路线中获取团队 ID，检查该团队是否存在于上述列表中。
但我相信您会发现它们几乎相同，只是获取的数据和处理数据的方式不同。两种解决方案完全取决于您。
所有 API 请求 应放在页面组件的 componentDidMount 中，因为您将希望确保尽快正确应用权限因为后端有变化。
编码愉快！
最近开始使用 React / Apollo Client / Auth0 / Hasura 并且对处理前端权限有一些疑问。我正在使用 Auth0 来处理我对用户是否登录的授权，并让我的后端设置在处理突变/查询时也进行检查。我现在的问题是如何在前端处理它。
用户可以创建一个团队，将信息存储在我的“团队”table 中，并在我的“team_staff”table 中创建一条记录，作为经理或教练。这一切都是直截了当的。我现在要做的是当用户访问时，例如：www.mysite.com/team/update/1 检查用户是否存在于“team_staff”table 中，如果不存在则向他们显示错误消息甚至重定向。还希望在查看团队时根据他们是否是工作人员隐藏某些按钮。
我是否应该在登录时处理此问题并查询用户所属的所有团队并将其存储在会话/cookie 中，或者每次调用时都在该组件内部进行查询/检查？还是我偏离了方向，应该换一种方式？
希望这个问题是有道理的。谢谢！
这个问题很有道理，相信很多开发者都会有类似的问题。
TLDR；
在 componentDidMount 中发出 API 请求以获得正确的权限（当然是在登录之后）。
对于这个问题，我们有很多解决方案，哪个是最好的，取决于你的基础设施，你的团队等等。基本上你需要调用 API 来检查权限，因为你的权限存储在后端。切勿在前端存储（如会话、cookie 等）上存储权限
我可以给一些方法。 首先，登录后立即调用API获取权限信息，例如：
- 获取允许的路由列表，然后，每当用户浏览到特定路由时，检查以确保该路由在允许的路由列表中。
- 获取允许的团队列表，如团队 ID 数组，然后在每条路线中获取团队 ID，检查该团队是否存在于上述列表中。
但我相信您会发现它们几乎相同，只是获取的数据和处理数据的方式不同。两种解决方案完全取决于您。
所有 API 请求 应放在页面组件的 componentDidMount 中，因为您将希望确保尽快正确应用权限因为后端有变化。
编码愉快！