javascript - NodeJS CRUD api 删除方法出现问题

Question

过去 2 天我一直在尝试获取 Nodejs CRUD api 的删除部分，但我无法弄清楚出了什么问题。我仍在学习——一定有一些我没有看到的东西导致它无法正常工作。

在服务器端，我的删除路线如下所示:

app.delete('/delete-lion/:id',(req, res)=>{
    // console.log('ID', req.body.id);
    var lion = lions.findIndex(lion=>lion.id==req.body.id);
    if(!lions[lion]){
        res.send();
    }else{
        var deletedLion = lions[lion];
        lions.splice(lions,1);
        res.json(deletedLion);
        res.send();
    }
})

在客户端，这就是我的内容(app.js...“checky”是每个项目旁边的复选框的 ID，以便能够选择和删除。)

 function deleteData(id){
     return fetch('http://localhost:9091/delete-lion',{
        method: "delete",
        headers: {
            'Accept': 'application/json',
            'Content-Type' : 'application/json',
        },
        credentials: "include",
        body: JSON.stringify(id)
     })
     .then(response => response.json(id))
     .then(response=>{
        if(document.getElementById('checky').checked){
            document.getElementById(response.id).remove()
            return response.id
        } 
        
     })
 }



window.onload = function(){
    getData();
    document.getElementById('add-new-lion').onclick = ()=>{
        displayAddForm()
    };
    document.getElementById('deletey-lion').onclick = ()=>{
        deleteData(0)
        // console.log(e)
    }
}

这是我在控制台中收到的错误:

app.js:111 删除 http://localhost:9091/delete-lion 400(错误请求) 删除数据@app.js:111

document.getElementById.onclick @ app.js:138

app.js:120 未捕获( promise 中)语法错误:JSON 中位置 0 出现意外标记 <

at fetch.then.response (app.js:120)

fetch.then.response @ app.js:120

Promise.then(异步)

删除数据@app.js:121

document.getElementById.onclick @ app.js:138

Answer 1

您的服务器正在监听 '/delete-lion/:id' 处的 DELETE 请求。在此路径中，需要 id 参数。您的服务器将响应

fetch('http://localhost:9091/delete-lion/1337'),

或

fetch('http://localhost:9091/delete-lion/omygoditsalion'),

但不是

fetch('http://localhost:9091/delete-lion').

要解决您的问题，您需要从路由中删除 /:id，或者让您的请求将 lion.id 作为路由参数发送(引用通过回调中的 req.params.id )而不是在请求正文中。您还可以通过将路由参数更改为 '/delete-lion/:id?' 来使其成为可选参数，但这会令人困惑 - 您可能不想建议 id 参数应该当您的后续代码期望它出现在正文中时，请出现在 URI 中。