Web3调用getAccounts报await仅可在async函数中使用如何解决

错误原因 #

await 关键字仅允许在两种场景下使用：

• 标注了 async 关键字的函数内部
• ES 模块的顶层作用域
  你当前第一行全局代码 const accounts = await web3.eth.getAccounts(); 运行在普通脚本的全局作用域，不属于上述合法场景，因此触发语法错误。

修复方案 #

可以直接将账户获取逻辑整合到你已有的 App 对象的异步方法中，不需要额外新增全局异步结构，修改点如下：

1. 删除全局的非法 await 行，将账户获取逻辑移入loadAccount方法
2. 修正App.load方法的语法错误，原本的括号配对错误导致两个异步调用逻辑异常
3. 修正loadAccount中的API调用错误，web3.eth.getAccounts()是异步方法需要加await，旧的web3.eth.accounts[0]写法已经不生效

修复后完整代码 #

App = {
    load: async () => {
        // 修正原括号配对错误，拆分为两个独立的异步调用
        await App.loadWeb3()
        await App.loadAccount()
    },

    loadWeb3: async () => {
        if (typeof web3 !== 'undefined') {
            App.web3Provider = web3.currentProvider
            web3 = new Web3(web3.currentProvider)
        } else {
            window.alert("Please connect to Metamask.")
        }
        // Modern dapp browsers...
        if (window.ethereum) {
            window.web3 = new Web3(ethereum)
            try {
                // Request account access if needed
                await ethereum.enable()
                // Acccounts now exposed
                web3.eth.sendTransaction({/* ... */})
            } catch (error) {
                // User denied account access...
            }
        }
        // Legacy dapp browsers...
        else if (window.web3) {
            App.web3Provider = web3.currentProvider
            window.web3 = new Web3(web3.currentProvider)
            // Acccounts always exposed
            web3.eth.sendTransaction({/* ... */})
        }
        // Non-dapp browsers...
        else {
            console.log('Non-Ethereum browser detected. You should consider trying MetaMask!')
        }
    },

    loadAccount: async () => {
        // 把原全局的账户获取逻辑移到这里，加await调用
        const accounts = await web3.eth.getAccounts();
        App.account = accounts[0]
        console.log(App.account)
    }
}

$(() => {
    $(window).load(() => {
        App.load()
    })
})

内容的提问来源于stack exchange，提问作者Shrey Raj Singh