How Do I Retrieve Cookie from XMLHttpRequest? - php

Question

I have a javascript code to get username from a php file. The javascript code is not in the same domain, so it is cross-domain. In this case, domain1.com want to retrieve user information from domain2.com by using XMLHttpRequest. Here is the code
var http = new XMLHttpRequest();
http.open("POST", linkbased+'/username/', true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
document.getElementById("username").innerHTML = http.responseText;
}
}
http.send(data);
Here is my php file code
<?php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST');
echo $_COOKIE['username'];
?>
If I access the php code directly, it will show the username. However, if I access it via XMLHttpRequest. It won't read the username. Is there something part am I missing?

Answer 1

From MDN
Credentialed requests
Credentialed Access Control Requests – that is, requests that are
accompanied by Cookies or HTTP Authentication information (and which
expect Cookies to be sent with responses) – can be either Simple or
Preflighted, depending on the request methods used.
In a Simple Request scenario, the request will be sent with Cookies
(e.g. if the withCredentials flag is set on XMLHttpRequest). If the
server responds with Access-Control-Allow-Credentials: true attached
to the credentialed response, then the response is accepted by the
client and exposed to web content. In a Preflighted Request, the
server can respond with Access-Control-Allow-Credentials: true to the
OPTIONS request.
So you might need to alter your code - the below is not tested however
var http = new XMLHttpRequest();
http.withCredentials = true;
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
document.getElementById("username").innerHTML = http.responseText;
}
}
http.open("POST", linkbased+'/username/', true);
http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
http.send( data );
if( $_SERVER['REQUEST_METHOD'] == "POST" ) {
if( $_SERVER['HTTP_ORIGIN'] == 'http://domain1.com' ){
header('Access-Control-Allow-Origin: http://domain1.com');
header('Access-Control-Allow-Methods: GET, POST');
header('Access-Control-Allow-Credentials: true');
header('Content-Type: text/plain');
echo array_key_exists( 'username', $_COOKIE ) ? $_COOKIE['username'] : 'username not set';
} else {
header('HTTP/1.1 403 Access Forbidden',true,403);
header('Content-Type: text/plain');
echo "Sorry, you are not allowed to make such a request";
}
}