MEAN Stack创建公司数据时JSON解析报错及格式适配求助
解决MEAN Stack中Angular表单提交后Node.js端JSON解析
SyntaxError: Unexpected token u的问题 我来帮你梳理下这个问题的核心原因和解决办法——你遇到的SyntaxError: Unexpected token u in JSON at position 0本质是因为后端错误地尝试解析一个不存在的字段,导致JSON.parse()接收到了undefined(报错里的"u"就是undefined的首字母)。
问题根源拆解
- 你的Angular服务中,直接把
company对象作为POST请求的Payload发送,所以后端req.body里的结构是扁平的:比如req.body.coname、req.body.coid这些字段直接存在,而非嵌套在req.body.company中。 - 但你最初的
company.js控制器代码里,第一行写了req.body.company = JSON.parse(req.body.company);——这时候req.body.company根本不存在,值是undefined,传给JSON.parse()自然会抛出语法错误。
两种可行解决方案
方案1:保持前端现有请求格式(推荐,已验证可用)
直接调整后端代码,适配前端发送的扁平数据结构:
- 删除控制器中
req.body.company = JSON.parse(req.body.company);这一行(这是报错的直接原因) - 直接从
req.body中读取字段创建Company实例,就像你用Postman测试时的代码那样:
exports.createCompany = (req, res, next) => { console.log(req.body); const company = new Company({ coid:req.body.coid, coname: req.body.coname, // 其他字段保持不变... bogid: req.body.bogid }); company.save().then( () => { res.status(201).json({ message: 'Post saved successfully!' }); }) .catch( (error) => { res.status(400).json({ error: error }); }); };
方案2:修改前端请求格式,适配后端最初的嵌套结构
如果你希望后端接收嵌套的company字段,需要调整Angular服务的请求体:
CreateCoData(company: Company) { return new Promise((resolve, reject) => { // 把company对象包裹在company字段中 this.http.post('http://localhost:3000/api/company', { company: company }).subscribe( (response) => { resolve(response); }, (error) => { reject(error); } ); }); }
同时注意:因为你已经在app.js中使用了bodyParser.json(),req.body已经是解析好的JSON对象,所以后端的JSON.parse()其实是多余的,可以改成:
const companyData = req.body.company; const company = new Company({ coid:companyData.coid, // 其他字段从companyData读取... });
补充说明
你用Postman测试修改后的后端代码能正常运行,是因为Postman发送的是扁平结构的字段,和Angular发送的请求格式一致,后端直接读取req.body的字段就匹配上了。最初的错误完全是前后端数据格式不匹配导致的。
内容的提问来源于stack exchange,提问作者BenYsil
相关产品推荐
相关产品推荐

