首页 > 解决方案 > 为什么 XMLHttpRequest PUT 请求不起作用?

问题描述

我的控制器中有一个带有基本CRUD操作的简单NODEJS API 。

但是,除了PUT之外的所有请求方法似乎都有效。我只是对 PUT 方法有问题。

这是API 端代码:

app.put('/api/prodotti/:Id', function (req, res) {
connection.query("UPDATE Prodotti SET Descrizione=?, Prezzo=?, Categoria=? WHERE Id=?", [req.body.Descrizione, req.body.Prezzo, req.body.Categoria, req.params.Id], function (error, result) {
    if (error)
        res.send("Errore query: " + error.message);
    if (result.changedRows == 0)
        res.send("Non modificato!");

    console.log("Id modificato: " + req.params.Id);
    res.json(req.params.Id);
});
});

虽然这是我的HTML 页面(客户端)端:

<form>
        <label>Id</label>
        <br />
        <input id="Mid" type="number" name="Id"/>
        <br />
        <label>Descrizione</label>
        <br />
        <input id="Mdescrizione" type="text" name="Descrizione" />
        <br />
        <label>Prezzo</label>
        <br />
        <input id="Mprezzo" type="number" name="Prezzo" />
        <br />
        <label>Categoria</label>
        <br />
        <select id="Mcategoria" name="Categoria">
            <option value="Categoria 1">Categoria 1</option>
            <option value="Categoria 2">Categoria 2</option>
            <option value="Categoria 3">Categoria 3</option>
            <option value="Categoria 4">Categoria 4</option>
            <option value="Categoria 5">Categoria 5</option>
        </select>
        <br />
        <br />
        <button type="button" onclick="UpdateProdotti();"> Modifica </button>
        <input type="reset" value="Reset campi" />
    </form>

和 onclick功能

function UpdateProdotti() {
        var id = document.getElementById("Mid").value;
        var descrizione = document.getElementById("Mdescrizione").value;
        var prezzo = document.getElementById("Mprezzo").value;
        var categoria = document.getElementById("Mcategoria").value;

        data = {};
        data.Descrizione = descrizione;
        data.Prezzo = prezzo;
        data.Categoria = categoria;

        var json = JSON.stringify(data);

        var xhr = new XMLHttpRequest();
        xhr.setRequestHeader('Content-type','application/json; charset=utf-8');

        xhr.open("PUT", "api/prodotti/" + id, true);
        xhr.onload = function () {
            if (this.readyState == 4 && this.status == 200) {
                alert("Modificato " + xhr.responseText);
            }
        }

        xhr.send(json);
    }

我能够提出所有其他请求并轻松获得响应。我知道UpdateProdotti单击按钮时会调用该函数,但即使我向 API 添加断点,也不会收到请求。

谢谢你的帮助。

标签: javascripthtmlnode.jsapixmlhttprequest

解决方案


推荐阅读