Servlet接收前端Ajax傳遞的Json資料


Posted by yaweichiang on 2022-06-09

一般狀況下Servlet在接收前端form post過來的資料時可以使用request.getParameter("Key")方法取得Key對應的值,
但在前端使用ajax進行請求的情況下使用上述方法卻發生只讀取到null值的情況,這邊稍加紀錄所得到的結論跟後續處理方式。

解決方法:經由request的InputStream讀取資料
前端使用fetch 進行post 請求 程式碼如下:

```
let obj = {
    id:"userid",
    name:"username"
}
fetch('/user',{
    method:'post',
    headers:{'Content-Type':'application/json'},
    body:JSON.stringify(obj)
}).then(response=>{
    return response.json();
}).then(datas=>{
    console.log(datas);
}).catch(err=>console.log(err))
```

Servlet 程式碼如下: (使用到套件 org.json 中的JSONObject類 利用讀取到的的json格式String建立JSONObject物件)

```
@Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        BufferedReader br = new BufferedReader(new InputStreamReader(req.getInputStream()));
        String json = "";
        if (br != null) {
            json = br.readLine();
        }
        JSONObject obj = new JSONObject(json);
            //後續即可使用obj物件的方法取得對應key的值
```

參考文章說到這個狀況是由於Tomcat對於Content-Type是multipart/form-data及application/x-www-form-urlencoded的POST請求進行了特殊處理,所以可以使用getParameter讀取,而對於其他類型的POST因為資料可能有不同的格式而沒有進行特殊處理,以致於getParameter方法無法如我們原先預期的讀取到資料。

參考文章:https://codertw.com/%E7%A8%8B%E5%BC%8F%E8%AA%9E%E8%A8%80/301708/


#servlet #ajax







Related Posts

讀書筆記-JavaScript技術手冊4: 物件進階語法

讀書筆記-JavaScript技術手冊4: 物件進階語法

混用的JavaScript,直接混起來~

混用的JavaScript,直接混起來~

ecto 簡介 (2) – tendrils 與 scheduler

ecto 簡介 (2) – tendrils 與 scheduler


Comments