I am trying to add authorization header in AJAX call using pure JavaScript. But gives error

Question

Here is my code snippet:

var xhr = new XMLHttpRequest();
xhr.setRequestHeader("Authorization", "Basic " + sessionStorage.getItem("token"));

It gives me error like:

core.js:1633 ERROR DOMException: Failed to execute 'setRequestHeader' on 'XMLHttpRequest': The object's state must be OPENED.

Answer 1

You need to call .open(..) before setting the request headers.

This response was paste from this previous question here

Answer 2

So open it but do it before setting RequestHeader, like this:

var xhr = new XMLHttpRequest();
xhr.open('GET', 'example link);
xhr.setRequestHeader ("Authorization", "Basic " + sessionStorage.getItem("token"));