CODEWITHSUNDEEP
javascriptrestful-authenticationxmlhttprequest
carrots
carrots

Reputation: 825

How to assign basic authentication header to XMLHTTPREQUEST?

I've read many answers of preflight and CORS so please do not post links referencing what I should read. Many of the answers are from a server-perspective, but I am the client in this case. Do I set the origin header? My assumption is that this is a simple request, am I right?

 req.open("POST", url, true);
 req.setRequestHeader( 'Content-Type',   'application/blahblah' );
 req.setRequestHeader( 'Accept', 'application/blahblah' );
 req.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + pass)); 
 req.send();

Yet its still not working, my error:

Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 500.

Upvotes: 37

Views: 129211

Answers (4)

carrots
carrots

Reputation: 825

Solution:

var req = new XMLHttpRequest();
    req.setRequestHeader('Authorization', 'Basic [base64 encoded password here]' );

Upvotes: 13

davidjenkins
davidjenkins

Reputation: 919

This post is old, but answering for anybody else who comes across it.

There is nothing wrong with your authorization header. The problem you are facing is CORS related.

You don't set the Origin header yourself. The browser does that for you. If your origin is null then I suspect this is because you are running your code from file:/// instead of http://.

Upvotes: 6

Nick Spicer
Nick Spicer

Reputation: 2707

If using this for an API request, adding the Authorization header will first make XMLHttpRequest send an OPTIONS request, which may be denied by some APIs.

To get around this you can also do: 

var invocation = new XMLHttpRequest();
invocation.open("GET", url, true, username, password);
invocation.withCredentials = true;

Which will add the Authorization header and also avoid the preflight request.

Upvotes: 6

epascarello
epascarello

Reputation: 207491

If you want to set the authorization header

req.setRequestHeader('Authorization','Basic ' + Base64StringOfUserColonPassword);

Upvotes: 38

Related Questions