關於post和get傳遞引數的區別
當我們不通過重新載入頁面,用Ajax訪問伺服器的時候,有兩個選擇可以將請求資訊傳送到伺服器上。這兩個選擇分別是GET和POST。
在把請求資訊傳送到伺服器上以載入新的頁面時,這兩個選擇有兩個不同之處。第一個區別是你是請求了資訊的一小部分而不是整個頁面。第二個區別也是最明顯的區別是由於Ajax請求不會出現在位址列中,因此當傳送請求時,在訪問者的螢幕上是看不出什麼異同的。使用GET生成呼叫不會暴露域和它們的值,使用POST也不會暴露。因此,我們要怎樣在這兩者之間作出選擇呢?
初學者可能犯的一個錯誤是對於大多數的呼叫都使用GET命令,僅僅因為這一命令相對而言更容易編寫。GET與POST呼叫之間最顯著的差異是當發出載入新頁面請求時,GET呼叫對於同樣數量的資料有著相同的限制。唯一的區別是你處理的少量的Ajax請求資料,而你並不想通過這種長度執行的限制來完成頁面的載入。初學者可能會在少數情況下,如他們確實需要傳送更多資訊時,使用POST。
當我們有大量資料要傳送時最好的辦法是一次發出多個只傳遞少量資訊的Ajax呼叫時。如果你正用一個Ajax呼叫傳送大量資料,那麼最好是結束這種做法,因為這樣做並不能節約時間。
因此,需要傳送大量資料能成為我們在GET和POST之間猶豫不決的理由嗎?這兩個方法都是為不同的目的而設計的,兩者的不同也在於其使用目的。這一說法不僅適用於GET和POST的使用,也適用於其他的方法。
GET的目的就如同其名字一樣是用於獲取資訊的。它旨在顯示出頁面上你要閱讀的資訊。瀏覽器會緩衝GET請求的執行結果,如果同樣的GET請求再次發出,瀏覽器就會顯示緩衝的結果而不是重新執行整個請求。這一流程不同於瀏覽器的處理過程,但是它是有意設計成這樣以使GET呼叫更有效率。GET呼叫會檢索要顯示在頁面中的資料,資料不會在伺服器上被更改,因此重新請求相同資料的時候會得到相同的結果。
POST方法應該用於你需要更新伺服器資訊的地方。如某呼叫要更改儲存在伺服器上的資料,而從兩個同樣的POST呼叫返回的結果或許會完全不同,因為第二個POST呼叫的值與第一個的值不相同,這是由於第一個呼叫已經更新了其中一些值。POST呼叫通常會從伺服器上獲取響應而不是保持前一個響應的緩衝。
因此,不要用資料的量來決定是要選擇GET還是POST,而應該按照目的在兩者間作出選擇。如果呼叫是要檢索伺服器上的資料則使用GET。如果要檢索的值會隨時間和更新程序的改變而改變則要在GET呼叫中新增一個當前時間引數,這樣後面的呼叫才不會使用先前的不正確的緩衝。如果呼叫是向伺服器上傳送任意資料,就可以使用POST。
事實上,我們不應該不僅僅只將這個標準作為選擇怎樣使用GET和POST呼叫的標準,在處理頁面處理形式的時候也可以將它作為取捨這兩個呼叫的標準。
Get 與 Post 的區別
Ajax中我們經常用到get和post請求.那麼什麼時候用get請求,什麼時候用post方式請求呢? 在做回答前我們首先要了解get和post的區別。
- get是把引數資料佇列加到提交表單的ACTION屬性所指的URL中,值和表單內各個欄位一一對應,在URL中可以看到。post是通過HTTP post機制,將表單內各個欄位與其內容放置在HTML HEADER內一起傳送到ACTION屬性所指的URL地址。使用者看不到這個過程。
- 對於get方式,伺服器端用Request.QueryString獲取變數的值,對於post方式,伺服器端用Request.Form獲取提交的資料。兩種方式的引數都可以用Request來獲得。
- get傳送的資料量較小,不能大於2KB。post傳送的資料量較大,一般被預設為不受限制。但理論上,因伺服器的不同而異。
- get安全性非常低,post安全性較高。
- <form method="get" action="a.asp?b=b">跟<form method="get" action="a.asp">是一樣的,也就是說,method為get時action頁面後邊帶的引數列表會被忽視;而<form method="post" action="a.asp?b=b">跟<form method="post" action="a.asp">是不一樣的。
另外 Get請求有如下特性:它會將資料新增到URL中,通過這種方式傳遞到伺服器,通常利用一個問號?代表URL地址的結尾與資料引數的開端,後面的引數每一個數據引數以“名稱=值”的形式出現,引數與引數之間利用一個連線符&來區分。 Post請求有如下特性:資料是放在HTTP主體中的,其組織方式不只一種,有&連線方式,也有分割符方式,可隱藏引數,傳遞大批資料,比較方便。
通過以上的說明,現在我們大致瞭解了什麼時候用get什麼時候用post方式了吧,對!當我們在提交表單的時候我們通常用post方式,當我們要傳送一個較大的資料檔案時,需要用post。當傳遞的值只需用引數方式(這個值不大於2KB)的時候,用get方式即可。
現在我們再看看通過URL傳送請求時,get方式和post方式的區別。用下面的例子可以很容易的看到同樣的資料通過GET和POST來發送的區別,傳送的資料是 username=張三。
GET 方式,瀏覽器鍵入 http://localhost?username=張三
1 GET /?username=%E5%BC%A0%E4%B8%89 HTTP/1.1 2 Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword, */* 3 Accept-Language: zh-cn 4 Accept-Encoding: gzip, deflate 5 User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; .NET CLR 1.1.4322) 6 Host: localhost 7 Connection: Keep-Alive
POST 方式:
1 POST / HTTP/1.1 2 Accept: image/gif, image/x-xbitmap, image/jpeg, image/pjpeg, application/vnd.ms-powerpoint, application/vnd.ms-excel, application/msword, */* 3 Accept-Language: zh-cn 4 Content-Type: application/x-www-form-urlencoded 5 Accept-Encoding: gzip, deflate 6 User-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; .NET CLR 1.1.4322) 7 Host: localhost 8 Content-Length: 28 9 Connection: Keep-Alive 10 username=%E5%BC%A0%E4%B8%89
區別就是一個在 URL 請求裡面附帶了表單引數和值, 一個是在 HTTP 請求的訊息實體中。
比較一下上面的兩段文字, 我們會發現 GET 方式把表單內容放在前面的請求頭中, 而 POST 則把這些內容放在請求的主體中了, 同時 POST 中把請求的 Content-Type 頭設定為 application/x-www-form-urlencoded. 而傳送的正文都是一樣的, 可以這樣來構造一個表單提交正文: encodeURIComponent(arg1)=encodeURIComponent(value1)&encodeURIComponent(arg2)=encodeURIComponent(value2)&.....
注: encodeURIComponent 返回一個包含了 charstring 內容的新的 String 物件(Unicode 格式), 所有空格、標點、重音符號以及其他非 ASCII 字元都用 %xx 編碼代替,其中 xx 等於表示該字元的十六進位制數。 例如,空格返回的是 "%20" 。 字元的值大於 255 的用 %uxxxx 格式儲存。參見 JavaScript 的 encodeURIComponent() 方法.
在瞭解了上面的內容後我們現在用ajax的XMLHttpRequest物件向伺服器分別用GET和POST方式傳送一些資料。
1 var postContent ="name=" + encodeURIComponent("xiaocheng") + "&email=" 2 + encodeURIComponent("[email protected]"); 3 xmlhttp.open("GET", "somepage" + "?" + postContent, true); 4 xmlhttp.send(null);
POST 方式
1 var postContent ="name=" + encodeURIComponent("xiaocheng") + "&email=" 2 + encodeURIComponent("[email protected]"); 3 xmlhttp.open("POST", "somepage", true); 4 xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 5 //xmlhttp.setRequestHeader("Content-Type", "text/xml"); //如果傳送的是一個xml檔案 6 xmlhttp.send(postContent);
get方式
get方式是最為常見的,一般實現使用者登入,修改密碼用的都是get方式。
新建一html文件,body標籤內容如下:
1 <body style="text-align: center"> 2 <input type ="text" id ="txt" /> 3 <br /> 4 <input type ="button" value ="get方式回撥" onclick ="get()" /> 5 </body>
js程式碼檔案
1 var xhr=getXHR();//獲得xmlhttprequest物件,getXHR函式的具體實現這裡不給出,因為非常簡單 2 function get() 3 { 4 var str=document.getElementById ("txt").value; 5 var url="PageAjax.aspx?argument="+escape(str);//編碼str 6 xhr.open("get",url,true); 7 xhr.onreadystatechange=renew; 8 xhr.send(null);//不傳送任何內容,因為url中包含了引數資料 9 } 10 function renew() 11 { 12 if (xhr.readystate==4) 13 { 14 if (xhr.status==200) 15 { 16 var response=xhr.responsetext; 17 var res=response.split('\n'); 18 alert(res[0]); 19 } 20 } 21 }
伺服器端PageAjax.aspx.cs檔案程式碼如下
1 protected void Page_Load(object sender, EventArgs e) 2 { 3 if (Request["argument"] != null) 4 { 5 string res ="成功實現post方式回撥!傳入的引數是:"+ Request["argument"].ToString()+"\n"; 6 Response.Write(res); 7 } 8 }
到此一個簡單的get方式回撥完成。
post方式
由於get方式每次都要傳入引數到url地址上,像使用者名稱,密碼之類的引數由於字元比較少,完全可以考慮這中傳遞方式,但是當有很多引數、並且引數的字串值很長時(比如部落格,你不可能把整篇部落格的內容都以引數的方式傳遞到url上),這種方式就不好了,由於有了post方式的出現。
新建一html文件,body標籤內容如下:
1 <textarea id="TextArea1" style="width: 323px; height: 76px"></textarea> 2 <br /> 3 <input id="Button1" type="button" value="post方式回撥" onclick="post()" />
js程式碼檔案
1 var xhr=getXHR();//獲得xmlhttprequest物件,getXHR函式的具體實現這裡不給出,因為非常簡單 2 function post() 3 { 4 var str=document.getElementById ("TextArea1").value; 5 var poststr="arg="+str; 6 var url="PageAjax.aspx?time="+new Date();//加一時間戳,放置發回的資料是伺服器快取的資料 7 xhr.open("post",url,true); 8 xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); //告訴伺服器傳送的是文字 9 //xhr.setRequestHeader("Content-Type", "text/xml"); //告訴伺服器傳送的是一個xml檔案 10 xhr.onreadystatechange=update; 11 xhr.send(poststr);//傳送poststr資料到伺服器 12 } 13 function update() 14 { 15 if (xhr.readystate==4) 16 { 17 if (xhr.status==200) 18 { 19 var response=xhr.responsetext; 20 var res=response.split('\n'); 21 alert(res[0]); 22 } 23 } 24 }
伺服器端PageAjax.aspx.cs檔案程式碼如下
1 protected void Page_Load(object sender, EventArgs e) 2 { 3 if (Request["arg"] != null) 4 { 5 string res = "成功實現get方式回撥!傳入的引數是:" + Request["arg"].ToString() + "\n"; 6 Response.Write(res); 7 } 8 }
到此一個簡單的post方式回撥完成。
Get 與 Post 的程式碼編寫上的區別
1 ....... 2 function createQueryString(){ 3 var firstName = document.getElementById("firstName").value; 4 var secName = document.getElementById("secName").value; 5 6 var querystring="firstName="+firstName+"&secName="+secName; 7 } 8 9 10 //GET方式 11 function doRequestUsingGET(){ 12 createXMLHttpRequest(); 13 var queryString = "test.php?"; 14 queryString= queryString + createQueryString()+"&timstamp="+new Date().getTime(); 15 Ajax.onreadystatechange=handleStateChange; 16 Ajax.open("GET",queryString,true); 17 Ajax.send(null); 18 19 } 20 21 //POST方式 22 function doRequestUsingPOST(){ 23 createXMLHttpRequest(); 24 25 /* 注意以下程式碼與GET方式的區別 */ 26 var url= "test.php?timstamp="+new Date().getTime(); 27 // POST 需要定義傳送的字串 28 var queryString=createQueryString(); 29 Ajax.open("POST",url,true); 30 Ajax.onreadystatechange=handleStateChange; 31 // POST 需要設定請求頭部 32 Ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded") 33 // 引數不為 null 34 Ajax.send(queryString); 35 36 } 37 38 function handleStateChange(){ 39 if(Ajax.readyState==4){ 40 if(Ajax.status==200){ .......} //成功資料其它資料 41 } 42 43 } 44 ......
本文來自學習小花,作者:aixuexi666888,轉載請註明原文連結:https://www.cnblogs.com/aixuexi666888/p/15595279.html