使用 fetch 进行 POST 请求以将数据添加到 JSON 服务器数据库

Posted 2023-03-27

【中文标题】使用 fetch 进行 POST 请求以将数据添加到 JSON 服务器数据库

【英文标题】：Using fetch for a POST request to add data to JSON server database

【发布时间】：2021-02-11 11:17:47

【问题描述】：

尝试使用 JSON 服务器向我的假数据库添加新内容。

问题是当我运行该函数时，没有添加输入信息。但是在我的数据库中创建了一个 id 但没有正文内容。

我的代码：

// newName + newNumber are values from user input
 const contactObject = 
        name: newName,
        number: newNumber,
        date: new Date().toISOString(),
        id: persons.length + 1,
      
      console.log(JSON.stringify(contactObject))

      fetch('http://localhost:3001/phonebook', 
        method: 'POST',
        body: JSON.stringify(contactObject),
      )

上面的控制台日志显示"name":"test","number":"12345","date":"2020-10-29T01:50:17.345Z","id":9

我的 JSON 数据库显示

// hardcoded data
 
      "name": "Mary Poppendieck",
      "number": "39-23-6423122",
      "id": 4
    ,
// data from running my create new function
    
      "id": 5
    

我预计数据将包括姓名、号码、数据、ID。但只是得到一个 ID。

不确定我在这里做什么，因为这是我第一次进行任何 CRUD 操作。

【问题讨论】：

也许是你的后端代码在做something wrong™

尝试将内容类型设置为application/json

【参考方案1】：

需要将以下内容添加到我的功能中。

 headers: 
          "Content-type": "application/json; charset=UTF-8"
        

完整代码：

fetch('http://localhost:3001/phonebook', 
        method: 'POST',
        body: JSON.stringify(contactObject),
        headers: 
          "Content-type": "application/json; charset=UTF-8"
        
      )