1. 程式人生 > >http常見的form表單請求方式

http常見的form表單請求方式

      在Web開發中,我們使用的比較多的HTTP請求方式基本上就是GET、POST。

一、http請求常見的表單檔案上傳形式

     首先了解下application/x-www-form-urlencoded和multipart/form-data的區別:

  • application/x-www-form-urlencoded:是常用的表單發包方式,普通的表單提交,或者js發包,預設都是通過這種方式。
<form enctype="application/x-www-form-urlencoded" action="http://" method="POST">
    <input type
=
"text" name="name" value="homeway"> <input type="text" name="key" value="nokey"> <input type="submit" value="submit"> </form

      當action為get時候,瀏覽器用x-www-form-urlencoded的編碼方式把form資料轉換成一個字串(name1=value1&name2=value2…),然後把這個字串append到url後面,用?分割,載入這個新的url。
     當action為post時候

,瀏覽器把form資料封裝到http body中,然後傳送到server(伺服器)。

  • multipart/form-data
    如果沒有 type=file 的控制元件,form表單會自動form的enctype屬性為編碼方式預設的 application/x-www-form-urlencoded
    如果有 type=file 的話,就要用到 multipart/form-data 了。瀏覽器會把整個表單以控制元件為單位分割,併為每個部分加上Content-Disposition(form-data或者file)、Content-Type(預設為text/plain)、name(控制元件name)等資訊,並加上分割符(boundary)。

二、更加詳細的Form表單請求

   Form表單請求,一般常用的是Get和Post提交方式,

  • Get方式提交
    表單內容
<form action="user/login.do" method="get" >  
    使用者名稱:<input type="text" name="username"><br>  
    密碼:<input type="text" name="password"><br>  
    <input type="submit" value="登入"/>  
</form>  
  • Post方式提交

   Post提交方式,Form表單有兩種enctype型別:

   1、enctype=”application/x-www-form-urlencoded”

   也是預設的提交型別,一般針對文字請求引數,不含附件。比如

<form action="user/login.do" method="post" >  
    使用者名稱:<input type="text" name="username"><br>  
    密碼:<input type="text" name="password"><br>  
    <input type="submit" value="登入"/>  
</form>  

   提交表單時的Http請求如下:

POST http://localhost:8080/springmvc/user/login.do HTTP/1.1  
Host: localhost:8080  
Connection: keep-alive  
Content-Length: 33  
Cache-Control: max-age=0  
Origin: http://localhost:8080  
Upgrade-Insecure-Requests: 1  
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36  
Content-Type: application/x-www-form-urlencoded  
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8  
Referer: http://localhost:8080/springmvc/  
Accept-Encoding: gzip, deflate  
Accept-Language: zh-CN,zh;q=0.8  

username=xiaoming&password=123456789  

   訊息頭中的Content-Type: application/x-www-form-urlencoded
   訊息體中內容以key=value的形式拼接
username=xiaoming&password=123456789
   2、enctype=”multipart/form-data”

   需要上傳附件時,必須為”multipart/form-data”。**,比如

<form action="user/login.do" method="post" enctype="multipart/form-data">  
    使用者名稱:<input type="text" name="username"><br>  
    密碼:<input type="text" name="password"><br>  
    上傳檔案:<input type="file" name="uploadFile"/><br>  
    <input type="submit" value="登入"/>  
</form>  

   提交表單時,Http請求協議如下:

POST http://localhost:8080/springmvc/user/login.do HTTP/1.1  
Host: localhost:8080  
Connection: keep-alive  
Content-Length: 400  
Cache-Control: max-age=0  
Origin: http://localhost:8080  
Upgrade-Insecure-Requests: 1  
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36  
Content-Type: multipart/form-data; boundary=----WebKitFormBoundarykALcKBgBaI9xA79y  
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8  
Referer: http://localhost:8080/springmvc/  
Accept-Encoding: gzip, deflate  
Accept-Language: zh-CN,zh;q=0.8  

------WebKitFormBoundarykALcKBgBaI9xA79y  
Content-Disposition: form-data; name="username"  

xiaoming 
------WebKitFormBoundarykALcKBgBaI9xA79y  
Content-Disposition: form-data; name="password"  

123456789  
------WebKitFormBoundarykALcKBgBaI9xA79y  
Content-Disposition: form-data; name="uploadFile"; filename="file.txt"  
Content-Type: text/plain  

檔案中的內容       
------WebKitFormBoundarykALcKBgBaI9xA79y--  

   請求訊息頭中, Content-Type: multipart/form-data; boundary=- - - -WebKitFormBoundarykALcKBgBaI9xA79y
