一、EIP6963#
問題紹介#
特定のウェブサイトに接続する際、Metamask でログインしようとしても、OKX Wallet や他のウォレットのログイン画面が表示されることがあります。これは、現在のウェブサイトが古い EIP-1193 に基づいてグローバルな window.ethereum オブジェクトを使用しているためです。実際には、異なるブラウザウォレットプラグインの読み込み順序の問題が存在し、最後に読み込まれたウォレットが window.ethereum オブジェクトを乗っ取ってしまうことがよくあります。
解決策:#
2023 年 5 月に EIP-6963 の解決策が導入されました。EIP-6963 に基づいて、各ウォレットごとに独立した EIP1193Provider を取得することができます。これにより、相互の影響を回避できます。
では、どのように接続すればよいのでしょうか？
- WAGMI 2.xを使用すると、EIP-6963 をネイティブにサポートできます。xlog プラットフォームのウォレットログインも wagmi を使用しているようですが、Metamask でログインするとまだ okx に妨害されるようです。コードを確認したところ、まだ wagmi 1.x が使用されているようで、おそらくそのバージョンでは EIP6963 がサポートされていないのでしょう。
- mipdライブラリを使用して、対応するウォレットの EIP1193Provider を取得し、ethersを使用して接続します。
window.ethereum が乗っ取られた後、OKX Wallet などの良心的なウォレットは、ユーザーに Metamask の選択肢を提供することがあります。しかし、多くの場合、直接置き換えられてしまいます。ユーザーにとっては、Metamask ログインをクリックしても他のウォレットが表示されるという非常に混乱する使用体験になります。これはバグとも言えます。アップグレードをお勧めします。
関連資料#
- https://metamask.io/news/developers/how-to-implement-eip-6963-support-in-your-web-3-dapp/
- https://github.com/MetaMask/vite-react-ts-eip-6963
二、Typescript バージョン#
問題紹介#
新しいプロジェクトを開く際、依存関係はすでにインストールされているはずなのに、まだ TypeScript のエラーが発生することがよくあります。このような場合、一般的には 2 つの可能性が考えられます。1 つは TypeScript が反応していないため、プロジェクトを再読み込みすれば解決することがあります。もう 1 つは、TypeScript のバージョンが正しくないため、デフォルトで vscode のバージョンが使用されていることです。バージョンを切り替えれば解決できます。このような状況を回避するために、設定で対応できるでしょうか？
解決策#
- vscode には「typescript.tsdk」という非常に混乱する設定がありますが、最初に開いたときには効果がありません。ただし、後続の読み込みでは有効になります。
- vscode には「typescript.enablePromptUseWorkspaceTsdk」という設定もあります。これを true に設定すると、プロジェクトを開くたびに右下隅に Prompt が表示され、ワークスペースの TypeScript バージョンに切り替えるように促されます。切り替えない場合、プロジェクトを開くたびにプロンプトが表示されます。
実際には、これによって問題が根本的に解決されるわけではありません。vscode がワークスペースを信頼する機能があるのであれば、なぜワークスペースのプロジェクトファイルの TypeScript バージョンを自動的に読み込むことができないのでしょうか？ より良い解決策が期待されます。