Problems with creating an autocomplete searchbox using API calls

I am trying to create a little project to recommend video games to users based on their inputted game. To do this I use the IGDB API. I want to create a searchbar in the front page where it works like google's search bar: on each key press, a bunch of dropdown li's appear that autocomplete the phrase given the current string in the search bar.The problem:IGDB API limits the results to 50 a call. Therefore, I need to send a get request to the API each time a new string in the search bar is present. I use axios to send requests. The template looks like this:function myFunction(string) { return axios.get("https://api-v3.igdb.com/games", { headers: { "user-key": API-KEY, 'Accept': "application/json" }, data: 'search ' + string + '; fields name;' }).then(response =>{ console.log(response.data); }).catch(err => { console.log("Error!"); });} However, if I put this into the EJS file as a script and include axios CDN, I get this error:**Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://api-v3.igdb.com/games. (Reason: CORS header 'Access-Control-Allow-Origin' missing).**​Furthermore, when I use

and try to pass randomFunction() through res.render to my ejs file, it cannot see it and I get a ReferenceError.The res.render looks like this:app.get("/test2", (req, res) => {res.render("test2", { randomFunction: randomFunction}); });​If I put in my JS file (without the script tags), I get a "document is not defined" error, if I put it in the EJS, the CORS error shows up.​I suspect that I need to put the functionality of myFunction() in my app.js file and handle the API calls in that file and link the EJS File where the box is so the data inside it can be operated on by my function in my app.js file. However I am struggling with figuring it out.

Submitted July 20, 2019 at 04:50PM by Osbornable