Question

我正在编写一个Web服务，可以在其中搜索视频游戏，然后单击右边的按钮，获得有关该游戏的指定信息。我通过使用fetch和GET请求从第三方API获取信息来完成所有这些工作。现在，我希望能够使用POST请求创建列表。我希望能够点击一个按钮，并将正在查看的游戏的特定信息添加到列表中。这是我的代码的一部分，正在获取有关特定游戏的信息：

let name = localStorage.getItem("name");
let id = localStorage.getItem("id");
let cover = localStorage.getItem("cover");
document.getElementById("title").innerText = name;
document.getElementById("header").innerText = name;
document.getElementById("cover").src = cover;

fetch("http://localhost:3000/games?search=" + id, {})
    .then((response) => {
        return response.json();
    })
    .then((response) => {
        if(response[0]["storyline"] != null) {
            document.getElementById("storyline").innerText = response[0]["storyline"]; 
        }
        document.getElementById("summary").innerText = response[0]["summary"];
        document.getElementById("total_rating").innerText = Math.round(response[0]["total_rating"]) + "/100";
        fetch("http://localhost:3000/genre?search=" + id, {})
            .then((response) => {
                return response.json();
            })
            .then((response) => {
                let GenreHelper = [];
                for(let n=0; n<=response.length; n++) {
                    GenreHelper[n]=response[n]["name"];
                    document.getElementById("genre").innerText = GenreHelper.toString();
                }
            });

现在，我希望能够单击一个按钮并将名称和Cover变量发送到其他html站点，以便显示列表。我给了我的html页面一个特定的信息来启动POST请求：

<form id="form" action="/addtolist" method="POST">
    <button id="PostB" type="submit" name="name">Submit</button>
</form>

然后在我的Javascript文件中设置变量：

document.getElementById("PostB").name = name;
document.getElementById("PostB").value = cover;

我在app.js文件中为POST请求创建了一个端点：

app.post('/addtolist',(req,res)=>{
    console.log(req.body);
});

和console.log确实给了我一个object的名字和封面，但这是我被困住的地方。我不知道如何将req.body变量赋予不同的html或不同的js file才能将其显示为list。如果我可以使用它，我可能可以发出一个DELETE请求，再次从列表中选出候选人，这就是我所需要的全部功能。

使用Express与POST请求进行清单

0 个答案: