Metamask
在要求使用者這樣做後檢查是否剛剛安裝了 Metamask
為了讓我的 dApp 對使用者更加友好，尤其是在入門方面，我正在嘗試引導新使用者安裝 Metamask。
如果不存在 web3 提供商，我會向使用者顯示“創建您的錢包”按鈕。當他們點擊它時，他們會在新選項卡中前往 Metamask.io。
當他們安裝 Metamask 並返回我的 dApp 時，問題就出現了。似乎沒有辦法檢測是否在不重新載入的情況下安裝了 web3 提供程序。我不能只是以程式方式重新載入整個頁面，並且要求我脫離的潛在使用者重新載入感覺就像是非常糟糕的使用者體驗。
我從Metamask 的文件中創建了以下程式碼片段來說明這種行為。
<html> <body> <script language="javascript"> function checkProvider () { if (typeof window.ethereum !== 'undefined') { console.log('you already have a web3 provider'); } else { console.log('please install Metamask'); } } var interval = setInterval(checkProvider, 1000); </script> </body> </html>基本上，如果您有 web3 提供程序，它會每秒檢查一次。由於沒有網路伺服器就無法執行，所以我把它放在網上，這樣你就可以快速測試它。
如果我沒有安裝 Metamask，我會收到預期的消息：
但是在我安裝它並返回此頁面後，仍然出現相同的消息：
只有在刷新後，我的程式碼片段才會檢測到元遮罩：
我不是唯一一個面臨 web3 提供商入職問題的人。您想到了哪些解決方法？
您需要以程式方式刷新頁面以獲取元遮罩注入的 web3。您可以編寫一個遞歸函式，該函式不會無限期執行，如果未安裝元遮罩並稍後安裝，它將刷新：
function checkWeb3ProviderRecursively(firstCall = true) { if (typeof window.ethereum !== 'undefined') { console.log("web3 provide detected") // reload the page if(!firstCall) document.location.reload() } else { console.log("Please install metamask") // add a delay here as you want checkWeb3ProviderRecursively(false) } }
ethereum.on(‘connect’, (connectInfo) => { console.log(“連接到錢包”); console.log(connectInfo); });
或者
https://docs.metamask.io/guide/onboarding-library.html#getting-started