Cocos Creator引入 ethers报错

Question

Cocos Creator v3.7.1 引入 ethers v6.10 可以正常链接钱包，但是用了下面这段代码就报错
let provider = new ethers.JsonRpcProvider(ethereum);
代码报错：
Error: Error: Can not load module node:http. Cause: Node.js builtin modules are not provided by Cocos Creator.

```typescript

import { _decorator, Component, log, Node } from 'cc';

    import { ethers } from 'ethers';

    const { ccclass, property } = _decorator;

    export let ChainParams = {

        ChainId : 97,

        ChainName:"BSC Test",

        RpcUrl :"https://data-seed-prebsc-1-s3.binance.org:8545/",

        ExplorerUrl:"https://testnet.bscscan.com/",

        Token_USDTAddress : "0xd2925Bda030510E906799a053e21172bA1D60e94"

    }

    @ccclass('ConnectWallet')

    export class ConnectWallet extends Component {

        // start() {

        // }

        public static showAccount(account: string) {

            if (account) {

                return account.substring(0, 4) + "..." + account.substring(account.length - 4, account.length);

            }

            return "";

        }

        static async initAccount() {

            let ethereum = window['ethereum']

            let account = ''

            let provider = null

            console.log('111' );

            if (ethereum) {

                try {

                    let accounts = await ethereum.request({ method: 'eth_requestAccounts' });

                    account = accounts[0]

                    //-------下面这段代码报错------

                    let provider = new ethers.JsonRpcProvider(ethereum);

                    console.log(provider);

                    //----------------------------

                    await ethereum.request({

                        method: 'wallet_switchEthereumChain',

                        params: [{ chainId: '0x61' }],

                    });

                    return account

                } catch (switchError) {

                    if (switchError.code === 4902) {

                        console.log(switchError.message);

                        try {

                        await ethereum.request({

                            "method": 'wallet_addEthereumChain',

                            "params": [

                                {

                                    chainId: ChainParams.ChainId,

                                    chainName: ChainParams.ChainName,

                                    rpcUrls: [ChainParams.RpcUrl],

                                    blockExplorerUrls: [ChainParams.ExplorerUrl],

                                },

                            ],

                        });

                        } catch (addError) {

                            console.log(addError.code);

                        }

                    }

                }

            } else {

                // Need install MetaMask

            }

            // Verify Accounts!

        }

        // update(deltaTime: number) {

           

        // }

    }

```

Answer 1

参考通义千问和郭老师的小迷弟雅思莫了-编写提供，主要是为了帮助您快速解决问题，如下回答，您可以参考下，如有问题，评论区留言。

在 Cocos Creator 中使用 ethers.js 遇到这个问题是因为 ethers 依赖了 Node.js 的内置模块（例如 http 模块），而 Cocos Creator 环境并不支持这些内置模块。

针对你遇到的问题，Cocos Creator 中与钱包交互，一般推荐通过注入 Web3.js 或者 ethers.js 到浏览器环境来实现。对于 ethers.js，你可以直接使用其提供的 ethers.getDefaultProvider 方法来获取 JsonRpcProvider，而非通过 new ethers.JsonRpcProvider(ethereum) 这种方式创建。

请尝试修改你的代码如下：

import { _decorator, Component, log, Node } from 'cc';
import { ethers } from 'ethers';

const { ccclass, property } = _decorator;

export let ChainParams = {
    // ...你的链参数...
};

@ccclass('ConnectWallet')
export class ConnectWallet extends Component {
    // ...

    static async initAccount() {
        let ethereum = window['ethereum'];
        let account = '';

        if (ethereum) {
            try {
                let accounts = await ethereum.request({ method: 'eth_requestAccounts' });
                account = accounts[0];

                // 使用 ethers.getDefaultProvider 来创建 provider
                let provider = new ethers.providers.Web3Provider(ethereum);

                console.log(provider);

                // ...
            } catch (error) {
                // ...
            }
        } else {
            // Need install MetaMask
        }

        // ...
    }

    // ...
}

这段代码将使用 ethers.providers.Web3Provider 封装的以太坊提供者，它能适配 metamask 这样的浏览器扩展插件。