Need help sending ajax login request to server

Question

I am developing/upgrading front end for a running server, i have developed many operations except the login part which i'm stuck at right now. the previous front end login form sends following requests to the server. but i still couldn't figured out how to send those in my form. here is the original request data,

Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,/;q=0.8

Accept-Encoding: gzip, deflate

Accept-Language: en-US,en;q=0.9

Cache-Control: max-age=0

Connection: keep-alive

Content-Length: 84

Content-Type: application/x-www-form-urlencoded

Cookie: JSESSIONID=9C6A1F3E400407382561DA122E95EB43

Host: ec2-13-****************.com

Origin: http://***************compute.amazonaws.com

Referer: http://ec2-13-229-218-84.ap-southeast-1.*************/login.html

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/72.0.3626.81 Safari/537.36

-- followings are form data --

username: gtrsgtrs, password: 11100, ${_csrf.parameterName}: ${_csrf.token}

i need to send as the request data as above in my ajax. This is my ajax request

let userName=$('#userNameTextOfLogin').val();
let password=$('#passwordTextOfLogin').val();

let loginData={
    "username": userName,
    "password": password,
    "${_csrf.parameterName}": "${_csrf.token}" //no idea about this
};

$.ajax({
    url:loginUrl,
    dataType:"json",
    data:JSON.stringify(loginData),
    method:"POST",

    async:true,
    success:function (resp) {
        // location.href="../index.html";
        localStorage.setItem("unique_sessiom_id","32424");
        localStorage.setItem("username",userName);
        alert("Done "+resp);
    },
    error:function (resp) {
        alert("Error "+resp);
    }
});

i also get the same response code as the previous form (Status Code: 302) but the response is an error in ajax.
header{} doesn't work as i also tried to send those in header{} in ajax but when i add header it responses fail status code with invalid cors request.

i also get following error message in console :-

Access to XMLHttpRequest at 'http://ec2-13-229-218-84.ap-southeast-1.compute.am*********/perform_login' from origin 'http://localhost:63342' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

You send the data as Json, but data type is 'text/html'?? Change the data type to json and ContentType to application/json — Ayan_84, Feb 06 '19 at 04:41
@Ayan_84 tried also but no luck. my error is, Access to XMLHttpRequest at 'http://ec2-13-229-218-84.ap-southeast-1***/perform_login' from origin 'http://localhost:63342' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. — Tharindu Eranga, Feb 06 '19 at 04:53
Cross Origin Policy may be your barrier, please see following link and if not solved , try more on this regard https://stackoverflow.com/questions/12458444/enabling-cross-origin-resource-sharing-on-iis7 — Ayan_84, Feb 06 '19 at 05:09

score 0 · Answer 1 · answered Feb 06 '19 at 05:01

0

Have you try below one

var userName=$('#userNameTextOfLogin').val();
var password=$('#passwordTextOfLogin').val();

var loginData={
    "username": userName,
    "password": password,
    "${_csrf.parameterName}": "${_csrf.token}" //no idea about this
};

$.ajax({
    type:"POST",
    url:loginUrl,
    data:JSON.stringify(loginData),
    dataType:"json",     
    async:true,
    success:function (resp) {
        // location.href="../index.html";
        localStorage.setItem("unique_sessiom_id","32424");
        localStorage.setItem("username",userName);
        alert("Done "+resp);
    },
    error:function (resp) {
        alert("Error "+resp);
    }
});

answered Feb 06 '19 at 05:01

Elango Sengottaiyan

166
1
2
13

my error is, Access to XMLHttpRequest at 'ec2-13-229-218-84.ap-southeast-1***/perform_login' from origin 'localhost:63342' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. – Tharindu Eranga Feb 06 '19 at 05:24
Add this Line in your Code - header('Access-Control-Allow-Origin: *'); – Elango Sengottaiyan Feb 06 '19 at 05:32

Need help sending ajax login request to server

1 Answers1