0

I have a login page in html and i have used a Js function to call the api. The code is 

function submitdetails() {
    var username = document.getElementById("username").value;
    var password = document.getElementById("password").value;
    var params = JSON.stringify({ username: username, password: password });
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == XMLHttpRequest.DONE ) {
            if (xmlhttp.status == 200){ 
                if(xmlhttp.responseText == "AdminLogin"){
                            // Redirect Url to Ldap Configuration settings page
                            window.location.href = "Configure.html";
                }else{
                     var cook = document.cookie;
                    document.getElementById("login_form").innerHTML = xmlhttp.responseText;
                    //document.getElementById("login_form").innerHTML = cook

                }
            }
                else{
                    document.getElementById("login_form").innerHTML = "Error"; 
                }
            }
        };
        xmlhttp.open("POST","http://127.0.0.1:8000/login/",true);     
        xmlhttp.send(params);
    }

The above code works perfectly fine in IE . But when i try it in Chrome , the fucntion return's to "else statement" which returns error in it.

Pravin Bhasker
  • 95
  • 3
  • 13
  • What error? That's kind of important. – Carcigenicate Jan 29 '17 at 13:16
  • Chrome has a very nice Javascript debugger, you should try using it. [Here](https://developers.google.com/web/tools/chrome-devtools/javascript/) a tutorial. – xzoert Jan 29 '17 at 13:20
  • you're getting the error because xmlhttp.status does not equal 200. before solving the issue we should know what's happening. add console.log(xmlhttp.status) in the else that contains the error. and toggle console and see what the status is – Maher Fattouh Jan 29 '17 at 13:23
  • I think it's working on IE and not chrome because of some security whole that chrome fixed years ago and IE did not. Check the console it's probably saying exactly that. – ibrahim mahrir Jan 29 '17 at 13:26
  • "No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access." This is what i am getting in the console – Pravin Bhasker Jan 29 '17 at 13:26
  • This code is it runnig from `http://localhost/..` or from `file://...`? – ibrahim mahrir Jan 29 '17 at 13:29
  • looks like a security issue. see here : http://stackoverflow.com/questions/20035101/no-access-control-allow-origin-header-is-present-on-the-requested-resource – Maher Fattouh Jan 29 '17 at 13:29

1 Answers1

0

Seem this is a CORS problem. Your backend have may an entry like this:

Access-Control-Allow-Origin: *

This work well on IE but not on Firefox and Chrome.

Firefox and Chrome require exact domain specification in Access-Control-Allow-Origin header. For servers with authentication, these browsers do not allow "*" in this header. The Access-Control-Allow-Origin header must contain the value of the Origin header passed by the client.

So you have to adjust your backend CORS settings. Here the header definitions for CORS from MDM

Jan Franta
  • 1,691
  • 2
  • 16
  • 25