Інтеграція гаманця Trust Wallet
Trust Wallet — мобільний first гаманець зі вбудованим DApp браузером. Інтеграція відрізняється від MetaMask в одному важливому аспекті: користувач або відкриває ваш dApp прямо в браузері Trust Wallet, або використовує Trust Wallet через WalletConnect. Два зовсім різні шляхи підключення, які потрібно обробляти правильно.
Механізми підключення
Вбудований браузер Trust Wallet
Коли користувач відкриває dApp в браузері всередині додатка Trust Wallet, той інжектує window.ethereum провайдер. Це стандартний EIP-1193 провайдер — працює як MetaMask. Ви можете ідентифікувати Trust Wallet за допомогою window.ethereum.isTrust або window.trustwallet:
const isTrustWalletBrowser = window.ethereum?.isTrust || !!window.trustwallet
Для цього шляху достатньо стандартного ethers.js або viem з window.ethereum:
import { createWalletClient, custom } from "viem"
import { mainnet } from "viem/chains"
const client = createWalletClient({
chain: mainnet,
transport: custom(window.ethereum)
})
const [address] = await client.requestAddresses()
WalletConnect v2
Для користувачів десктопного браузера Trust Wallet підключається через WalletConnect. WalletConnect v2 — це WebSocket-релей з end-to-end шифруванням, підключення через QR-код або deep link.
WalletConnect v1 задеплоєний. Мігруйте на v2. З червня 2023 року v1 сервери вимкнені.
Для реалізації використовуємо wagmi + @web3modal/wagmi або RainbowKit — вони вже включають WalletConnect коннектор та Trust Wallet. Вручну:
import { WalletConnectConnector } from "@wagmi/connectors/walletConnect"
const connector = new WalletConnectConnector({
options: {
projectId: "YOUR_WC_PROJECT_ID", // від cloud.walletconnect.com
metadata: {
name: "My dApp",
description: "Description",
url: "https://app.example.com",
icons: ["https://app.example.com/icon.png"]
}
}
})
Рекомендований підхід: wagmi + WalletConnect
Правильний шлях — не писати інтеграцію з нуля, а використовувати wagmi з RainbowKit або ConnectKit. Trust Wallet підтримується з коробки.
import { TrustWalletConnector } from "@wagmi/connectors/trustWallet"
import { createConfig, configureChains } from "wagmi"
import { mainnet, polygon } from "wagmi/chains"
import { alchemyProvider } from "wagmi/providers/alchemy"
const { chains, publicClient } = configureChains(
[mainnet, polygon],
[alchemyProvider({ apiKey: process.env.ALCHEMY_KEY! })]
)
const config = createConfig({
autoConnect: true,
connectors: [
new TrustWalletConnector({ chains }),
// WalletConnect як fallback
],
publicClient
})
Deep Links для мобільних користувачів
Trust Wallet підтримує deep link схему для відкриття dApp прямо в своєму браузері:
https://link.trustwallet.com/open_url?coin_id=60&url=https%3A%2F%2Fapp.example.com
coin_id=60 — це Ethereum. Для інших мереж: 195 (TRON), 714 (BNB Chain), 966 (Polygon).
Кнопка «Відкрити в Trust Wallet» на мобільній версії сайту — UX improvement, який дійсно збільшує конверсію в підключення на мобільних пристроях.
Підписання трансакцій та повідомлень
Trust Wallet підтримує стандартні методи:
-
personal_sign— підпис довільного повідомлення -
eth_signTypedData_v4— EIP-712 структуровані дані -
eth_sendTransaction— відправка трансакцій
Нюанс: при відображенні трансакції Trust Wallet показує декодовані дані, якщо знає ABI. Для кращого UX — верифікуйте контракт на Etherscan, тоді користувач бачить читаємий вид трансакції, а не hex дані.
Строки
Базова інтеграція через wagmi + Trust Wallet connector + WalletConnect v2 — 1 день. Включаючи мобільний deep link та тестування в реальному додатку Trust Wallet — 2 дні.