无法读取未定义的属性(读取"拆分")，如何删除错误

Question

当向页面添加一些字段时(从客户端)，出现错误:Cannot read properties of undefined (reading 'split')。在此代码片段中发生Const JWT = require('jsonwebtoken');

module.exports = function(role) {
return function (req, res, next) {
if (req.method === "OPTIONS") {
next();
}
try {
const token = req.headers.authorization.split(' ')[1];
if (!token) {
return res.status(401).json({message: "Not authorized"});
}
const decoded = jwt.verify(token, process.env.SECRET_KEY);
if (decoded.role !== role) {
return res.status(403).json({message: "No access"});
}
req.user = decoded;
next();
} catch (e) {
console.log(e.message); //error message here
res.status(401).json({message: "Not authorized"});
}
};
}

此外，如果您从服务器端添加它(例如，在postman中)，那么一切都可以正常工作。错在哪里?

Answer 1

这仅仅意味着req.headers.authorization值不是字符串(或者最有可能的值是:undefined)。在调用split

之前，您应该首先检查值是否已设置(并且它是有效的，即字符串)。if(req.headers.authorization) {const token = req.headers.authorization.split(' ')[1];}

Answer 2

我也遇到过同样的问题。这是因为后端服务器没有从客户端获得令牌。换句话说，客户端没有发送后端请求的令牌，req.headers.authorization未定义。

在我的例子中，我将令牌保存到本地存储。因此，我在客户端编写了以下代码:

const token = '6d78tf8wef76w9e6fbla64bla64bla64bla64bla64bla64bla64bla64';

组件中的这一部分:(注意:使用"tanstack query"获取数据。不是正常的方式)

const { data: users = [], refetch } = useQuery(["users"], async () => {
const res = await fetch(url, {
headers: { 
authorization: `bearer ${token}`
}});
return await res.json();
});

看headers，这个东西正在向后端服务器发送令牌。

对于正常的读取功能:

fetch(url, {
headers: {
authorization: `bearer ${token}`
}})

如果有人想查看后端代码:

const verifyJWT = (req, res, next) => {
const authorization = req.headers.authorization;
console.log(req.headers);
if (!authorization) {
res.status(401).send({ error: true, message: 'unauthorized access' });
}
const token = authorization.split(' ')[1];
jwt.verify(token, process.env.ACCESS_TOKEN_SECRET, (err, decode) => {
if (err) {
return res.status(401).send({ error: true, message: 'unauthorized access' })
}
req.decode = decode;
next();
})
}