Metamask

與來自 Javascript 的元遮罩互動。乙太坊沒有定義

  • February 27, 2022

我試圖實現一個非常基本的 Metamask 集成來顯示余額。我正在使用 GoDaddy 的網站建構器,它允許您將任意 html 注入頁面。

這是我注入的程式碼。

<button class="enableEthereumButton">Enable Ethereum</button>
<h2>Account: <span class="showAccount"></span></h2>

<script>
 const ethereumButton = document.querySelector('.enableEthereumButton');
 const showAccount = document.querySelector('.showAccount');

 ethereumButton.addEventListener('click', () => {
   getAccount();
 });

 async function getAccount() {
   const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
   const account = accounts[0];
   showAccount.innerHTML = account;
 }
</script>

我得到的錯誤是“未定義乙太坊”

我已經在 Chrome 的控制台中測試了這段程式碼,它成功地啟動了 Metamask。Metamask 也適用於其他網站。

是否有什麼東西阻止標籤能夠看到由 metamask 全域注入的乙太坊對象?

試試這個,第一部分是用各種瀏覽器進行測試。我遇到了同樣的問題,但在 chrome 本身上。我導入了 web3 包,然後添加了以下程式碼。它開始工作。(但是從現在開始你必須使用“web3.”功能

async loadBlockchainData()
{
   var Web3 = require('web3')
   var web3 = new Web3('http://127.0.0.1:7545')

如果您只想使用乙太坊..

async loadWeb3()
{
   // Modern dapp browsers...
   if (window.ethereum) 
   {
       window.web3 = new Web3(ethereum);
       await window.ethereum.enable();
   }
   // Legacy dapp browsers...
   else if (window.web3) 
   {
       window.web3 = new Web3(window.web3.currentProvider)
   }
   // Non-dapp browsers...
   else 
   {
       console.log('Non-Ethereum browser detected. You should consider trying MetaMask!');
   }
}

使用現代 dapp 瀏覽器部分程式碼(您也可以嘗試其他部分)

您應該使用 Ethereum 提供程序初始化 web3 對象。以下幾行應該有助於調試您的問題:

檢查 MetaMask 是否注入了提供程序(javascript):

const provider = window.ethereum

if (provider) {
// initialize your app
} else {
 console.log('Please install MetaMask!');
}

檢查提供程序是否由 MetaMask (javascript) 注入:

const provider = window.ethereum
if (provider?.isMetaMask) console.log("Using MetaMask!");

您可以使用 MetaMask 節點包來檢測提供程序,https ://www.npmjs.com/package/@metamask/detect-provider (javascript):

// This function detects most providers injected at window.ethereum
import detectEthereumProvider from '@metamask/detect-provider';

const provider = await detectEthereumProvider();

if (provider) {
 // From now on, this should always be true:
 // provider === window.ethereum
 startApp(provider); // initialize your app
} else {
 console.log('Please install MetaMask!');
}

一旦你找到了你的提供者,你就可以初始化一個 web3 對象並使用以下內容檢索帳戶:

import Web3 from "web3";
const provider = window.ethereum // or MetaMask's package
const web3 = Web3(provider)
try {
   await provider.enable();
 } catch (error) {
   console.error(error);
 }
const account = (await web3.eth.getAccounts())[0];

希望這可以幫助!乾杯!

引用自:https://ethereum.stackexchange.com/questions/122689