javascript - await is only valid in async functions and the top level bodies of modules as it is in top level body

I am trying to create a SupaDB client for Steam, more info. When I check the website console, I get the following error message, even when node file.js is used, same error is being given. Which the error is:

SyntaxError: await is only valid in async functions and the top level bodies of modules

As the info provided, the error also includes that the line where the error occurs is line 8...

Full log:

const { data, error } = await supabase.from("steam").select("*")
                        ^^^^^

SyntaxError: await is only valid in async functions and the top level bodies of modules at ObjectpileFunction (node:vm:352:18) at wrapSafe (node:internal/modules/cjs/loader:1031:15) at Module._pile (node:internal/modules/cjs/loader:1065:27) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) at node:internal/main/run_main_module:17:47

const supabase = createClient(";, 
  "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imdxa3VvbW1kbWZ6bXdremRld21hIiwicm9sZSI6ImFub24iLCJpYXQiOjE2NDkyNjQyNTIsImV4cCI6MTk2NDg0MDI1Mn0.iF651HDhqynAQRlG8T6wFS3ZEx4dqxHiEiguc0m7-zI", {
  headers: {
    Authorization: "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzZWNyZXQiOiI3MjU5YTg2ZDVlMTE1YTM2ODRjMjdlNGUiLCJpYXQiOjE2NTAyODg1MzJ9.43EriTTwaDLeepFTbRoZXJksqCtIrjMZ-yHHMDuK0_4"
  }
})

const { data, error } = await supabase.from("steam").select("*")

    if (error) {
        console.log('Error occurred:', error)
        }
    else {
        console.log(data)
        }

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- link CSS and JavaScript to HTML -->
    <link rel="stylesheet" href="style.css">
    <script src="code.js"></script>
</head>
<body>
    
</body>
</html>

SyntaxError: await is only valid in async functions and the top level bodies of modules

As the info provided, the error also includes that the line where the error occurs is line 8...

Full log:

const { data, error } = await supabase.from("steam").select("*")
                        ^^^^^

SyntaxError: await is only valid in async functions and the top level bodies of modules at Object.pileFunction (node:vm:352:18) at wrapSafe (node:internal/modules/cjs/loader:1031:15) at Module._pile (node:internal/modules/cjs/loader:1065:27) at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10) at Module.load (node:internal/modules/cjs/loader:981:32) at Function.Module._load (node:internal/modules/cjs/loader:822:12) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12) at node:internal/main/run_main_module:17:47

const supabase = createClient("https://gqkuommdmfzmwkzdewma.supabase.co", 
  "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imdxa3VvbW1kbWZ6bXdremRld21hIiwicm9sZSI6ImFub24iLCJpYXQiOjE2NDkyNjQyNTIsImV4cCI6MTk2NDg0MDI1Mn0.iF651HDhqynAQRlG8T6wFS3ZEx4dqxHiEiguc0m7-zI", {
  headers: {
    Authorization: "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzZWNyZXQiOiI3MjU5YTg2ZDVlMTE1YTM2ODRjMjdlNGUiLCJpYXQiOjE2NTAyODg1MzJ9.43EriTTwaDLeepFTbRoZXJksqCtIrjMZ-yHHMDuK0_4"
  }
})

const { data, error } = await supabase.from("steam").select("*")

    if (error) {
        console.log('Error occurred:', error)
        }
    else {
        console.log(data)
        }

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- link CSS and JavaScript to HTML -->
    <link rel="stylesheet" href="style.css">
    <script src="code.js"></script>
</head>
<body>
    
</body>
</html>

Share Improve this question edited Apr 18, 2022 at 13:52 Lee Taylor 7,99416 gold badges37 silver badges53 bronze badges asked Apr 18, 2022 at 13:43 Omar Moustafa 1112 silver badges8 bronze badges

Add a ment |

3 Answers 3

Sorted by: Reset to default 2

Unless you are using the latest version of NodeJS which supports top level await, you cannot use await outside of an async function.

You can work around this by encapsulating your code in an IIFE function:

(async() => {
  // your code using await goes here
  const supabase = createClient("https://gqkuommdmfzmwkzdewma.supabase.co", "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imdxa3VvbW1kbWZ6bXdremRld21hIiwicm9sZSI6ImFub24iLCJpYXQiOjE2NDkyNjQyNTIsImV4cCI6MTk2NDg0MDI1Mn0.iF651HDhqynAQRlG8T6wFS3ZEx4dqxHiEiguc0m7-zI", {
  headers: {
    Authorization: "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzZWNyZXQiOiI3MjU5YTg2ZDVlMTE1YTM2ODRjMjdlNGUiLCJpYXQiOjE2NTAyODg1MzJ9.43EriTTwaDLeepFTbRoZXJksqCtIrjMZ-yHHMDuK0_4"
  }
})

const { data, error } = await supabase.from("steam").select("*")
    if (error)
      console.log('Error occurred:', error)
    else
      console.log(data)
})()

await is only valid in async functions

This means you can only use await if your function is async. Right now you are just using keyword await without async

let dummyMethod = async () => {
    const supabase = createClient("https://gqkuommdmfzmwkzdewma.supabase.co",
        "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6Imdxa3VvbW1kbWZ6bXdremRld21hIiwicm9sZSI6ImFub24iLCJpYXQiOjE2NDkyNjQyNTIsImV4cCI6MTk2NDg0MDI1Mn0.iF651HDhqynAQRlG8T6wFS3ZEx4dqxHiEiguc0m7-zI", {
            headers: {
                Authorization: "Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzZWNyZXQiOiI3MjU5YTg2ZDVlMTE1YTM2ODRjMjdlNGUiLCJpYXQiOjE2NTAyODg1MzJ9.43EriTTwaDLeepFTbRoZXJksqCtIrjMZ-yHHMDuK0_4"
            }
        })

    const {
        data,
        error
    } = await supabase.from("steam").select("*")

    if (error) {
        console.log('Error occurred:', error)
    } else {
        console.log(data)
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- link CSS and JavaScript to HTML -->
    <link rel="stylesheet" href="style.css">
    <script src="code.js"></script>
</head>
<body>
    
</body>
</html>

Now you will not get an error message. Since we are wrapping your await in async method.

Nothing will log to console, since I'm not calling the dummyMethod.

You can add a "type":"module" at your package.json file and that will allow you to use top level await

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - await is only valid in async functions and the top level bodies of modules as it is in top level body - Stack Overf

3 Answers 3

与本文相关的文章

评论列表(0)