如何在同一个html页面上进行多个ajax调用?

时间:2014-12-01 07:59:12

标签: php html ajax html5 apache

我有以下html页面欢迎用户。我打算一次调用/ register一次,然后通过ajax调用进行/ login一次。但是当这个页面呈现时,单击按钮不会执行任何操作,甚至不会调用showdata()和reg_user()函数。可能是什么问题呢? Chrome开发人员工具说明如下

  

XMLHttpRequest无法加载https://127.0.0.1/login。没有   请求中存在“Access-Control-Allow-Origin”标头   资源。因此,不允许来源“http://127.0.0.1”访问。

但我没有进行任何跨域调用。毕竟我正在调用同一个localhost域。请说明发生了什么。我正在服务器上运行Apache / Ubuntu / PHP

<html>
<title> Welcome </title>
<script>
function makeRequestObject(){
   var xmlhttp=false;
   try {
      xmlhttp = new ActiveXObject('Msxml2.XMLHTTP');
   } catch (e) {
      try {
         xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
      } catch (E) {
         xmlhttp = false;
      }
   }
   if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
      xmlhttp = new XMLHttpRequest();
   }
   return xmlhttp;
}

function showdata()
{
   alert("show data called");
   var xmlhttp=makeRequestObject();
   var user=document.getElementById('user_name').value;
   var pass=document.getElementById('password').value;
   var url = 'https://127.0.0.1/login';
   var params = 'uname='+user+'&'+'pass='+pass;

   xmlhttp.open('POST', url, true);
   xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

   xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status == 200) {
         var content = xmlhttp.responseText;
         if( content ){
            document.getElementById('userdiv').innerHTML = content;
         }
      }
   }
   xmlhttp.send(params);
}
function reg_user()
{
   alert("reg_user called");
   var xmlhttp=makeRequestObject();
   var user=document.getElementById('reg_username').value;
   var pass=document.getElementById('reg_password').value;
   var url = 'https://127.0.0.1/register';
   var params = 'uname='+user+'&'+'pass='+pass;

   xmlhttp.open('POST', url, true);
   xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"$

   xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status == 200) {
         var content = xmlhttp.responseText;
         if( content ){
            document.getElementById('regdiv').innerHTML = content;
         }
      }
   }
   xmlhttp.send(params);
}
</script>
<body>
Enter user name : <input type="text" id="user_name" /><br/>
Enter your password : <input type="text" id="password"/><br/>
<input type="button" onclick="showdata()" value="Submit"><br/><br/>
<div id="userdiv">
</div>
<br />
Registration
<br />
Enter user name: <input type="text" id="reg_username" /><br/>
Enter your password : <input type="text" id="reg_password"/><br/>
<input type="button" onclick="reg_user()" value="Submit"><br/><br/>
<div id="regdiv">
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

您收到的错误是由CORS验证引起的。确保服务器https://127.0.0.1/根据CORS规范设置正确的HTTP响应头。​​