> For the complete documentation index, see [llms.txt](https://help.tokenpocket.pro/developer-cn/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.tokenpocket.pro/developer-cn/extension-wallet/guide/start.md).

# 入门

你可以选择引用第三方Web3登录库来快速支持 TokenPocket钱包，比如：web3-onboard (<https://github.com/blocknative/web3-onboard>)

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

要用 TokenPocket Extension 进行开发，请在您的开发设备上选择的浏览器中安装 TokenPocket Extension。[在这里下载](https://extension.tokenpocket.pro/#/)

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

[您可以在此处](broken://pages/eSTak9m9yNrnVoCMl4BG)查看该对象的完整 API 。

### 检测浏览器运行 TokenPocket Extension&#x20;

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

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

### 检测 TokenPocket Extension <a href="#detecting-metamask" id="detecting-metamask"></a>

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

### 连接到 TokenPocket Extension

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

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

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

#### 例子

{% tabs %}
{% tab title="HTML" %}

```html
<button class="enableEthereumButton">Enable Ethereum</button>
```

{% endtab %}

{% tab title="JavaScript" %}

```javascript
const ethereumButton = document.querySelector('.enableEthereumButton');

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

{% endtab %}
{% endtabs %}

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

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

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

```javascript
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.
```

#### 例子

{% tabs %}
{% tab title="HTML" %}

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

{% endtab %}

{% tab title="JavaScript" %}

```javascript
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;
}
```

{% endtab %}
{% endtabs %}