Integrate Web3Auth with the Tron Blockchain in JavaScript
Overview
This guide will help you integrate Web3Auth with the Tron blockchain using JavaScript. You'll be
using the TronRpc
class that interacts with the Tron blockchain via the TronWeb library, allowing
you to perform various operations like getting the user's account, fetching balances, sending
transactions, and signing messages.
Installation
First, you need to install the required dependencies:
npm install @web3auth/base tronweb
Creating the TronRpc
Class
Here’s the TronRpc
class that you will use to interact with the Tron blockchain:
import TronWeb from "tronweb";
import type { IProvider } from "@web3auth/base";
export default class TronRpc {
private tronWeb: TronWeb | null = null;
private provider: IProvider;
constructor(provider: IProvider) {
this.provider = provider;
}
async init(): Promise<void> {
try {
const privateKey = await this.getPrivateKey();
if (!privateKey) throw new Error("Private key is not available.");
this.tronWeb = new TronWeb({
fullHost: "https://api.shasta.trongrid.io",
privateKey,
});
} catch (error) {
console.error("Error initializing TronWeb:", error);
}
}
async getPrivateKey(): Promise<string | null> {
try {
const privateKey = await this.provider.request<string, string>({
method: "eth_private_key",
});
if (!privateKey || typeof privateKey !== "string")
throw new Error("Invalid private key received.");
return privateKey;
} catch (error) {
console.error("Failed to get private key:", error);
return null;
}
}
async getChainId(): Promise<string> {
try {
return this.provider.chainId;
} catch (error) {
console.error("Failed to get chain ID:", error);
throw error;
}
}
async getAccounts(): Promise<string[]> {
this.ensureTronWebInitialized();
const address = this.tronWeb!.defaultAddress.base58;
return [address];
}
async getBalance(): Promise<string> {
this.ensureTronWebInitialized();
const address = this.tronWeb!.defaultAddress.base58;
const balance = await this.tronWeb!.trx.getBalance(address);
return this.tronWeb!.fromSun(balance); // Convert from SUN to TRX
}
async sendTransaction(): Promise<object> {
try {
if (!this.tronWeb) throw new Error("TronWeb not initialized");
const fromAddress = this.tronWeb.defaultAddress.base58;
const destination = "TKCq1vaJqpoXN5dhcPyWv8y7gug7XaNkEx";
const amount = 1000000; // 1 TRX = 1,000,000 SUN
const transaction = await this.tronWeb.transactionBuilder.sendTrx(
destination,
amount,
fromAddress,
);
const signedTransaction = await this.tronWeb.trx.sign(transaction);
const receipt = await this.tronWeb.trx.sendRawTransaction(signedTransaction);
const response = {
from: fromAddress,
to: destination,
success: receipt.result,
explorerLink: `https://shasta.tronscan.org/#/transaction/${receipt.txid}`,
};
return response;
} catch (error) {
console.error("Failed to send transaction:", error);
throw error;
}
}
async signMessage(): Promise<string> {
this.ensureTronWebInitialized();
const message = "YOUR_MESSAGE";
const signedMessage = await this.tronWeb!.trx.sign(this.tronWeb!.toHex(message));
return signedMessage;
}
private ensureTronWebInitialized(): void {
if (!this.tronWeb) {
throw new Error("TronWeb not initialized");
}
}
}
Initializing and Using the TronRpc
Class
1. Initialize Web3Auth and TronRpc
Before interacting with the Tron blockchain, you need to initialize Web3Auth and the TronRpc
class:
import Web3Auth from "@web3auth/web3auth";
import TronRpc from "./TronRpc"; // Adjust the path based on your project structure
const web3auth = new Web3Auth({
clientId: "YOUR_WEB3AUTH_CLIENT_ID",
chainConfig: {
chainNamespace: "eip155",
chainId: "0x2b6653dc", // Tron Mainnet
rpcTarget: "https://api.trongrid.io",
},
});
await web3auth.initModal();
if (web3auth.provider) {
const tronRpc = new TronRpc(web3auth.provider);
await tronRpc.init();
// You can now call the methods of tronRpc to interact with the blockchain
}
2. Getting the Private Key
To interact with the Tron blockchain, you'll need the user's private key. The getPrivateKey
method
in the TronRpc
class handles this:
async getPrivateKey(): Promise<string | null> {
try {
const privateKey = await this.provider.request<string, string>({
method: "eth_private_key",
});
if (!privateKey || typeof privateKey !== 'string') throw new Error("Invalid private key received.");
return privateKey;
} catch (error) {
console.error("Failed to get private key:", error);
return null;
}
}
This method requests the private key from the Web3Auth provider.
3. Getting the Chain ID
To retrieve the chain ID for the Tron blockchain, use the getChainId
method:
async getChainId(): Promise<string> {
try {
return this.provider.chainId;
} catch (error) {
console.error("Failed to get chain ID:", error);
throw error;
}
}
This method returns the chain ID of the connected blockchain.
4. Fetching User Accounts
The getAccounts
method retrieves the user's Tron account address:
async getAccounts(): Promise<string[]> {
this.ensureTronWebInitialized();
const address = this.tronWeb!.defaultAddress.base58;
return [address];
}
This method ensures that TronWeb is initialized and then fetches the user's account address.
5. Getting Account Balance
To fetch the balance of the user's account in TRX, use the getBalance
method:
async getBalance(): Promise<string> {
this.ensureTronWebInitialized();
const address = this.tronWeb!.defaultAddress.base58;
const balance = await this.tronWeb!.trx.getBalance(address);
return this.tronWeb!.fromSun(balance); // Convert from SUN to TRX
}
This method retrieves the balance in SUN (the smallest unit of TRX) and converts it to TRX.
6. Sending a Transaction
The sendTransaction
method allows you to send TRX from the user's account:
async sendTransaction(): Promise<object> {
try {
if (!this.tronWeb) throw new Error("TronWeb not initialized");
const fromAddress = this.tronWeb.defaultAddress.base58;
const destination = "TKCq1vaJqpoXN5dhcPyWv8y7gug7XaNkEx";
const amount = 1000000; // 1 TRX = 1,000,000 SUN
const transaction = await this.tronWeb.transactionBuilder.sendTrx(destination, amount, fromAddress);
const signedTransaction = await this.tronWeb.trx.sign(transaction);
const receipt = await this.tronWeb.trx.sendRawTransaction(signedTransaction);
const response = {
from: fromAddress,
to: destination,
success: receipt.result,
explorerLink: `https://shasta.tronscan.org/#/transaction/${receipt.txid}`,
};
return response;
} catch (error) {
console.error("Failed to send transaction:", error);
throw error;
}
}
This method constructs, signs, and sends a transaction on the Tron blockchain, then returns the transaction details.
7. Signing a Message
To sign a message with the user's private key, use the signMessage
method:
async signMessage(): Promise<string> {
this.ensureTronWebInitialized();
const message = "YOUR_MESSAGE";
const signedMessage = await this.tronWeb!.trx.sign(this.tronWeb!.toHex(message));
return signedMessage;
}
This method signs a message and returns the signed message in hexadecimal format.
Conclusion
With the TronRpc
class and Web3Auth integration, you can easily interact with the Tron blockchain
in your JavaScript applications. Each method in the TronRpc
class corresponds to a specific
blockchain operation, and this guide provides detailed instructions on how to use them.