登录接口请求异常：JSON对象被当作属性键传入问题排查

嘿，这个问题我太熟悉了！根源就在于请求头声明的格式和实际发送的数据格式不匹配，导致后端解析出错。

为什么会出现这种情况？ #

你前端代码里设置了请求头：

request.setRequestHeader("Content-type", "application/x-www-form-urlencoded")

这个头明确告诉后端：“我发送的是key=value&key2=value2这种表单格式的数据”。但实际上你传给后端的是JSON字符串：

request.send(JSON.stringify(dataToSend))

后端按照表单格式去解析这个JSON字符串时，会把整个JSON内容当成一个属性键，值默认为空，于是就出现了你看到的{ '{"email":"james@oxido.co.uk","password":"test"}': '' }这种奇怪结构。

两种修复方案任选其一 #

方案1：改用JSON格式发送请求（推荐）

既然你本来就想传递JSON结构的数据，那就把请求头改成对应格式，同时保持发送JSON字符串的逻辑：

1. 修改请求头配置：

request.setRequestHeader("Content-Type", "application/json")

2. 确保后端已经配置了解析JSON请求体的中间件（比如Express框架下需要添加app.use(express.json())），这样后端的req.body就能正确解析成你预期的{email: "...", password: "..."}对象了。

方案2：按照表单格式构造数据

如果你想保留application/x-www-form-urlencoded的请求头，那就要把数据转换成表单要求的键值对格式：

// 替换原来的dataToSend构造和send逻辑
let dataToSend = new URLSearchParams();
dataToSend.append('email', email);
dataToSend.append('password', password);
request.send(dataToSend);

这样后端就能正常解析出符合预期的键值对结构了。

验证建议 #

修改完成后，可以在前端console里打印发送的数据，后端再打印req.body，确认格式是否匹配预期～

内容的提问来源于stack exchange，提问作者James Stewart