FATAL cross-origin failure in code pen for Wikipedia viewer

My query (see below) from code pen into Wikipedia returns the error:

XMLHttpRequest cannot load http://en.wikipedia.org/w/api.php?action=query&prop=pageterms&generator=prefixsearch&origin=*&format=json&wbptterms=description&pilimit=30&gpssearch=football. Cross-origin redirection denied by Cross-Origin Resource Sharing policy.

This query works fine in my local Safari browser (so I thought I was all set).

Is there some magic setting which will make this work in code pen? I cannot find anything except to set ‘origin=*’, which I have done.


An addition. If you ctl-click on the above URL, it works just fine and returns a result.

The error is telling you that the browser cannot fetch data from an insecure server (http) if you’re connected securely to CodePen (https). It’s an important security policy that’s also in the latest Safari and will eventually be in all browsers. Since you’re getting data from Wikipedia, the fix is simple: just use https://en.wikipedia.org.

this will solve your issue

https solved the problem. So simple! Thank you…

Alternatively add this origin=* to your ajax request

url: wikiurl,
data: {
origin: “*”

This worked for me