boundary為分隔符.
   訊息體中的每個引數都會以“- -”+boundary 隔開,最後一個分隔符末尾需要加”- -“,即”- -“+boundary+”- -“

相關推薦

http常見form請求方式

      在Web開發中,我們使用的比較多的HTTP請求方式基本上就是GET、POST。 一、http請求常見的表單檔案上傳形式      首先了解下application/x-www-for

Http 工具類 連線池 多中請求方式 HttpClient4 Util 引數 XML請求 json 請求 form 請求

import com.google.common.base.Strings; import com.google.common.collect.Lists; import org.apache.http.*; import org.apache.http.client.co

form提交方式 以及 HTTP 405 錯誤 – 方法不被允許 (Method not allowed)

form表單提交方式:參考http://www.anyrt.com/blog/list/submit.htmlHTTP 405 錯誤:參考https://www.cnblogs.com/pinocchioatbeijing/articles/2375139.html

form提交方式

通過 element tar throws -s mit puts ext success form表單提交方式 無刷新頁面提交表單 表單可實現無刷新頁面提交,無需頁面跳轉,如下,通過一個隱藏的iframe實現,form表單的target設置為iframe的

form提交方式實現瀏覽器導出Excel

The 下載到本地 ajax請求 形式 html iso ont ear 發現 剛開始使用ajax做Excel導出,發現ajax做不了瀏覽器導出只能下載到本地,於是用form提交可以提供瀏覽器下載Excel。 1>用ajax做本地下載:   FileOutputStr

formGet方式提交時,action中帶引數傳遞不了

form表單get方式提交時,action中帶引數傳遞不了 樣例: <form action="getPostServlet/getPost.do?param4=param4" method="get"> <input type="hidden" name="p

HttpClient 4 3 6 使用MultipartEntityBuilder實現類似form提交方式的檔案上傳

分享一下我老師大神的人工智慧教程!零基礎,通俗易懂!http://blog.csdn.net/jiangjunshow 也歡迎大家轉載本篇文章。分享知識,造福人民,實現我們中華民族偉大復興!        

form提交方式上傳圖片到伺服器

springMVC為檔案上傳提供了直接的支援,這種支援是通過MultipartResolver實現的,實現類為CommonsMultipartResovler. 依賴:commons-fileupload-1.2.jar     commons-io-1.

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

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

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

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

nodejs-httpform上傳檔案資料的解析過程

前幾天碰到了一個需求,允許接收前端使用者上傳的檔案。 當時為了解決問題索性就上github搜了下,找了一個基於nodejs的開發外掛。 後來功能實現後覺得意猶未盡,於是自己想試試去寫一個類似功能的外掛,方便以後拓展,然後就這麼開始了。 先來說說應用層的ht

Multipart/form-data POST檔案上傳詳解 理論 簡單的HTTP POST 大家通過HTTP向伺服器傳送POST請求提交資料,都是通過form提交的,程式碼如下:

Multipart/form-data POST檔案上傳詳解 理論 簡單的HTTP POST 大家通過HTTP向伺服器傳送POST請求提交資料,都是通過form表單提交的,程式碼如下: <form method="post"action="http://w.soh

利用 ajax自定義Form請求方式

異步 opened isp () oca 路徑 表單 fault orm 需求場景:有時候單純的form表單無法向後端傳遞額外的參數 比如需要action傳遞js異步生成的參數 ,form表單默認的action就無法滿足需求,這時就需要我們自定義form表單的提交方式。

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

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

關於請求方式為GET的form,action屬性後不能帶引數的問題

  若在頁面中有如下程式碼: <form action="XXX?name=Jack&age=10"> <input type="text" name="address"

使用ajax提交form,包括ajax文件上傳 轉http://www.cnblogs.com/zhuxiaojie/p/4783939.html

ima option img jquery選擇器 open request resp logs ges 使用ajax提交form表單,包括ajax文件上傳 前言 使用ajax請求數據,很多人都會,比如說: $.post(path,{data:data},function

瀏覽器原生 form POST 數據的兩種方式

mes 但是 lba lose -s ipa mvm 默認 字串 我們在提交表單的時候,form表單參數中會有一個enctype的參數。enctype指定了HTTP請求的Content-Type。 常用有兩種:application/x-www-form-urlencod

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

【轉載】form的兩種提交方式,submit和button的用法

按鈕 type ssid login false tex .get ons 轉載 1.當輸入用戶名和密碼為空的時候,需要判斷。這時候就用到了校驗用戶名和密碼,這個需要在jsp的前端頁面寫;有兩種方法,一種是用submit提交。一種是用button提交。方法一:在jsp的前端