如何在反应端验证访问令牌?是不是很危险?

Question

目前我有一个后端，我可以使用这个简单的函数验证访问令牌：

const { verify } = require("jsonwebtoken");
const isAuth = req => {
const authorization = req.headers["authorization"];
if (!authorization) throw new Error("You need to login");
const token = authorization.split(" ")[1]; //Bearer token123123jjjjasd , we get the token value
const { userId } = verify(token, process.env.ACCESS_TOKEN_SECRET);
return userId;
};
module.exports = {
isAuth
};

但是在前面这样做/做出反应以保护我的路线呢？将机密存储在我的前端不是很危险吗？ 我应该在我的后端创建一个验证路由并向其发送访问令牌，如果有效则返回 true，否则返回 false？这样安全吗？

Answer 1

不应在客户端存储 JWT 机密。将其存储在客户端是不安全的。

而且客户端不需要 JWT 机密。

您可以使用 jwt 解码包在客户端解码令牌。

或者如果你想在不使用包的情况下解码，你可以看看这里。

要在 React 中保护路由，您可以创建一个 ProtectedRoute 组件，如本答案中所述。

此外，生成过期时间较短的令牌也是一种最佳做法。

Answer 2

我认为，正如您所说，最好在后端有一个路由来检查用户是否获得授权。因为，正如文档所说，在您的 React 应用程序中存储 api 密钥和类似的东西是不安全的。

从创建反应应用程序文档中：

警告：不要在您的 反应应用程序！

环境变量嵌入到构建中，这意味着任何人都可以 通过检查应用的文件来查看它们。