Phantom钱包与React Native集成教程咨询

Phantom 官方目前没有针对 React Native 的专属集成文档，不过可以通过深度链接（Deep Link）+ Phantom 移动端 Deeplink 协议实现集成，以下是具体步骤：

一、配置 React Native 深度链接 #

需要先为你的 RN 应用配置自定义 URL Scheme，同时允许调用 Phantom 的 Scheme。

iOS 配置 #

在 Info.plist 中添加以下内容：

<!-- 允许查询 Phantom 应用的 Scheme -->
<key>LSApplicationQueriesSchemes</key>
<array>
  <string>phantom</string>
</array>

<!-- 配置你的应用自定义 Scheme，示例为 myapp:// -->
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>myapp</string>
    </array>
  </dict>
</array>

Android 配置 #

在 AndroidManifest.xml 的 MainActivity 标签内添加：

<!-- 处理自定义 Scheme 的回调 -->
<intent-filter>
  <action android:name="android.intent.action.VIEW" />
  <category android:name="android.intent.category.DEFAULT" />
  <category android:name="android.intent.category.BROWSABLE" />
  <data android:scheme="myapp" />
</intent-filter>

<!-- 允许查询 Phantom 应用 -->
<queries>
  <package android:name="com.phantom.app" />
</queries>

二、实现钱包连接逻辑 #

利用 React Native 的 Linking API 调用 Phantom 的 Deeplink，配合加密密钥对完成连接验证。

1. 安装依赖 #

npm install tweetnacl-react-native

该库用于生成 Dapp 密钥对，和 Phantom 进行加密通信。

2. 连接钱包代码示例 #

import { Linking, useEffect, Alert } from 'react-native';
import nacl from 'tweetnacl-react-native';

// 生成 Dapp 专属密钥对（建议只生成一次，持久化存储）
const dappKeyPair = nacl.box.keyPair();
const dappPublicKey = Buffer.from(dappKeyPair.publicKey).toString('base64');

// 发起 Phantom 连接请求
const connectPhantom = async () => {
  const redirectUrl = 'myapp://phantom-callback';
  const deepLink = `phantom://connect?dapp_encryption_public_key=${dappPublicKey}&redirect_link=${encodeURIComponent(redirectUrl)}`;
  
  const canOpen = await Linking.canOpenURL(deepLink);
  if (!canOpen) {
    Alert.alert('提示', '请先安装 Phantom 钱包应用');
    return;
  }
  
  await Linking.openURL(deepLink);
};

// 监听 Phantom 回调
useEffect(() => {
  const handleCallback = async (event) => {
    const url = event.url;
    if (!url.startsWith('myapp://phantom-callback')) return;
    
    const params = new URLSearchParams(url.split('?')[1]);
    const walletPublicKey = params.get('public_key');
    const nonce = params.get('nonce');
    const encryptedData = params.get('data');
    
    // 解密并验证数据（参考 Phantom 加密规范）
    const decodedNonce = Buffer.from(nonce, 'base64');
    const decodedData = Buffer.from(encryptedData, 'base64');
    const decrypted = nacl.box.open(decodedData, decodedNonce, Buffer.from(walletPublicKey, 'base64'), dappKeyPair.secretKey);
    
    if (decrypted) {
      console.log('连接成功，钱包公钥：', walletPublicKey);
      // 后续可存储钱包公钥，用于签名交易/消息
    } else {
      Alert.alert('错误', '连接验证失败');
    }
  };

  Linking.addEventListener('url', handleCallback);
  return () => Linking.removeEventListener('url', handleCallback);
}, []);

三、签名交易/消息 #

同样通过 Deeplink 调用 Phantom 的对应接口，示例如下：

签名消息 #

const signMessage = async (walletPublicKey, message) => {
  const encodedMessage = Buffer.from(message).toString('base64');
  const redirectUrl = 'myapp://phantom-sign-callback';
  const deepLink = `phantom://signMessage?public_key=${walletPublicKey}&message=${encodedMessage}&redirect_link=${encodeURIComponent(redirectUrl)}`;
  
  await Linking.openURL(deepLink);
};

// 监听签名回调逻辑类似连接回调，解析返回的签名结果即可

关键注意事项 #

• 必须在真机上测试，模拟器无法识别已安装的 Phantom 应用。
• 所有 URL 参数需用 encodeURIComponent 编码，避免解析错误。
• 交易签名需按照 Solana 交易格式构造参数，具体字段参考 Phantom 官方 Web 文档中的签名规范。

内容的提问来源于stack exchange，提问作者Drew Hilario