http常見的form表單請求方式

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

1、http請求常見的表單文件上傳形式
    首先了解下application/x-www-form-urlencoded和multipart/form-data的區別：

<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>

    application/x-www-form-urlencoded：
        是經常使用的表單發包方式，普通的表單提交，或者js發包，默認都是經過這種方式。當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)。

 

2、更加詳細的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> 

    Get方式提交，最後以http://localhost:8080/springmvc/user/login.do?username=xiaoming&password=123456789 請求服務器。

  Post方式提交
    Post提交方式，Form表單有兩種enctype類型：
    
    一、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

    二、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+」- -「