类型错误：（中间值）.providers未定义未捕获（承诺中）错误：没有以太坊对象

Question

我在尝试在 sepolia 测试网络上传输 eth 和 im 时遇到此错误： 我使用的是安全帽 2.22.2 我使用以太坊 5.7.2 当我按下发送按钮时就会发生这种情况 这是交易上下文：

import React, { useEffect, useState } from "react";
import { ethers } from "ethers";

import { contractABI, contractAddress } from "../utils/constants";

export const TransactionContext = React.createContext();

const { ethereum } = window;

const createEthereumContract = () => {
  const provider = new ethers.providers.Web3Provider(ethereum);
  const signer = provider.getSigner();
  const transactionsContract = new ethers.Contract(contractAddress, contractABI, signer);

  return transactionsContract;
};

export const TransactionsProvider = ({ children }) => {
  const [formData, setformData] = useState({ addressTo: "", amount: "", keyword: "", message: "" });
  const [currentAccount, setCurrentAccount] = useState("");
  const [isLoading, setIsLoading] = useState(false);
  const [transactionCount, setTransactionCount] = useState(localStorage.getItem("transactionCount"));
  const [transactions, setTransactions] = useState([]);

  const handleChange = (e, name) => {
    setformData((prevState) => ({ ...prevState, [name]: e.target.value }));
  };

  const getAllTransactions = async () => {
    try {
      if (ethereum) {
        const transactionsContract = createEthereumContract();

        const availableTransactions = await transactionsContract.getAllTransactions();

        const structuredTransactions = availableTransactions.map((transaction) => ({
          addressTo: transaction.receiver,
          addressFrom: transaction.sender,
          timestamp: new Date(transaction.timestamp.toNumber() * 1000).toLocaleString(),
          message: transaction.message,
          keyword: transaction.keyword,
          amount: parseInt(transaction.amount._hex) / (10 ** 18)
        }));

        console.log(structuredTransactions);

        setTransactions(structuredTransactions);
      } else {
        console.log("Ethereum is not present");
      }
    } catch (error) {
      console.log(error);
    }
  };

  const checkIfWalletIsConnect = async () => {
    try {
      if (!ethereum) return alert("Please install MetaMask.");

      const accounts = await ethereum.request({ method: "eth_accounts" });

      if (accounts.length) {
        setCurrentAccount(accounts[0]);

        getAllTransactions();
      } else {
        console.log("No accounts found");
      }
    } catch (error) {
      console.log(error);
    }
  };

  const checkIfTransactionsExists = async () => {
    try {
      if (ethereum) {
        const transactionsContract = createEthereumContract();
        const currentTransactionCount = await transactionsContract.getTransactionCount();

        window.localStorage.setItem("transactionCount", currentTransactionCount);
      }
    } catch (error) {
      console.log(error);

      throw new Error("No ethereum object");
    }
  };

  const connectWallet = async () => {
    try {
      if (!ethereum) return alert("Please install MetaMask.");

      const accounts = await ethereum.request({ method: "eth_requestAccounts", });

      setCurrentAccount(accounts[0]);
      window.location.reload();
    } catch (error) {
      console.log(error);

      throw new Error("No ethereum object");
    }
  };

  const sendTransaction = async () => {
    try {
      if (ethereum) {
        const { addressTo, amount, keyword, message } = formData;
        const transactionsContract = createEthereumContract();
        const parsedAmount = ethers.utils.parseEther(amount);

        await ethereum.request({
          method: "eth_sendTransaction",
          params: [{
            from: currentAccount,
            to: addressTo,
            gas: "0x5208",
            value: parsedAmount._hex,
          }],
        });

        const transactionHash = await transactionsContract.addToBlockchain(addressTo, parsedAmount, message, keyword);

        setIsLoading(true);
        console.log(`Loading - ${transactionHash.hash}`);
        await transactionHash.wait();
        console.log(`Success - ${transactionHash.hash}`);
        setIsLoading(false);

        const transactionsCount = await transactionsContract.getTransactionCount();

        setTransactionCount(transactionsCount.toNumber());
        window.location.reload();
      } else {
        console.log("No ethereum object");
      }
    } catch (error) {
      console.log(error);

      throw new Error("No ethereum object");
    }
  };

  useEffect(() => {
    checkIfWalletIsConnect();
    checkIfTransactionsExists();
  }, [transactionCount]);

  return (
    <TransactionContext.Provider
      value={{
        transactionCount,
        connectWallet,
        transactions,
        currentAccount,
        isLoading,
        sendTransaction,
        handleChange,
        formData,
      }}
    >
      {children}
    </TransactionContext.Provider>
  );
};

