使用 fetch 提交 json 数据需设置 content-type: application/json 请求头，并用 json.stringify() 将对象转为字符串作为 body；get 请求不支持 json body，应通过 url 查询参数传递。
使用 fetch 提交 JSON 数据，核心是设置正确的请求头（Content-Type: application/json），并把 JavaScript 对象用 JSON.stringify() 转成字符串作为请求体。
基本写法：POST 提交 JSON 数据
这是最常见场景——向后端 API 发送结构化数据：
- 用
JSON.stringify()把对象转为 JSON 字符串 - 在
headers中显式声明Content-Type: application/json -
method设为'POST'，body填入序列化后的字符串
示例：
const data = { username: 'alice', email: 'alice@example.com' };
fetch('/api/users', {
method: 'POST',
headers: {
'Content-Type': 'application/<a style="color:#f60; text-decoration:underline;" title="js" href="https://m.php.cn/zt/15802.html" target="_blank">js</a>on'
},
body: JSON.stringify(data)
})
.then(res => res.<a style="color:#f60; text-decoration:underline;" title="json" href="https://m.php.cn/zt/15848.html" target="_blank">json</a>())
.then(json => console.log('成功:', json))
.catch(err => console.error('失败:', err));
处理响应时也常需 JSON 解析
后端返回的响应体通常也是 JSON 格式，需调用 res.json() 解析：
-
res.json()返回一个 Promise，不是直接得到对象 - 不要写成
res.json（漏了括号），否则会报错 - 建议检查
res.ok判断 HTTP 状态是否成功（如 200–299）
更稳妥的写法：
fetch('/api/users', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ name: 'Bob' })
})
.then(res => {
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return res.json();
})
.then(data => console.log(data))
.catch(err => console.error(err));
GET 请求一般不带 JSON body
标准 GET 请求不支持发送请求体，参数应通过 URL 查询字符串传递：
- 若强行给 GET 设置
body和Content-Type，多数服务端会忽略或报错 - 需要传复杂参数时，改用
URLSearchParams拼接查询串，或换用 POST - 例外：极少数自定义协议或调试场景可能用 GET + body，但不符合 REST 规范，不推荐
注意点与常见坑
-
别忘了
JSON.stringify()：直接传对象会变成[object Object]，后端收不到字段 -
中文等特殊字符无需额外编码：JSON 字符串本身支持 UTF-8，
fetch会自动处理 -
空值、undefined、函数会被 JSON 忽略：例如
{ a: undefined, b: null }序列化后是{"b":null} -
错误处理要覆盖网络失败和 HTTP 错误：
fetch只在网络彻底断开时 reject，4xx/5xx 仍算“成功”响应
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
