我应该将菜单数据存储在数据库中还是在前端进行硬编码以获得更好的可管理性和用户授权？

Question

我正在开发一个应用程序，前端使用 Next.js，后端使用 ASP.NET Core。该应用程序有一个很大的菜单结构，我需要实现基于角色的访问控制，以便不同的用户根据权限看到不同的菜单项。

我正在尝试从性能和可维护性方面决定管理此菜单数据的最佳方法：

将菜单结构存储在前端（硬编码数据），这可能会简化前端代码，但随着菜单的增长和用户权限需要更新，可能会变得具有挑战性。

将菜单存储在数据库中，这可以为更改和权限提供更大的灵活性，以及跨不同用户角色的轻松更新。但这可能会增加复杂性，而且我担心每次用户登录时在数据库中查询菜单数据对性能的影响。

以下是我的主要考虑因素：

随着需求的变化，轻松更新菜单结构。 从数据库获取菜单结构对性能的影响。 轻松管理基于角色的用户权限。 在这种情况下，最佳做法是什么？我应该将菜单数据存储在数据库中还是将其硬编码在前端以获得最佳的可管理性和可扩展性？

任何建议或指导将不胜感激。谢谢！

Answer 1

我的想法是，我们可以将菜单绑定到角色并将菜单存储在数据库中，因为我在一个门户项目上工作，该项目也采用了这个计划。有些菜单是硬编码在前端的，例如主页、仪表板，即使没有登录帐户，所有用户也可以使用这些菜单。

当我们在前端应用程序中硬编码菜单时：也许所有菜单和子菜单都在前端应用程序中硬编码，我们需要做的是隐藏所有需要用户先登录的菜单。然后，每当帐户登录时，我们需要检查角色并决定哪些菜单应更改为显示以及哪些菜单应隐藏。登录操作需要一个http请求，它将带来登录结果以及菜单信息。菜单信息可能包含指示需要显示哪些菜单的菜单列表，或者指示需要隐藏哪些菜单的布尔结果列表。但是，当我们按 F12 时，我们可能仍然能够看到这些菜单，我们需要确保这些页面上的用户角色经过验证。

当我们只硬编码一直可用的菜单并从数据库查询后添加菜单时：我们不需要在前端应用程序中控制隐藏和显示，也需要一个登录操作的http请求，它将也从后端应用程序获取用户信息和菜单信息。但在这里，菜单信息应该包含每个菜单的 url，以便我们可以创建菜单名称，如果要同时显示子菜单，还可以创建父子菜单关系。这将花费更多时间，但不会花费太多时间，因为数据库查询速度很快，并且动态渲染菜单也不会花费太多时间。为了避免某些用户知道其帐户无法使用的菜单 URL 的情况，我们还需要为用户添加页面级别验证。

以我的愚见，这两种方法之间最大的区别是我们是否希望前端应用程序执行“隐藏”操作或“添加菜单”操作。添加操作只需要有一个foreach循环来生成菜单树并将其添加到菜单导航栏中，但隐藏操作需要控制所有菜单的IsHidden属性，这会给长时间的管理带来很多麻烦。假设有一天我们需要添加/更新一个菜单及其与角色的关系，如果我们动态添加菜单，我们只需要更改数据库中存储的数据，无需更改前端。但如果我们在前端硬编码，我们需要更改数据库，然后也更改前端的 IsHidden 逻辑。