Looking to update text on a website using data from a JSON file on another site? This scenario is unique due to restrictions - can't use JQuery or backend elements like Node/PHP. Wondering if vanilla JavaScript can solve the problem?
While some workarounds have been attempted, such as utilizing a Chrome extension (Allow CORS) to bypass CORS errors, it only aids one browser. Seeking a universal solution without resorting to back-end languages.
let url1 = "https://www.codewars.com/api/v1/users/jrd656";
let h = new Headers();
h.append('Accept', 'application/json');
let req = new Request(url1, {
method: 'GET',
headers: h,
mode: 'cors',
});
fetch(req)
.then((response)=>{
return response.ok ? response.json() : Promise.reject('BAD HTTP stuff');
})
.then( (jsonData) =>{
console.log(jsonData);
})
.catch( (err) =>{
console.error('ERROR:', err.message);
});
The goal is to find a way around the CORS issue without involving back-end technologies. Although attempting Access-Control-Allow-Origin: *;, faced syntax errors in the JS file with
Uncaught SyntaxError: Unexpected token ':'