Search code examples
jquerygetjson

cannot use await despite using an async function in codepen


So I ran the exact code in codepen, but its giving me an error that I cant use await despite the function being async? I am trying to make Javascrypt wait untill the data is returned from the link.

const url =
  "https://raw.githubusercontent.com/ninjaboy667/RandomQuote/main/quotes_list.json";

const getQuotes = async function () {
  return fetch(url)
    .then((response) => {
      return response.json();
    })
    .catch((error) => console.log(`error occurred ${error}`));
};

const { quotes } = await getQuotes();
console.log(quotes)

Solution

  • Solution:

    Codepen at this time does not allow top-level await, despite a method (such as fetch) being asynchronous.

    One solution to this would be to wrap the entire js file in an async function or to use the .then() method.