夏日博客

A-A+

Ajax POST方式发送请求服务器接收不到数据问题解决办法

2016年01月27日 前端设计 暂无评论 阅读 9 views 次

文章总结了关于Ajax POST方式发送请求服务器接收不到数据问题解决办法 有需要学习的朋友可参考本文章。

直接看源码,代码如下:

  1. <script language="javascript">  
  2.    function setViewPoint() {  
  3.     var msg =""; //用于接收返回数据  
  4.     //实例化Ajax  
  5.     var leeAjax = leeInitAjax();  
  6.     var webRoot = window.location;  
  7.     webRoot = webRoot.toString();  
  8.     var domain = webRoot.substring(7);  
  9.     var endD = domain.indexOf("/");  
  10.     domain = domain.substring(0,endD);  
  11.     //接收表单的URL地址  
  12.     var url = "http://"+domain+"/plus/leeGetViewForWay.php";  
  13.     //通过Post方式打开连接  
  14.     leeAjax.open("POST", url, true);  
  15.     //定义传输的文件HTTP头信息  
  16.     leeAjax.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=gbk");  
  17.     //需要POST的值，把每个变量都通过&来联接  
  18.     //发送POST数据  
  19.     var postStr = "viewId='asdf'&id='asdfa'"  
  20.     leeAjax.send(postStr);//获取执行状态     
  21.     leeAjax.onreadystatechange = function() {  
  22.      //如果执行状态成功，那么就把返回信息写到指定的层里  
  23.      if (leeAjax.readyState == 4 && leeAjax.status == 200) {  
  24.       msg = leeAjax.responseText;//获取的返回值  
  25.       alert(msg);  
  26.      }  
  27.     }  
  28.    }    
  29.    function leeInitAjax() {  
  30.     var leeAjax=false;   
  31.     try{  
  32.      if( window.ActiveXObject ){   
  33.       for( var i = 5; i; i-- ){   
  34.        try{   
  35.         if( i == 2 ){   
  36.          leeAjax = new ActiveXObject( "Microsoft.XMLHTTP" );   
  37.         } else {  
  38.          leeAjax = new ActiveXObject( "Msxml2.XMLHTTP." + i + ".0" );   
  39.         }        
  40.         break;  
  41.        } catch(e) {   
  42.         leeAjax = false;   
  43.        }  
  44.       }  
  45.      } else if( window.XMLHttpRequest ) {  
  46.       leeAjax = new XMLHttpRequest();   
  47.       if (leeAjax.overrideMimeType) {   
  48.        leeAjax.overrideMimeType('text/xml');   
  49.       }  
  50.      }  
  51.     } catch(e) {  
  52.      leeAjax = false;   
  53.     }    
  54.     return leeAjax;  
  55.    }  
  56.   </script>  

php 代码如下:

  1. <?php  
  2. $a = $_REQUEST ["viewId"].")___(".$_REQUEST["id"];  
  3. if($_POST ["viewId"]=="") $a .= "<br/>___";  
  4. echo $a;  
  5. ?>  

于是在构建发送数据时由字符串改成了JS对象,可是还是不行,只好查资料了,原来是要设置一下发送数据的编码类型的,代码如下:

  1. var Myquery = Myinput();   
  2.    
  3. xmlhttp.open("POST","post.php",true);   
  4.    
  5. xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");    
  6.    
  7. xmlhttp.onreadystatechange = byphp;  

xmlhttp.send(Myquery);application/x-www-form-urlencoded编码类型是表单发送数据的默认编码类型，想不到在AJAX请求中要明确注明，这样添加了第三行的代码注明格式后果然就正确了，问题解决。如果通过JQUERY发送POST方式的AJAX请求就方便多了，不用添加这一行。再一次感受到了JQUERY的强大和便捷。

想用POST发送Ajax异步请求，就要把你的数据统一放在send()方法中发送，而不能是send(null),代码如下:

Xml.setRequestHeader('Content-Type','application/x-www-form-urlencoded');

这一句在GET方式中不要写，但是在POST方式中是必须的，由于你在POST方式中用了send(null)，导致没有发送任何数据到index1.php，所以看不到这一句的效果。

get('index1.php?c=1',a)"

get('index1.php?c=2',a)"

两个按钮发送的数据只有c这个参数不同,所以可以把index1.php和a都写在你这个get方法的内部,修改以后的get方法是这样的,代码如下:

  1. function get(num)  
  2. {  
  3. data="index1.php?";  
  4. if(Xml){  
  5.  var obj=document.getElementById("a");  
  6.  Xml.open("POST",data);  
  7.  Xml.onreadystatechange=function()  
  8.  {  
  9.   if(Xml.readyState==4&&Xml.status==200){  
  10.    obj.innerHTML=Xml.responseText;  
  11.   }  
  12.  }  
  13.  Xml.setRequestHeader("Content-Type","application/x-www-form-urlencoded");  
  14.  var queryString="c="+num;  
  15.  Xml.send(queryString);  
  16.  }  
  17. }  

当然如下代码:

get('index1.php?c=1',a)"

get('index1.php?c=2',a)"

也要相应的改成

get(1);

get(2);
这样就可以成功地用POST方法向服务器异步请求数据了.

标签：

给我留言