获取钱包中 Solana 代币的余额和所有自定义代币列表

Question

我实际上卡在了连接幻影钱包的第一步。我正在尝试执行以下步骤。

连接到 Phantom 钱包
获得一把Public钥匙
获取所有代币的余额
执行Buy/Sell

我可以使用以下代码连接到幻影钱包。我不确定该过程的下一步是否是获取 public 密钥，以便我可以找到作为帐户一部分的所有代币的余额。

const balance = connection.getBalance(publicKey); 上述方法是我从文档中找到的，但我不确定如何获取将钱包连接到网站的最终用户的 publicKey。

const connection = new solanaWeb3.Connection(solanaWeb3.clusterApiUrl("mainnet-beta")) console.log(connection);

Answer 1

假设您有用于与 solana 钱包集成的 React 应用程序，首先安装这些软件包：

yarn add @solana/wallet-adapter-base \
     @solana/wallet-adapter-react \
     @solana/wallet-adapter-react-ui \
     @solana/wallet-adapter-wallets \
     @solana/web3.js \
     react

你也可以使用 next、vue、angular、svelte 和 material ui

接下来我们进行此设置：

import React, { FC, useMemo } from 'react';
import { ConnectionProvider, WalletProvider } from '@solana/wallet-adapter-react';
import { WalletAdapterNetwork } from '@solana/wallet-adapter-base';
import {
    //LedgerWalletAdapter,
    PhantomWalletAdapter,
    SolflareWalletAdapter,
    //SlopeWalletAdapter,
    //SolletExtensionWalletAdapter,
    //SolletWalletAdapter,
    //TorusWalletAdapter,
} from '@solana/wallet-adapter-wallets';
import {
    WalletModalProvider,
    WalletDisconnectButton,
    WalletMultiButton
} from '@solana/wallet-adapter-react-ui';
import { clusterApiUrl } from '@solana/web3.js';

// Default styles that can be overridden by your app
require('@solana/wallet-adapter-react-ui/styles.css');

export const Wallet: FC = () => {
    // The network can be set to 'devnet', 'testnet', or 'mainnet-beta'.
    const network = WalletAdapterNetwork.Devnet;

    // You can also provide a custom RPC endpoint.
    const endpoint = useMemo(() => clusterApiUrl(network), [network]);

    // @solana/wallet-adapter-wallets includes all the adapters but supports tree shaking and lazy loading --
    // Only the wallets you configure here will be compiled into your application, and only the dependencies
    // of wallets that your users connect to will be loaded.
    const wallets = useMemo(
        () => [
            new PhantomWalletAdapter(),
            new SlopeWalletAdapter(),
            new SolflareWalletAdapter(),
            new TorusWalletAdapter(),
            new LedgerWalletAdapter(),
            new SolletWalletAdapter({ network }),
            new SolletExtensionWalletAdapter({ network }),
        ],
        [network]
    );

    return (
        <ConnectionProvider endpoint={endpoint}>
            <WalletProvider wallets={wallets} autoConnect>
                <WalletModalProvider>
                    <WalletMultiButton />
                    <WalletDisconnectButton />
                    { /* Your app's components go here, nested within the context providers. */ }
                </WalletModalProvider>
            </WalletProvider>
        </ConnectionProvider>
    );
};

导入模块后，我评论了一些钱包适配器，除了phantom和solfare

这个代码块也很重要：

        <ConnectionProvider endpoint={endpoint}>
            <WalletProvider wallets={wallets} autoConnect>
                <WalletModalProvider>
                    <WalletMultiButton />
                    <WalletDisconnectButton />
                    { /* Your app's components go here, nested within the context 
                      providers. */ }
                </WalletModalProvider>
            </WalletProvider>
        </ConnectionProvider>

带有功能按钮的模态框被

包围

ConnectionProvider：为钱包准备连接和查询钱包令牌的端点
WalletProvider：准备哪些钱包应该在模式中加载并准备好连接

最后用法：

import { WalletNotConnectedError } from '@solana/wallet-adapter-base';
import { useConnection, useWallet } from '@solana/wallet-adapter-react';
import { Keypair, SystemProgram, Transaction } from '@solana/web3.js';
import React, { FC, useCallback } from 'react';

export const SendOneLamportToRandomAddress: FC = () => {
    const { connection } = useConnection();
    const { publicKey, sendTransaction } = useWallet();

    const onClick = useCallback(async () => {
        if (!publicKey) throw new WalletNotConnectedError();

        const transaction = new Transaction().add(
            SystemProgram.transfer({
                fromPubkey: publicKey,
                toPubkey: Keypair.generate().publicKey,
                lamports: 1,
            })
        );

        const signature = await sendTransaction(transaction, connection);

        await connection.confirmTransaction(signature, 'processed');
    }, [publicKey, sendTransaction, connection]);

    return (
        <button onClick={onClick} disabled={!publicKey}>
            Send 1 lamport to a random address!
        </button>
    );
};

所以你可以在这部分上面看到

const { connection } = useConnection();
const { publicKey, sendTransaction } = useWallet();

准备建立连接并给你连接钱包 public 密钥，还利用连接钱包的 sendTransaction 功能，听起来不错！

我认为代码的其他部分很明显。

那么，像phantom这样的钱包适配器，我们有多少功能呢？什么功能？我们可以得到 public key, connecting(boolean), connected(boolean), readyState.

我们还有其他一些主要功能，例如：

连接
断开连接
发送交易
签署交易
签署所有交易
signMessage

你可以在这个github repo link

中看到所有这些

另一点是，如果你使用 Anchor 框架，你应该知道 Anchor 使用它自己的“钱包”对象与连接的钱包交互并代表它签署交易。因此，为了获得与 Anchor 的钱包定义兼容的对象，我们可以使用另一个名为 useAnchorWallet 的可组合项。这将 return 一个可以签署交易的钱包对象。

const wallet = useAnchorWallet()

玩得开心

获取钱包中 Solana 代币的余额和所有自定义代币列表

Get Balance and all custom token list of Solana tokens in Wallet

solana

solana-web3js