Ext JS - 使用 viewModel 存储权限或其他“非public”数据

Ext JS - using viewModel for storing permissions or other ‘non-public’ data

我想知道具有不同角色权限的应用程序的正确方法是什么。我认为登录后,服务器会发送一些预定义的角色,并且可以根据该角色限制或显示各个面板。所以,我将该值存储在主视图的 viewModel 中,例如

Ext.define('MyApp.view.main.MainModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.main',

    data: {
        user_id : null,
        user_name : '',
        role : '',
    },
    
});

后来在应用程序中我检查了角色的存储值,并基于此限制了一些操作。但是,我意识到这很荒谬,因为可以通过控制台轻松访问 viewModel,并且可以更改“role”的值。例如:

Ext.getCmp('main').getViewModel().data.role = 'Admin'

但是存储该信息的正确方法是什么?这不仅对于基于权限角色的应用程序非常重要,而且对于存储其他数据也非常重要。所以,我想这是一个微不足道的问题,但我真的不明白。

其实这不是一个小问题。我认为没有任何适当的方法可以实现您想做的事情。无论您使用的是什么框架,它都是客户端 js 代码,可以是来自控制台的 altered/hacked。您可以尝试通过混淆您的代码或其他一些巧妙的方式来隐藏您的安全逻辑,但这只是一种错误的安全感,您无法阻止经验丰富的 js 开发人员解决它。

如果安全性在您的应用程序中确实很重要,那么与其在 UI 上隐藏组件,不如尝试限制 data/API 访问,因为您可以更安全地控制后端的访问。 IE。不要花太多时间使客户端比使用 ViewModel 方法更安全。但是请确保即使客户端安全性遭到破坏,并且有人可以授予管理员权限,那么该用户将只能看到您的隐藏面板,但不会从您的 API.

获取数据

即您的 API 不应将所有数据发送给客户端,控制数据访问也不应该是客户端的责任。您的 API 应该只将经过身份验证的用户的角色允许的数据发送给客户端。

根据作者的评论编辑以消除误解。

当您的客户端对用户进行身份验证时,它会发回角色。但是这个角色应该只能用来控制UI(show/hide面板和其他控件)。
当您的客户端从服务器请求数据时,它不应仅在请求中发送身份验证数据(即用户凭据)。然后你的服务器应该根据收到的凭据查找正确的角色,并且只在给定角色允许的响应中发回该数据。
通过这种方式,即使您的 viewModel 被黑,用户也可以看到该角色允许的控件,但不会看到数据,因为您不会填充它,因为服务器响应不包含它。