GET 和 POST 是进行 HTTP 请求和在请求中传递变量的两种方法。开发人员不应当随意选择使用哪种方法,因为两种方法都有使用意义。GET 请求把变量嵌在 URL 中,这意味着它们是可以加书签的。如果变量可能会修改数据库、购买商品或者做其他类似操作,这种方法会有副作用。假设偶然间加了书签的页面有一个购买商品的 URL ,里面包含地址、信用卡号以及 $100 的产品,全都嵌在 URL 中,那么重新访问这个 URL 就意味着购买这件商品。
所以,只有在变量没有副作用,可以经常重新载入也不会发生什么的时候,才可以进行 GET 请求。适合 GET 请求的一个变量可能是分类 ID。可以反复重新载入,分类会反复显示,但是没有任何累积的效果。
在另一方面,当变量对源(例如数据库)有作用时或者为了个人信息安全,应当采用 POST 请求。比如在购买一件 $100 的产品时,应当用POST 请求。如果给付款页面加了书签,由于 URL 中没有变量,所以什么也不会发生,也不会意外地购买了不想购买的东西,或者在已经拥有的情况下又买了一次。
GET 和 POST 的意义在 Ajax 中有同样的作用。在构建本文的应用程序和未来的应用程序时,理解 GET 和 POST 请求的差异是很重要的。这会有助于避免 Web 应用程序开发的常见缺陷。此段转载自:http://blog.sina.com.cn/s/blog_4a1111ba0100056a.html
例子:
HTML页面,是一个手机号码INPUT输入框,通过onkeyup事件调用getnum()函数,然后通过AJAX将手机号码提交到服务器端,服务器将接到的号码回应给浏览器端,javascript获取到值之后,改写DIV元素的innerHTML值。
GET方法:
<html> <head> <style type="text/css"> div{font-size:5em;background-color:green;width:1000px;} </style> <script src="num.js" ></script> </head> <body> 请输入你的手机号码: <input id="num" onkeyup="getnum(this.value)" maxlength='11' /><br/> 请核对输入: <div id="responsetext"></div> </body> </html>
num.js文件
var xmlHttp; function getnum(num)//页面INPUT元素的onkeyup事件调用的函数 { xmlHttp=createXMLHttp() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return; } var url="check.PHP"; url=url+"?q="+num; url=url+"&sid="+Math.random();//在URL后面添加随机数,使每次提交的url不同,避免浏览器读取的服务器响应是缓存值 xmlHttp.onreadystatechange=act;//设置当readyState状态改变时执行的callback函数。 xmlHttp.open("GET",url,true);//建立与服务器端的资源链接 xmlHttp.send(null); } function act() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("responsetext").innerHTML=xmlHttp.responseText //利用服务器响应值responseText改写HTML页面内容 } } function createXMLHttp()//创建XMLHttpRequest对象 { var xmlHttp=null; try { // Firefox,Opera 8.0+,Safari xmlHttp=new XMLHttpRequest(); } catch (e) { // Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; }
<?PHP $num=$_GET["q"];//获取浏览器javascript的XMLHttpRequest对象通过GET方法传来的参数。 echo $num;//echo语句输出的值传回到浏览器端,通过XMLHttpRequest对象的responseText属性接收。 ?>
POST方法:
主要是javascript种的XMLHttpRequest的请求方式改变了。同时服务器PHP程序端是通过$_POST[ ]获取参数。
function getnum(num)//页面INPUT元素的onkeyup事件调用的函数 { xmlHttp=createXMLHttp() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return; } var url="check.PHP"; xmlHttp.onreadystatechange=act;//设置当readyState状态改变时执行的callback函数。 xmlHttp.open("POST",true);//open()函数第一次method参数改为POST,url只包含服务器文件路径,参数在send()函数中传递 xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//必须设置HTTP请求头格式 xmlHttp.send("q="+num);//请求参数send()发送 }