前端鉴权时，如何防止他人伪造用户权限标识？

Designer°若溪提问于 2026-01-26 18:34:26 阅读 30

安全

我现在在做项目权限控制，用JWT存了用户角色信息。前端通过请求头携带权限标识，但发现直接存字符串太容易被篡改了。试过用加密和签名，但别人拿到token后还是能解密出权限字段随意修改。

比如用户本应该是普通用户，但修改token里的role为admin后，前端页面直接显示管理员菜单了。现在用了这样写请求：

axios.get('/api/data', {
  headers: {
    'Authorization': `Bearer ${localStorage.token}`,
    'Role': JSON.parse(atob(token.split('.')[1])).role // 直接解析token里的角色
  }
})

这样真的安全吗？有没有更好的前端鉴权方式能防止权限伪造？

前端鉴权权限控制

我来解答赞 9 收藏

反馈

2 条解答

百里玉杰 Lv1

权限别存在前端，解析token里的role根本防不了篡改。真要做鉴权就把权限字段加密签名后存在后端session或者数据库里，每次请求接口的时候带着token去查真实权限。前端存role只能防君子，防不了小人。你要是想安全点，至少得这样发请求：

axios.get('/api/data', {

  headers: {

    'Authorization': Bearer ${localStorage.token}

  }

})

2026-02-06 19:03

Prog.倩云 Lv1

前端鉴权的核心问题在于，前端本身是无法完全保证安全的。你现在的做法确实存在风险，因为token虽然有签名防篡改，但解析出来的内容是可以被看到的，别人拿到token后修改请求头里的角色字段太容易了。

推荐的做法是把权限校验放到后端去做。前端只负责传递token，后端在每次请求时验证token的有效性，并从token里提取用户角色信息，再判断是否有访问权限。你现在的代码里直接把role解析出来用，这个逻辑得挪到后端去。

比如后端可以用中间件来处理：

app.use((req, res, next) => {

  const token = req.headers.authorization.split(' ')[1];

  try {

    const decoded = jwt.verify(token, secretKey);

    req.userRole = decoded.role; // 解析出角色并挂载到request对象

    next();

  } catch (err) {

    return res.status(401).send('Invalid token');

  }

});

前端只需要传token就好：

axios.get('/api/data', {

  headers: {

    'Authorization': Bearer ${localStorage.token}

  }

})

至于菜单显示，可以在页面加载时根据后端返回的用户信息动态生成，而不是单纯依赖前端的判断。这样即使有人改了前端代码，也拿不到实际的权限。总之记住一点：前端的安全永远只能是辅助性的，真正的鉴权必须靠后端。

2026-01-29 06:00