介绍

TronLink，类似于 MetaMask，允许 TRON DApp 在浏览器中运行而不必部署TRON Full Node 。如果用户已经在 Chrome 扩展程序中安装了TronLink，则 TronLink 会将tronWeb及tronLink对象注入每个浏览器页面。这将允许 web DApp 与 TRON 网络交互。

我们通过一个简单的示例来了解它：

📘
注:
本文demo需要依托开发软件或者http server来通过访问方可以运行。以开发软件WebStorm为例，点击浏览器访问demo页面：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>TronLink Demo</title>
  </head>
  <body>
    <h2>TronLink Detection Demo</h2>
    <script>
      window.addEventListener("TIP6963:announceProvider", (e) => {
        // Check if the announced provider is TronLink
        if (e.detail.info && e.detail.info.name === "TronLink") {
          alert("You have TronLink installed!");
        }
      });

      // Request all TIP-6963 wallets to announce themselves
      window.dispatchEvent(new Event("TIP6963:requestProvider"));
    </script>
  </body>
</html>

TronWeb其他函数使用请参考文档。

新变量说明

📘
注：
Tronlink chrome v3.22.0 版本开始支持tronLink对象注入，v3.22.0之前版本不支持tronLink对象注入，Tronlink APP 安卓及IOS版本将在 v4.3.4版本开始支持tronLink对象注入。

interface tronLinkParams{
  ready: Bool; //初始化为false， 用户授权后为true
  request: (args: any): any => {};// dapp网站调插件的方法
  sunWeb: sunWeb;
  tronWeb: tronWeb;
}

window.tronLink <tronLinkParams>;


## 示例

window.tronLink = {
  ready: true,
  request: function(){}, // 插件自定义调用入口方法
  sunWeb: sunWeb，
  tronWeb: tronWeb;
}

用户授权

唤起授权框以便用户可以授权账户信息给Dapp网站

interface requestAccountsResponse{
  code: Number, // 200：ok，4000：在队列中，不需要重复提交， 4001：user rejected
  message: String
}

const res: requestAccountsResponse = await tronLink.request({method: 'tron_requestAccounts'})

其中code码如下：

code码	解释
200	用户接受授权
4000	在队列中，不需要重复提交
4001	用户拒绝授权

签名

在完成交易过程当中，TronWeb需要让TronLink来进行签名，这里TronLink重写了签名，签名过程在TronLink中完成，然后把签名后的transaction返还给TronWeb进行广播。我们通过一个示例来了解它：

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>TronLink Demo</title>
  </head>
  <body>
    <button onclick="connect()">Connect TronLink</button>
    <script>
      let provider;

      window.addEventListener("TIP6963:announceProvider", (e) => {
        if (e.detail.info && e.detail.info.name === "TronLink") {
          provider = e.detail.provider;
        }
      });
      window.dispatchEvent(new Event("TIP6963:requestProvider"));

      async function connect() {
        if (!provider) return alert("TronLink not found!");
        try {
          const accounts = await provider.request({
            method: "eth_requestAccounts",
          });
          console.log("Connected: " + accounts[0]);
          const tronweb = provider.tronWeb;
          const tx = await tronweb.transactionBuilder.sendTrx(
            "TN9RRaXkCFtTXRso2GdTZxSxxwufzxLQPP",
            10,
            "TTSFjEG3Lu9WkHdp4JrWYhbGP6K1REqnGQ",
          );
          const signedTx = await tronweb.trx.sign(tx);
          const broastTx = await tronweb.trx.sendRawTransaction(signedTx);
          console.log(broastTx);
        } catch (error) {}
      }
    </script>
  </body>
</html>

当执行代码到 tronweb.trx.sign(tx) 时，TronLink会弹出窗口，来确认签名。

TronWeb其他函数使用请参考文档。