这是我的deploy.js 文件：

const main = async () => {
  const transactionsFactory = await hre.ethers.getContractFactory("Transactions");
  const transactionsContract = await transactionsFactory.deploy();

  await transactionsContract.deployed();

  console.log("Transactions address: ", transactionsContract.address);
};

const runMain = async () => {
  try {
    await main();
    process.exit(0);
  } catch (error) {
    console.error(error);
    process.exit(1);
  }
};

runMain();

这是我的全部错误：

[vite] connecting... client.ts:16:8
[vite] connected. client.ts:53:14
TypeError: (intermediate value).providers is undefined
    createEthereumContract TransactionContext.jsx:11
    checkIfTransactionsExists TransactionContext.jsx:77
    TransactionsProvider TransactionContext.jsx:145
    React 5
    unstable_runWithPriority scheduler.development.js:468
    React 3
    workLoop scheduler.development.js:417
    flushWork scheduler.development.js:390
    performWorkUntilDeadline scheduler.development.js:157
    js scheduler.development.js:180
    js scheduler.development.js:645
    __require chunk-HL6I5LZR.js:9
    js index.js:6
    __require chunk-HL6I5LZR.js:9
    React 2
    __require chunk-HL6I5LZR.js:9
    js React
    __require chunk-HL6I5LZR.js:9
    <anonymous> react-dom:1
TransactionContext.jsx:83:14
Uncaught (in promise) Error: No ethereum object
    checkIfTransactionsExists TransactionContext.jsx:85
    TransactionsProvider TransactionContext.jsx:145
    React 5
    unstable_runWithPriority scheduler.development.js:468
    React 3
    workLoop scheduler.development.js:417
    flushWork scheduler.development.js:390
    performWorkUntilDeadline scheduler.development.js:157
    js scheduler.development.js:180
    js scheduler.development.js:645
    __require chunk-HL6I5LZR.js:9
    js index.js:6
    __require chunk-HL6I5LZR.js:9
    React 2
    __require chunk-HL6I5LZR.js:9
    js React
    __require chunk-HL6I5LZR.js:9
    <anonymous> react-dom:1
TransactionContext.jsx:85:12
    checkIfTransactionsExists TransactionContext.jsx:85
    TransactionsProvider TransactionContext.jsx:145
    React 5
    unstable_runWithPriority scheduler.development.js:468
    React 3
    workLoop scheduler.development.js:417
    flushWork scheduler.development.js:390
    performWorkUntilDeadline scheduler.development.js:157
    (Async: EventHandlerNonNull)
    js scheduler.development.js:180
    js scheduler.development.js:645
    __require chunk-HL6I5LZR.js:9
    js index.js:6
    __require chunk-HL6I5LZR.js:9
    React 2
    __require chunk-HL6I5LZR.js:9
    js React
    __require chunk-HL6I5LZR.js:9
    <anonymous> react-dom:1
TypeError: (intermediate value).providers is undefined
    createEthereumContract TransactionContext.jsx:11
    getAllTransactions TransactionContext.jsx:32
    checkIfWalletIsConnect TransactionContext.jsx:65
    TransactionsProvider TransactionContext.jsx:144
    React 5
    unstable_runWithPriority scheduler.development.js:468
    React 3
    workLoop scheduler.development.js:417
    flushWork scheduler.development.js:390
    performWorkUntilDeadline scheduler.development.js:157
    js scheduler.development.js:180
    js scheduler.development.js:645
    __require chunk-HL6I5LZR.js:9
    js index.js:6
    __require chunk-HL6I5LZR.js:9
    React 2
    __require chunk-HL6I5LZR.js:9
    js React
    __require chunk-HL6I5LZR.js:9
    <anonymous> react-dom:1

我正在观看 KRYPT 网站视频 JAVASCRIPT MASTERY 我已经复制了所有内容，我非常确定我文件中的所有内容都是正确的，但如果不是，我将非常乐意纠正它

Answer 1

你的错误很明显

Uncaught (in promise) Error: No ethereum object

您可能没有安装metamask。当您安装metamask钱包

MetaMask 将全局 JavaScript API 注入到其访问的网站中 使用 window.ethereum 提供者对象的用户。

为了防止你的应用程序崩溃，你应该添加一个守卫

if (window.ethereum){
    // add your logic here
} else {
   // display "install metaamsk" to the user
}