Orderly Network: SDK钱包连接

在Orderly Network DEX应用中集成钱包连接的全面指南，支持EVM（以太坊、Arbitrum等）和Solana钱包。

使用场景

• - 为新DEX设置钱包连接
• 支持多种钱包类型（MetaMask、Phantom等）
• 实现链切换
• 管理认证状态

前置条件

• - 已安装Orderly SDK包
• 已配置Provider（参见orderly-sdk-dex-architecture）
• 已安装钱包包（@web3-onboard/、@solana/wallet-adapter-）

概述

Orderly Network支持全链交易，意味着用户可以连接来自多个区块链生态系统的钱包：

• - EVM链：以太坊、Arbitrum、Optimism、Base、Polygon、BSC、Avalanche等
• Solana：主网和开发网

SDK提供了一个统一的钱包连接层，抽象了这些生态系统之间的差异。

钱包连接器包

注意：@orderly.network/wallet-connector包开箱即用，带有合理的默认配置。solanaInitial和evmInitial属性都是可选的。

bash

主连接器包

可选：EVM钱包包（用于自定义钱包配置，如WalletConnect）

可选：Solana钱包包（用于自定义Solana钱包配置）

必需依赖项汇总

架构

┌──────────────────────────────────────────────────────────────┐
│ WalletConnectorProvider │
│ ┌───────────────────────────────────────────────────────┐ │
│ │ SolanaProvider │ │
│ │ (ConnectionProvider + WalletProvider + ModalProvider)│ │
│ │ ┌───────────────────────────────────────────────┐ │ │
│ │ │ InitEvm │ │ │
│ │ │ (Web3OnboardProvider for EVM wallets) │ │ │
│ │ │ ┌─────────────────────────────────────────┐ │ │ │
│ │ │ │ Main │ │ │ │
│ │ │ │ (WalletConnectorContext - unified API) │ │ │ │
│ │ │ │ ┌─────────────────────────────────┐ │ │ │ │
│ │ │ │ │ Your App │ │ │ │ │
│ │ │ │ └─────────────────────────────────┘ │ │ │ │
│ │ │ └─────────────────────────────────────────┘ │ │ │
│ │ └───────────────────────────────────────────────┘ │ │
│ └───────────────────────────────────────────────────────┘ │
└──────────────────────────────────────────────────────────────┘

基本设置

重要：networkId必须在WalletConnectorProvider（Solana网络）和OrderlyAppProvider之间保持一致。

1. WalletConnectorProvider

使用WalletConnectorProvider包裹您的应用。

最小设置（使用默认配置）：

tsx
import { WalletConnectorProvider } from @orderly.network/wallet-connector;
import { OrderlyAppProvider } from @orderly.network/react-app;
import type { NetworkId } from @orderly.network/types;

function App() {
const networkId: NetworkId = mainnet;

return (

brokerId=yourbrokerid
brokerName=Your DEX Name
networkId={networkId}
>



);
}

自定义设置（显式钱包配置）：

tsx
import { WalletConnectorProvider } from @orderly.network/wallet-connector;
import { WalletAdapterNetwork } from @solana/wallet-adapter-base;
import { OrderlyAppProvider } from @orderly.network/react-app;
import type { NetworkId } from @orderly.network/types;

function App() {
const networkId: NetworkId = mainnet;

return (
solanaInitial={{
network:
networkId === mainnet ? WalletAdapterNetwork.Mainnet : WalletAdapterNetwork.Devnet,
wallets: getSolanaWallets(),
}}
evmInitial={{
options: {
wallets: getEvmWallets(),
appMetadata: {
name: My DEX,
description: Decentralized Exchange,
},
},
}}
>
brokerId=yourbrokerid
brokerName=Your DEX Name
networkId={networkId}
>



);
}

2. 配置EVM钱包

tsx
import injectedOnboard from @web3-onboard/injected-wallets;
import walletConnectOnboard from @web3-onboard/walletconnect;
import binanceWallet from @binance/w3w-blocknative-connector;

export function getEvmWallets() {
const walletConnectProjectId = YOURWALLETCONNECTPROJECT_ID;

return [
// 注入式钱包（MetaMask、Rabby、Coinbase等）
injectedOnboard(),

// Binance Web3钱包
binanceWallet({ options: { lng: en } }),

// WalletConnect（用于移动端钱包）
walletConnectOnboard({
projectId: walletConnectProjectId,
qrModalOptions: { themeMode: dark },
dappUrl: window.location.origin,
}),
];
}

3. 配置Solana钱包

tsx
import { WalletAdapterNetwork } from @solana/wallet-adapter-base;
import {
PhantomWalletAdapter,
SolflareWalletAdapter,
LedgerWalletAdapter,
} from @solana/wallet-adapter-wallets;

export function getSolanaWallets(networkId: mainnet | testnet) {
return [new PhantomWalletAdapter(), new SolflareWalletAdapter(), new LedgerWalletAdapter()];
}

使用钱包连接

访问钱包上下文

SDK提供了统一的WalletConnectorContext：

tsx
import { useContext } from react;
import { WalletConnectorContext } from @orderly.network/hooks;

function WalletStatus() {
const {
connect, // 连接钱包函数
disconnect, // 断开钱包函数
connecting, // 布尔值：连接进行中
wallet, // 已连接的钱包信息
connectedChain, // 当前链信息
setChain, // 切换链函数
namespace, // evm | solana | null
} = useContext(WalletConnectorContext);

return (

连接到特定链

tsx
const { connect } = useContext(WalletConnectorContext);

// 连接到EVM链（Arbitrum）
await connect({ chainId: 42161 });

// 连接到Solana
await connect({ chainId: 900900900 }); // Solana主网

切换链

tsx
const { setChain, connectedChain } = useContext(WalletConnectorContext);

// 切换到Optimism
await setChain({ chainId: 0xa }); // EVM的十六进制格式

// 切换到Base
await setChain({ chainId: 0x2105 });

账户状态机

钱包连接后，用户