JavaScript 中怎么使用 Proxy 实现对象属性的权限访问控制列表-js教程-PHP中文网

proxy 可拦截对象属性读写操作，在 get/set 中结合角色、字段级权限规则实现动态访问控制，支持嵌套对象递归代理和运行时权限更新，但需注意 ownkeys、has 等操作未被默认拦截。

javascript 中怎么使用 proxy 实现对象属性的权限访问控制列表

可以用 Proxy 拦截对象的属性读写操作，在 get 和 set 中结合权限规则做动态校验，实现细粒度的访问控制。

定义权限规则和用户角色

先明确哪些用户能读/写哪些属性。常见做法是用一个配置对象描述权限，比如：

role-based：按角色（如 "admin"、"editor"、"viewer"）定义可访问字段列表
field-level：每个属性单独配置 read 和 write 的允许角色数组
也可结合上下文（如当前登录用户 ID、请求来源）动态判断，不局限于静态角色

用 Proxy 拦截 get/set 操作

创建 Proxy 时，在 get 中检查读权限，set 中检查写权限。未授权时可返回 undefined、抛错或静默忽略：

js2java

JavaScript 到 Java 全栈翻译助手，专为前端开发者学习 Java 或快速实现后端业务逻辑而设计。当用户提到以下场景时必须使用此技能： - "帮我把这段 JS 代码转成 Java" - "用 Java 怎么写这个逻辑" - "我习惯用 JS 写，想翻译成 Java" - "教我 Java，我要写后端接...

下载

const permissions = {
  name: { read: ['admin', 'editor'], write: ['admin'] },
  email: { read: ['admin'], write: ['admin'] },
  status: { read: ['admin', 'editor', 'viewer'], write: ['admin', 'editor'] }
};

function createSecureObject(target, userRole) {
  return new Proxy(target, {
    get(obj, prop) {
      const rule = permissions[prop];
      if (rule && !rule.read?.includes(userRole)) {
        console.warn(`Access denied: ${prop} is not readable by ${userRole}`);
        return undefined;
      }
      return obj[prop];
    },
    set(obj, prop, value) {
      const rule = permissions[prop];
      if (rule && !rule.write?.includes(userRole)) {
        console.warn(`Write denied: ${prop} is not writable by ${userRole}`);
        return false; // 静默失败，或 throw new Error()
      }
      obj[prop] = value;
      return true;
    }
  });
}

const user = { name: 'Alice', email: 'a@example.com', status: 'active' };
const editorProxy = createSecureObject(user, 'editor');
console.log(editorProxy.name);   // 'Alice'
console.log(editorProxy.email);  // undefined（无读权限）
editorProxy.status = 'inactive'; // ✅ 允许
editorProxy.email = 'new@ex.com'; // ❌ 拒绝写入