XMLHttpRequest help

Hi all…

I’m working on Wikipedia Viewer and I’m making XMLHttpRequest to get data from Wikipedia API, but I’m getting this error:

XMLHttpRequest cannot load https://en.wikipedia.org/w/api.php?action=opensearch&search=donald%20trump&format=json&callback=?. No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘null’ is therefore not allowed access.

Could someone explain to me how to set header and what it should look like and why?

I know that it would probably be easier to use jQuery for this but I want to make this with pure JS if possible.


Thank you for the answer and the links!

1 Like

Thanks, @SkyC.
I now found the mention in the APISandbox.

When accessing the API using a cross-domain AJAX request (CORS), set this to the originating domain. This must be included in any pre-flight request, and therefore must be part of the request URI (not the POST body).

For authenticated requests, this must match one of the origins in the Origin header exactly, so it has to be set to something like https://en.wikipedia.org or https://meta.wikimedia.org. If this parameter does not match the Origin header, a 403 response will be returned. If this parameter matches the Origin header and the origin is whitelisted, the Access-Control-Allow-Origin and Access-Control-Allow-Credentials headers will be set.

For non-authenticated requests, specify the value *. This will cause the Access-Control-Allow-Origin header to be set, but Access-Control-Allow-Credentials will be false and all user-specific data will be restricted.

1 Like