网络编程接口中JSON格式数据的使用技巧

网络编程接口与JSON数据的关系

做网站搭建时，经常要从服务器拿数据，比如用户信息、商品列表、天气预报这些。以前可能用XML，现在几乎都用JSON了。为什么？因为JSON轻量、易读、解析方便，特别适合在网络编程接口中传输。

你打开浏览器开发者工具，看网页请求后台接口返回的内容，八成看到的是像这样的一串：

{"name": "张三", "age": 30, "city": "北京"}

这其实就是JSON格式的数据。它长得像JavaScript里的对象，但其实是字符串，可以在不同语言之间通用。

接口怎么返回JSON数据

以常见的Node.js + Express为例，后端只要设置好路由，直接用res.json()就能把数据发出去：

app.get('/api/user', (req, res) => {
  res.json({ id: 1, name: '李四', email: 'lisi@example.com' });
});

前端用fetch一调用，立马就能拿到：

fetch('/api/user')
  .then(response => response.json())
  .then(data => {
    console.log(data.name); // 输出：李四
  });

前后端约定好结构更省事

实际开发中，前后端得提前说清楚接口返回的JSON长什么样。比如订单接口，字段包括编号、金额、状态，那就定个格式：

{
  "order_id": "20240415001",
  "amount": 99.5,
  "status": "paid",
  "items": [
    { "name": "咖啡", "count": 2 },
    { "name": "面包", "count": 1 }
  ]
}

这样前端写代码时就知道怎么取值，也不会因为字段名不一致来回扯皮。

处理中文和特殊字符要注意编码

有时候接口返回的JSON里中文变成乱码，多半是编码没设对。确保服务器响应头里加上charset=utf-8：

Content-Type: application/json; charset=utf-8

Node.js里可以这么写：

res.setHeader('Content-Type', 'application/json; charset=utf-8');
res.end(JSON.stringify({ message: '你好，世界' }));

调试接口时的小帮手

刚连接口容易出错，可以用Postman或者浏览器直接访问接口地址，看返回的JSON对不对。如果报错，先看是不是语法错了，比如少了个逗号或多括号，JSON就不合法了。

也可以在代码里加个try-catch防止崩溃：

try {
  const data = JSON.parse(responseText);
} catch (e) {
  console.error('JSON解析失败', e);
}

线上环境别忘了加这层保护，不然一个错数据可能导致整个页面白屏。