I have the following html page welcoming the user. I intend to make one call to /register once and then to /login once through ajax calls. But when this page renders, clicking the buttons does nothing and the functions showdata() and reg_user() are not even called. What could be the problem? Chrome developer tool says the following
XMLHttpRequest cannot load https: //127.0.0.1/login. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http: //127.0.0.1' is therefore not allowed access.
But I am not making any Cross domain calls. I'm calling to the same localhost domain after all. Please elucidate what is going on. I'm runnning Apache/Ubuntu/PHP on the server
<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>
