Javascript 为什么只有GET请求在前端工作。POST、PUT和Delete won'；行不通

我有一个java servlet CRUD应用程序。使用postman时获取、发布、放置和删除工作。但是，当我使用前端javascript代码时，只有GET请求才能工作。正在访问servlet后端上的POST、PUT和DELETE方法，但当请求到达后端时，似乎没有任何参数附加到请求

下面是我的GET JS代码

function getTimePeriods(){
    clearElements()
    const url = 'http://localhost:8080/TimeTrackerWServlets/TimePeriodController/'

    fetch(url)
        .then(response => response.json())
        .then(response => showTimePeriods(response))     
}  

function post(){
    console.log("post file reached")
    const url = 'http://localhost:8080/TimeTrackerWServlets/TimePeriodController/'
    const Data = {
        timePeriodId: "999",
        activityType: "ANIME"
    };

    const otherPram = {
        headers: {
            "content-type" : "application/json; charset=UTF - 8"
        },
        body : Data,   //JSON.stringify(Data)
        method: "POST",
        // mode: "no-cors",
    };

    fetch(url, otherPram)
    .then(data=>{return data.json})
    .then(res=>console.log(res))
    .catch(error=>console.log(error))
}

下面是POST-JS代码

function getTimePeriods(){
    clearElements()
    const url = 'http://localhost:8080/TimeTrackerWServlets/TimePeriodController/'

    fetch(url)
        .then(response => response.json())
        .then(response => showTimePeriods(response))     
}  

function post(){
    console.log("post file reached")
    const url = 'http://localhost:8080/TimeTrackerWServlets/TimePeriodController/'
    const Data = {
        timePeriodId: "999",
        activityType: "ANIME"
    };

    const otherPram = {
        headers: {
            "content-type" : "application/json; charset=UTF - 8"
        },
        body : Data,   //JSON.stringify(Data)
        method: "POST",
        // mode: "no-cors",
    };

    fetch(url, otherPram)
    .then(data=>{return data.json})
    .then(res=>console.log(res))
    .catch(error=>console.log(error))
}

我可以console.log我想附加到请求的对象

下面是我的servlet doPost方法的缩写版本

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

        System.out.println("doPost reached POST POST POST POST POST POST POST POST ");
        setAccessControlHeaders(response);

        System.out.println("startTime: " + request.getParameter("timePeriodId"));
        System.out.println("startTime: " + request.getParameter("activityType"));
    }

两者

打印输出为空

---

那么，如何将数据附加到前端的请求中呢。您的my only hope Obi-Wan Kenobi。

避免在数据对象上使用JSON.stringify可能是个问题，同时在“内容类型”标题上传递错误的参数

编辑：

尝试以下设置：

function post(){
    console.log("post file reached")
    const url = 'http://localhost:8080/TimeTrackerWServlets/TimePeriodController/'

    const otherPram = {
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded',
            'Accept':'application/json; charset=utf-8'
        },
        body : "timePeriodId=999&activityType=ANIME",
        method: "POST",
    };

    fetch(url, otherPram)
    .then(data=>{return data.json})
    .then(res=>console.log(res))
    .catch(error=>console.log(error))
}

---

从

内容类型

标题中删除

字符集

，然后重新替换JSON stringify，可以修复此问题

function post(){
    console.log("post file reached")
    const url = 'http://localhost:8080/api/test123'
    const Data = {
        timePeriodId: "999",
        activityType: "ANIME"
    };
    const otherPram = {
        headers: {
            "content-type" : "application/json"
        },
        body : JSON.stringify(Data),
        method: "POST",
        // mode: "no-cors",
    };
    fetch(url, otherPram)
        .then(data=>{return data.json})
        .then(res=>console.log(res))
        .catch(error=>console.log(error))
}

---

我将body改为使用JSON.stringify，并在标题中添加了Accept。无法在后端获取参数。我删除了字符集并将其放回stringify。后端还没有参数。此代码不提交参数，而是提交一个正文。你在检查尸体吗？如果您的后端是express，请使用

console.log（req.body）