how to fetch a wikipedia geosearch with a correct origin?

Question

I want to add a "wikipedia-geosearch" feature to my interactive map. Here is the simplest code for that operation, first attempt:

const buildWikiGeoSearch = (cn, rd, [lon,lat]) =>
    `https://${cn}.wikipedia.org/w/api.php?action=query&list=geosearch&format=json&gsradius=${rd}&gscoord=${lat}|${lon}`;
let query = buildWikiGeoSearch("fr", 2000, [6.94,49.21]);
console.log(`WikiGeoSearch = ${query}`);
const jsonr = fetch(query)
    .then(a => console.log("geoSearch ok") || a.json())
    .then(b => console.log(JSON.stringify(b)))
    .catch(e => console.log("geoSearch crash:", e));

It fails, throwing a TypeError: Failed to fetch (not really explicit!).

Second attempt, adding &origin=*:

const buildWikiGeoSearch = (cn, rd, [lon,lat]) =>
    `https://${cn}.wikipedia.org/w/api.php?action=query&list=geosearch&format=json&gsradius=${rd}&gscoord=${lat}|${lon}`;
let query = buildWikiGeoSearch("fr", 2000, [6.94,49.21]) + "&origin=*"; // ***CHANGE***
const jsonr = fetch(query)
    .then(a => console.log("geoSearch ok") || a.json())
    .then(b => console.log(JSON.stringify(b)))
    .catch(e => console.log("geoSearch crash:", e));

It works, but I would like to understand

• what I am doing: what is the exact role of origin=*?
• and if I am doing it correctly: is it safe to using origin=*?

Answer 1

origin=* is a part of the MediaWiki API. MediaWiki uses the parameter to return correct Cross-Origin Resource Sharing (CORS) headers on its HTTP response, which tells your browser that it's okay for your app to load that data. origin=* means that the API should allow any origin ("*" stands for wildcard).

Using origin=* is perfectly fine and safe.