Developer (Chinese)
  • 开始
  • 移动端钱包
    • 准备开始
    • Mobile SDK
      • iOS
      • Android
      • 常见问题
    • EOS MiniWallet SDK
      • iOS
      • Android
    • DeepLink方式拉起钱包操作
    • JS-SDK
    • EOS资源代付
    • 应用调试
    • 清除TP钱包缓存
  • 插件钱包
    • 指引
      • 介绍
      • 入门
      • 通用术语
      • 初始化dapp
      • 访问账户
      • 发送交易
    • API参考
      • 以太坊 Provider API
      • 波场 Provider API
      • RPC API
      • 签署数据
    • 常见问题
  • 二维码协议
    • 动态二维码
    • EVM网络
    • TRON
    • EOSIO
    • Solana
    • BTC
  • TIP协议
  • Wallet Connect
  • Token
    • Token价格显示支持
    • 添加 Token
    • 添加Token图标
    • FAQ
  • DApp
    • 添加DApp
    • FAQ
  • 公链
    • 公链唯一标识
    • 开放接口
      • Ethereum系列公链
      • Polkadot系列公链
      • EOSIO系列公链
    • 已支持的公链开放接口
      • 交易相关数据
      • 行情相关数据
    • 新增公链
      • 便捷加链介绍和展示
      • 初级支持介绍和展示
      • 高级支持介绍和展示
      • 添加定制链的支持
  • 常见问题
Powered by GitBook
On this page
  • 检测浏览器运行 TokenPocket Extension
  • 检测 TokenPocket Extension
  • 连接到 TokenPocket Extension
  1. 插件钱包
  2. 指引

入门

Previous介绍Next通用术语

Last updated 2 years ago

你可以选择引用第三方Web3登录库来快速支持 TokenPocket钱包,比如:web3-onboard ()

或者根据以下的步骤完成TokenPocket Extension的接入

要用 TokenPocket Extension 进行开发,请在您的开发设备上选择的浏览器中安装 TokenPocket Extension。

一旦 TokenPocket Extension 安装并运行(确保备份您的助记词或私钥),您应该会发现新的浏览器选项卡window.ethereum在开发者控制台中有一个可用的对象。这就是您的网站与 TokenPocket Extension 交互的方式。

您可以在此处查看该对象的完整 API 。

检测浏览器运行 TokenPocket Extension

您可以在浏览器的控制台使用以下代码来验证你的浏览器是否正在运行 TokenPocket Extension。

if (typeof window.ethereum.isTokenPocket !== 'undefined') {
  console.log('TokenPocket Extension is installed!');
}

检测 TokenPocket Extension

您可以使用 ethereum.isTokenPocket 来区分其他兼容以太坊的浏览器。

连接到 TokenPocket Extension

“连接”或“登录”到 TokenPocket Extension 实际上意味着“访问用户的以太坊帐户”。

您可以通过单击按钮来发起请求响应用户的操作,在请求还未有响应的时候禁用此按钮。不要在页面加载的时候发起连接请求。单击按钮调用以下方法:

ethereum.request({ method: 'eth_requestAccounts' });

例子

<button class="enableEthereumButton">Enable Ethereum</button>
const ethereumButton = document.querySelector('.enableEthereumButton');

ethereumButton.addEventListener('click', () => {
  //Will Start the  TokenPocket Extension extension
  ethereum.request({ method: 'eth_requestAccounts' });
});

此Promise返回的是一个数组,里面包含的是以十六进制为前缀的以太坊地址。

该方法后续会包含各种附加参数,以帮助您的站点在设置期间向用户请求所需的一切。

由于它返回的是一个Promise,所以如果你在一个async函数中,你可以像下面的代码那样写:

const accounts = await ethereum.request({ method: 'eth_requestAccounts' });
const account = accounts[0];
// We currently only ever provide a single account,
// but the array gives us some room to grow.

例子

<button class="enableEthereumButton">Enable Ethereum</button>
<h2>Account: <span class="showAccount"></span></h2>
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;
}
https://github.com/blocknative/web3-onboard
在这里下载