前端進階必學——HTTP請求中的Form Data與Request Payload的區別


前端開發中經常會用到AJAX發送異步請求,對於POST類型的請求會附帶請求數據。而常用的兩種傳參方式為:Form Data 和 Request Payload。

GET請求

使用get請求時,參數會以key=value的形式拼接在請求的url后面。例如:

http://m.baidu.com/address/getlist.html?limit=50&offset=0&t=1502345139870

但是受限於請求URL的長度限制,一般參數較少時會使用get請求。

POST請求

當參數數量較多,且對數據有一定安全性要求時,會考慮用post請求傳遞參數數據。POST請求的參數數據是在請求體中。

方式一: Form Data形式

當POST請求的請求頭里設置Content-Type: application/x-www-form-urlencoded(默認), 參數在請求體以標准的Form Data的形式提交,以&符號拼接,參數格式為key=value&key=value&key=value...

前端代碼設置:

xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); xhr.send('a=1&b=2&c=3');

在servlet中,后端可以通過request.getParameter(name)的形式來獲取表單參數。

方式二:Request Payload形式

如果使用AJAX原生POST請求,請求頭里設置Content-Type:application/json,請求的參數會顯示在Request Payload中,參數格式為JSON格式:{"key":"value","key":"value"...},這種方式可讀性會更好。

后端可以使用getRequestPayload方法來獲取。

Form Data 和 Request Payload 區別

  1. 如果請求頭里設置Content-Type: application/x-www-form-urlencoded,那么這個請求被認為是表單請求,參數出現在Form Data里,格式為key=value&key=value&key=value...

  2. 原生的AJAX請求頭里設置Content-Type:application/json,或者使用默認的請求頭Content-Type:text/plain;參數會顯示在Request payload塊里提交。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM