401 Unauthorised when calling API through JavaScript

[khurim_shabaz]

Hi,

Can I please get help with the following code, which is resulting in 401 code.

$(document).ready(function() {
 console.log("api");
xhr = new XMLHttpRequest();
$(document).ready(function() {
 $.ajax({
   url: 'https://api.companieshouse.gov.uk/company/05961102',
   type: 'GET',
   datatype: 'json',
   success: function() { alert('Success'); },
   error: function() { alert('Failed!' + xhr.readyStatus ); },
   beforeSend: function (xhr) {
					   xhr.withCredentials = true;
        	
            var key = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx:';
            key = btoa(key);
        xhr.setRequestHeader('Authorization', 'Basic ' + encodeURIComponent(key));
            alert(encodeURIComponent(key));
           },
 });   
});
});

When running this in developer tool I am getting 401 authorised error. My understanding is that it might something to do with encoding of the key but not sure.

Thanks in advance.

[voracityemail]

Encoding looks OK (base64 of (user ID + ‘:’) ).

Since the request you’ll be making is a CORS (cross-origin) one CH checks the “Origin” header sent by the javascript client.

• The location of your javascript code calling the API should be in one of the domains you registered with Companies House.
• The protocol used to access your code also should be the one you registered e.g. if you registered https://yourdomain/ then if you are accessing your javascript via e.g. http://yourdomain/mytest.html the call will fail.

For some examples of people debugging AJAX calls to CH see:

Jquery Ajax Get request

I am having CORS issue while making above Jquery Ajax call "Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api.companieshouse.gov.uk/search/companies. (Reason: CORS header 'Access-Control-Allow-Origin' missing)." How can I get the required access permissions?

For a more in-depth work-through of this see:

Ajax post to JSON API

I'm trying to use Ajax to POST a request to the new JSON API. The request works from the Companies House test page (which suggests that the Application key is correct) but is not working from an HTML page when served from the same domain as the Application JavaScript domain. When I try the request below, I see the following error: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://ericernie.co.uk' is therefore not allowed access. The response had HTT…

If I read correctly jQuery ajax call syntax for headers has changed a bit between the various versions so it might be worth confirming you’re setting that correctly for the version you’re using. Also if you think that’s not working you could try the URL basic authentication e.g.

var testUserName={your CH user ID};
var testKey=testUserName + ':'; // password part is blank
var testURL='https://'+testKey+'@'+'api.companieshouse.gov.uk/company/05961102';

Good luck.