不使用 <form> 将数据从 JS 发送到 servlet

Question

我正在尝试获取一些动态按钮以将它们的 ID 发送到我的 servlet。我想我已经接近了，但就是不知道如何在后端获取数据。

HTML：（动态生成）

<button class="btn btn-success btn-reimb" id="${res[i][1].id}" onclick='approve(this)'><i class="fas fa-check"></i></button>

JS:

const approve = (e) => {
    console.log(e.id);
    const id = e.id;
    var xhttp;
    xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function () {
        if (this.readyState === 4 && this.status === 200) {
           console.log("Sending...")
        }
    };
    xhttp.open("POST", 'approve', true);

    xhttp.send(id);
}

Servlet：

@WebServlet(name = "approve", urlPatterns = {"/approve"} )
public class ApproveServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
        String id = req.getParameter("id");

        System.out.println(id);
    }
}

提前致谢！

编辑：

感谢 Nikos Paraskevopoulos！我的 servlet 代码现在看起来像：

protected void doPost(HttpServletRequest req, HttpServletResponse res) throws ServletException, IOException {
    
ServletInputStream input = req.getInputStream();

        StringBuilder string = new StringBuilder();
        try (Reader reader = new BufferedReader(new InputStreamReader
                (input, Charset.forName(StandardCharsets.UTF_8.name())))) {
            int c = 0;
            while ((c = reader.read()) != -1) {
                string.append((char) c);
            }
        }
        int id = Integer.parseInt(string.toString());


        System.out.println(id);

Answer 1

您 send 和 XMLHttpRequest 的数据在请求正文中。用 req.getInputStream() 阅读它。这为您提供了一个 ServletInputStream，您可以将其作为标准阅读 InputStream。

不使用 <form> 将数据从 JS 发送到 servlet

Sending Data from JS to servlet without using <form>

javascript

ajax

servlets