使用json-server时POST请求仅生成id，其余数据未保存的问题排查

嘿，我刚碰到过一模一样的坑！这事儿根源是你用错了json-server接收POST数据的方式，咱们一步步捋明白：

核心问题：数据放错位置了 #

json-server的POST接口完全不会读取URL里的查询参数来创建资源，它只认请求体（Request Body）里的JSON数据。你之前把firstname、lastname这些参数挂在URL后面，服务器根本不会把它们当作新contact的属性，只会自动生成一个自增id，自然就只有id被存下来了。

正确操作步骤（以Postman为例） #

1. 简化请求URL：只保留基础地址就行，不要加任何查询参数，也就是 http://localhost:3001/contacts
2. 配置请求体：
   • 切换到「Body」标签页
   • 选择「raw」格式，右侧下拉框选「JSON」
   • 把要提交的内容写成标准JSON格式放进去，比如：

     {
       "id": 48,
       "firstname": "rrtty",
       "lastname": "yryrty",
       "company": "trytryrt",
       "email": "tyrtyr",
       "message": "tyrtytry"
     }
     

3. 发送请求：这时候再去看你的db.json，新的contact就会带着所有字段正确保存，包括你指定的id也能生效。

自研应用发起请求的注意事项 #

如果是你自己写的应用发请求，要盯紧两个关键点：

• 必须设置请求头：Content-Type: application/json，告诉服务器你传的是JSON格式数据
• 要把数据序列化成JSON字符串放在请求体里，比如用JavaScript的话：

  fetch('http://localhost:3001/contacts', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      id: 48,
      firstname: 'rrtty',
      lastname: 'yryrty',
      company: 'trytryrt',
      email: 'tyrtyr',
      message: 'tyrtytry'
    })
  })
  

为啥之前指定的id没生效？ #

因为你之前的请求根本没把id=48这个参数传到服务器的请求体里，服务器只能自动生成新的自增id。现在把id放到请求体的JSON里，只要这个id在contacts集合里还没被占用，就能用你指定的值。

另外，你db.json里那些只有id的条目，应该都是之前用错误方式发起请求留下的，现在用正确方法就不会再出现这种情况啦！

内容的提问来源于stack exchange，提问作者jupiter sailormoon