1. 程式人生 > >Payload與form表單提交區別

Payload與form表單提交區別

最近做專案的時候,在通過post請求向服務端傳送資料的時候,請求失敗了。錯誤資訊如下:

返回的400(bad request)錯誤,說明客戶端這邊傳送的請求是有問題的。

和通過jquery中的ajax方法傳送的請求作對比。發現問題出在了請求的主體部分。

這裡的請求主體部分是payload的形式的。

 而直接通過jq,是如下這種formdata形式。

formData是什麼?

 formData是客戶端主體部分組裝資料的一種方式,當我們使用:

  1. method='POST'提交一個HTML-Form表單
  2. 如上圖中黃色部分的content-Type:application/x-www-form-urlencoded
  3. content-Type:multipart/form-data

這三種方式去提交請求主體的時候,就是formData形式。

將如上的請求簡寫一下:

起始行:POST /getProduct HTTP/1.1
首部: Content-Type: application/x-www-form-urlencoded

主體1:productId=3189 單參
主體2:productId=3189&orderId=145 多參

主體的形式會有兩種,在多引數的情況下,和get請求一樣,是用&進行連線的。

複製程式碼
$.ajax({
    url : '/v2/product/getProductProp',
    data :{
        'productId' :proid,
    },
    type: 
'post', }) .then(function(data) { //TODO }) .fail(function() { that.fetchDataFailed(); }) .done(function() { //TODO });
複製程式碼

 

在jq的ajax模組中,contentType的預設是使用的formData傳送主體的。既然如此的話,我們就通過傳入自定義的contentType

複製程式碼
$.ajax({
    url : '/v2/product/getProductProp',
    data :{
        'productId' :proid,
    },
    type: 
'post', contentType:'application/json' //注意這裡的不同 }) .then(function(data) { //TODO }) .fail(function() { that.fetchDataFailed(); }) .done(function() { //TODO });
複製程式碼

是的,我們確實成功的修改了formData的提交形式,變成了payload.

payload是什麼?

payload是一種以JSON格式進行資料傳輸的一種方式。

http可能會傳輸payload,如果不限制其請求的方式(那麼請求的方法就是OPTIONS)或者響應的狀態碼,其包含元資料,頭部區域和資料。

如果資料是通過正常的put或者post方法傳送的,那麼payload就是一個http請求起始行緊接一個CRLF後面的那一部分。

起始行:POST /getProduct HTTP/1.1
首部: Content-Type: application/json

主體1:{"productId":3189} 單參
主體2:{"productId":3189,"orderId":145} 多參

同樣的,我們可以將payload形式的引數。通過formData()來組裝。

 通過formData()組裝後的資料就像表單資料一樣,變成了鍵/值對的形式。

小結

  • 首部屬性contentType可以改變請求的資料提交方式:application/json(payload),application/x-www-form-urlencoded(formData)
  • 服務端的響應方式決定客戶端的提交方式
  • 使用formData()可以通過payload提交表單資料:multipart/form-data

相關推薦

Payloadform提交區別

最近做專案的時候,在通過post請求向服務端傳送資料的時候,請求失敗了。錯誤資訊如下:返回的400(bad request)錯誤,說明客戶端這邊傳送的請求是有問題的。和通過jquery中的ajax方法傳送的請求作對比。發現問題出在了請求的主體部分。這裡的請求主體部分是payload的形式的。 而直接通過jq,

form提交ajax提交區別

原文地址:https://blog.csdn.net/yao302789/article/details/50954902 Ajax提交是通過js來提交請求,請求與響應均由js引擎來處理,頁面不會重新整理,用 戶感覺不到實際上瀏覽器發出了請求。比如說我們希望網頁總是顯示最新的新聞, 而又不想老是

關於form提交ajax提交區別

 1.    為什麼用AJAX?    使用AJAX,使用者對Web的體驗會更“敏捷”:資料提交頁面不會閃屏;頁面區域性    更新速度快;網路頻寬佔用低。  2.    AJAX開發相較傳統模式的簡單之處:    傳統模式下,表單提交則整個頁面重繪,為了維持頁面使用者對錶單的狀態改     變,要多些不少

Ajax提交傳統Form提交區別說明

Ajax提交是通過js來提交請求,請求與響應均由js引擎來處理,頁面不會重新整理,使用者感覺不到實際上瀏覽器發出了請求。比如說我們希望網頁總是顯示最新的新聞,而又不想老是去點重新整理按鈕,我們就可以用Ajax機制來實現。網上的客服軟體也是ajax請求的一個比較好的案例。傳

form提交 ajax提交區別

1、使用場景: 安全性都一樣,都是傳送的http協議。安全性與提交檔案的業務處理(格式檢測,防注入)有關,與提交方式無關。 一般登入用表單提交,點選提交觸發submit事件,一般會 使頁面發生跳轉,頁面的跳轉等行為的控制往往在後端,後端控制頁面的跳轉及資料的傳遞

轉載:關於ajax,form提交,http請求提交區別

https://www.cnblogs.com/lidgblogs/archive/2017/09/01/7403828.htmlajax模仿form上傳:<!doctype html> <html lang="en"> <head>

Form提交引數型別後臺實體引數型別的問題

在SpringMVC+Hibernate+Spring的框架下,Jsp頁面的Form表單提交資料 1.肯定是以 key=val  的形式進行提交到後臺 2.提交的key的型別是根據你的在Jsp頁面標籤的型別而定的 a.如果是用的 JSP:Form 表單的程式碼 <in

傳統form提交方式的檔案上傳檔案儲存

引言 時隔一天,上一篇文章《檔案儲存》剛一停筆,今天上午就解決了困擾我已久的檔案上傳問題。 站在一個已實現功能的角度來重新看待這個檔案上傳的業務:編輯頁面選擇jar包,然後通過form表單提交,上傳到後臺程式,然後儲存。 對於後端實現的更多細節,可以參考我的另一篇技術分

Jq form提交驗證響應簡單示例

<!DOCTYPE html> <html> <head> <title>表單提交驗證與響應</title> </head> <body> <form method=

HTML form 提交方式get和post的區別

method屬性規定如何傳送表單的資料。有兩種提交的方法分別為get和post。 1、get:提交的資料量要小於1024位元組,表單提交時表單域數值(表單請求的資訊:賬號、密碼…)將在位址列顯示。

form提交input的關係,以及jquery呼叫按鈕的問題

工作中遇到這樣的問題,在一個form表單中,有一個input輸入框+一個a標籤作為提交按鈕,jquery檢測a標籤的點選事件 大概就是這樣 <form> <input type='text'> <a> <span>提交<

Ajax提交傳統提交區別說明

Ajax提交是通過js來提交請求,請求與響應均由js引擎來處理,頁面不會重新整理,使用者感覺不到實際上瀏覽器發出了請求。比如說我們希望網頁總是顯示最新的新聞,而又不想老是去點重新整理按鈕,我們就可以用Ajax機制來實現。網上的客服軟體也是ajax請求的一個比較好的案例。傳統的請求頁面將實現重新整理,因此侷限性

html form提交action和url跳轉到action有什麼區別.

form表單的action 與url跳轉是不一樣的: form表單可以給後臺傳遞資料,在後臺直接可以用request物件去向前臺請求資料。 form表單傳遞資料有兩種方式: method="post":這是傳遞大量資料時用的,在資料傳遞之前會先將資料打包,因此這種傳遞資料

form提交的 get/post 方法(一)區別

轉載: 1、Get是用來從伺服器上獲得資料, Post是用來向伺服器上傳遞資料。 2、傳遞資料的 形式不同。 Get將表單中資料的按照variable=value的形式,新增到action所指向的URL後面,並且兩者使用“?”連線,而各個變數之

JS中對於form提交時驗證form的onsubmit函式submit型別按鈕的onclick函式

onsubmit只能表單上使用,提交表單前會觸發, onclick是按鈕等控制元件使用, 用來觸發點選事件。 在提交表單前,一般都會進行資料驗證,可以選擇在submit按鈕上的onclick中驗證,也可以在onsubmit中驗證。 但是onclick比ons

form提交之Ajax版和常用版區別和聯絡。

使用Ajax方法實現form表單的提交 1.區別 聯絡 在使用form表單的時候,一旦點選提交觸發submit事件,一般會使得頁面跳轉,頁面間的跳轉等行為的控制權往往在後端的控制層,後端會控制頁面的跳轉及資料傳遞。 但是當不希望頁面跳轉或者是想要將控制權放

AJAX PHP無刷新form提交的簡單實現(推薦)

username mime win root 支持 對象 希望 meta {} 下面小編就為大家帶來一篇AJAX PHP無刷新form表單提交的簡單實現(推薦)。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧 ajax.php <

form提交的兩種方式

btn border 前端 () input onclick sub 輸入 判斷 1.當輸入用戶名和密碼為空的時候,需要判斷。這時候就用到了校驗用戶名和密碼,這個需要在jsp的前端頁面寫;有兩種方法,一種是用submit提交。一種是用button提交。方法一:在jsp的前端

HTTP form提交數據(enctype="multipart/form-data" method="post")的服務端處理

keyword -s detail put form表單 表單提交 class eth ron 參考鏈接:http://blog.csdn.net/u010018421/article/details/52833346 <form action="fileUpload

jqPaginator分頁(ajax用法和form提交用法)

用法 () var meta lang 點擊 parse name back 一般使用方法 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8">