json-server 默认要求 post 请求提交的数据必须包含唯一 `id` 字段（或能自动生成），否则会因资源创建失败而返回 500 错误；启用 `--no-cors` 或自定义中间件无法绕过此数据校验逻辑。
在使用 json-server 进行前端开发联调时，你可能会遇到这样的问题：明明已通过 --no-cors 启动服务，甚至尝试编写中间件，但向 /messages 发起 POST 请求仍返回 HTTP 500 Internal Server Error，控制台提示类似 Referrer Policy: strict-origin-when-cross-origin —— 这其实是个误导性线索。真正原因并非 CORS，而是 json-server 的数据结构约束。
? 根本原因：缺失 id 字段触发内部错误
json-server 基于内存数据库模拟 REST API，其 POST（创建资源）行为依赖于每个资源对象具备唯一标识符 id。若请求体中未提供 id，且数据库中对应集合（如 "messages"）初始为空或不满足自增条件，json-server 将无法生成有效 ID，最终抛出 500 错误（而非 400）。
例如，你的 db.json 若初始为：
{
"messages": []
}而前端发送：
fetch("http://localhost:3002/messages", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ name: "Alice", messages: "Hello" })
});→ 因缺少 id 字段，json-server 创建失败，返回 500。
✅ 正确做法是：确保请求体显式携带 id，或初始化数据库时让集合至少含一个带 id 的条目（触发自动递增机制）：
// db.json（修正后）
{
"messages": [
{
"id": 1,
"name": "Priscila da Silva",
"messages": "Primeira mensagem de priscila"
}
]
}此时再发 POST（即使新数据不带 id）：
{ "name": "Bob", "messages": "Hi there!" }json-server 将自动分配 id: 2 并成功响应 201。
⚠️ 关于 --no-cors 和中间件的常见误区
- --no-cors 仅禁用内置 CORS 头（如 Access-Control-Allow-Origin），但不解决数据格式或服务端逻辑错误；
- 中间件（如 server.js）需正确挂载——你当前的写法 jsonServer.defaults({ noCors: true }) 是无效的，因为 defaults() 是静态方法，不作用于运行时实例；若需自定义响应头，应使用标准中间件模式：
// server.js
const jsonServer = require('json-server');
const server = jsonServer.create();
const router = jsonServer.router('db.json');
const middlewares = jsonServer.defaults();
// ✅ 正确添加 CORS 头（可选，但非解决 500 的关键）
server.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization');
if (req.method === 'OPTIONS') return res.status(200).end();
next();
});
server.use(middlewares);
server.use(router);
server.listen(3002, () => console.log('JSON Server running on http://localhost:3002'));然后启动：node server.js（而非 npx json-server --middlewares）。
✅ 最佳实践总结
- 始终为 POST 数据提供 id（字符串或数字均可），避免依赖自动递增；
- 初始化 db.json 时，确保集合非空且首项含合法 id；
- --no-cors 仅用于调试，生产环境应配置合理 CORS 策略；
- 500 错误优先排查数据结构（ID、字段类型、嵌套层级），而非网络策略。
遵循以上规则，你的 handleSubmit 函数即可稳定工作，无需额外中间件干预。
