客户端请求发送JSON数据的场景
在日常开发中,前端页面向服务器提交表单信息、App调用后台接口获取用户数据,这些操作背后基本都依赖“客户端请求发送JSON数据”这一机制。比如你在一个购物App里填写收货地址并点击提交,手机就会把姓名、电话、详细地址这些信息整理成JSON格式,通过HTTP请求发给服务器。
这种做法的好处是结构清晰、跨平台兼容性好。服务器收到后能快速解析,再存进数据库或做进一步处理。
如何正确发送JSON数据
发送时,客户端需要设置请求头(Headers)中的 Content-Type 为 application/json,告诉服务器:“我发的是JSON,别当成普通文本处理了”。如果这一步没设对,服务器可能按表单格式解析,结果就是数据丢失或者报错。
以JavaScript为例,用 fetch 发送请求可以这样写:
fetch('/api/user', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({
name: '张三',
age: 28,
city: '杭州'
})
})这里 body 里的数据必须先用 JSON.stringify 转成字符串,否则请求会失败。这是新手常踩的坑——直接传对象,结果服务器收不到内容。
服务器端怎么接
服务端框架比如Node.js的Express,需要使用 body-parser 中间件才能自动解析JSON数据。现在新版 Express 已内置该功能,只要加一句 app.use(express.json()) 就行。
Python的Flask也类似,request.get_json() 可以直接拿到客户端发来的JSON对象。但如果请求头不对,或者数据格式不合法,返回的就是 None 或报错。
实际维护中遇到过这样的问题:某个App版本更新后注册不了账号,排查发现是旧版本客户端还在用 application/x-www-form-urlencoded 发送数据,而新接口只认JSON。最后只能临时兼容两种格式,等客户端全部升级后再去掉。
调试小技巧
线上出问题时,可以用浏览器开发者工具的 Network 面板看请求详情。点开具体请求,查看 Headers 里有没有 application/json,再看 Payload 是否是你期望的数据结构。如果是空的或者乱码,大概率是前端序列化出了问题。
另外,Nginx日志或后端访问日志也能帮助判断:如果看到大量400错误,且来源集中在某个接口,很可能是客户端发的数据格式不对。
保持前后端对数据格式的共识,比加一堆容错逻辑更有效。一个简单的JSON校验规则,能省去后续不少麻烦。