post及get请求区别

1.ajax-get请求

 1 <script type="text/javascript">
2 function ajax(){
3 var XHR=null;
4
5 //第一步:创建XMLHttpRequest对象
6 if (window.XMLHttpRequest) {
7 XHR = new XMLHttpRequest(); // 非IE内核:IE7+, Firefox, Chrome, Opera, Safari
8 } else if (window.ActiveXObject) {
9 XHR = new ActiveXObject("Microsoft.XMLHTTP"); // IE内核:IE6, IE5
10 } else {
11 XHR = null;
12 }
13
14 //第二步:发送请求
15 if(XHR){
16 XHR.open("GET", "/test/ajax"); //"/test/ajax"test为项目名称、ajax为方法名称
17
18 //第三步:
19 XHR.onreadystatechange = function () {
20 // readyState值说明
21 // 0,初始化,XHR对象已经创建,还未执行open
22 // 1,载入,已经调用open方法,但是还没发送请求
23 // 2,载入完成,请求已经发送完成
24 // 3,交互,可以接收到部分数据,因为相应及http头不全,这时通过responseText获取部分数据会出现错误
25 // 4,数据接收完成,此时可以通过responseText获取完整的数据
26
27 // status值说明
28 // 200:成功
29 // 404:没有发现文件、查询或URl
30 // 500:服务器产生内部错误
31 if (XHR.readyState == 4 && XHR.status == 200) { //注①
32 // 这里可以对返回的内容做处理
33 // 一般会返回JSON或XML数据格式
34 console.log("XHR.responseText–>"+XHR.responseText);
35 // 主动释放,JS本身也会回收的
36 XHR = null;
37 }
38 };
39 XHR.send();
40 }
41 }
42 </script>

2.ajax-post请求

 1 <script type="text/javascript">
2 function ajax(){
3 var XHR=null;
4
5 //第一步:创建XMLHttpRequest对象
6 if (window.XMLHttpRequest) {
7 XHR = new XMLHttpRequest(); // 非IE内核:IE7+, Firefox, Chrome, Opera, Safari
8 } else if (window.ActiveXObject) {
9 XHR = new ActiveXObject("Microsoft.XMLHTTP"); // IE内核:IE6, IE5
10 } else {
11 XHR = null;
12 }
13
14 //第二步:发送请求
15 if(XHR){
16 XHR.open("POST", '1.php?='+Math.random(),true); //"/test/ajax"test为项目名称、ajax为方法名称
17
18 //第三步:设置Content-Type
19 XHR.setRequestHeader("Content-type","application/x-www-form-urlencoded");
20
21 //第四步:
22 XHR.onreadystatechange = function () {
23 // readyState值说明
24 // 0,初始化,XHR对象已经创建,还未执行open
25 // 1,载入,已经调用open方法,但是还没发送请求
26 // 2,载入完成,请求已经发送完成
27 // 3,交互,可以接收到部分数据,因为相应及http头不全,这时通过responseText获取部分数据会出现错误
28 // 4,数据接收完成,此时可以通过responseText获取完整的数据
29
30 // status值说明
31 // 200:成功
32 // 404:没有发现文件、查询或URl
33 // 500:服务器产生内部错误
34 if (XHR.readyState == 4 && XHR.status == 200) { //注①
35 // 这里可以对返回的内容做处理
36 // 一般会返回JSON或XML数据格式
37 console.log("XHR.responseText–>"+XHR.responseText);
38 // 主动释放,JS本身也会回收的
39 XHR = null;
40 }
41 };
42 XHR.send('name=mino&age=25');
43 }
44 }
45 </script>

get和post请求的区别

  1. 使用Get请求时,参数在URL中显示,而使用Post请求,则不会显示出来;
  2. post请求必须设置xhr.setRequestHeader( “Content-Type”, “application/x-www-form-urlencoded” ); 否则服务器端收不到参数
  3. Post传输的数据量大,可以达到2M,而Get方法由于受到URL长度的限制,只能传递大约1024字节
  4. Get请求请求需注意缓存问题,Post请求不需担心这个问题;

返回
顶部