Hi,
I try to make a search aria with data from this API, for that I am using VueJs with axios. I read some posts from here but I still haven’t managed to make it work.
I am using artisan serve with a custom url like http://example.local , on port 80.
This is my code, where in my variables I have companies house url and my api key.
In Authorised JavaScript domains I have both with .local and .local:80
axios
.get(this.$companiesHouseUrl, {
params: {
q: this.search_for_company
},
headers: {
Authorization: "Basic " + btoa(this.$companiesHouseKey + ":")
}
})
.then(response => {
console.log("Response:", response);
})
.catch(e => {
console.log("Error:", e);
});
Access to XMLHttpRequest at ‘https://api.companieshouse.gov.uk/?q=test’ from origin ‘http://example.local’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
UPDATE:
I try from my live domain.
- in JavaScript domains I use both URL and URL:80
- add ‘Content-Type’: ‘application/json’ to headers ,or ‘text/json’
- add ‘Access-Control-Allow-Origin’: ‘*’ and ‘Content-Type’: ‘application/json’ to headers
- add ‘Origin’: ‘myURL’
- if I remove Headers, no CORS error but error for auth
I didn’t find the solution yet…
UPDATE 2 (SOLVED)
- I found out what I was doing wrong… my $companiesHouseUrl was the
main url so I change the url: this.$companiesHouseUrl + ‘search/companies’