dflow-phantom-connect

Phantom Connect + DFlow 技能

说明

步骤 1：确定用户想要构建什么

确定领域，然后查阅相应参考资料。

钱包连接和 Solana 交互：

• 连接 Phantom 钱包（React、React Native、vanilla JS）
• 签署消息或交易
• 代币门控访问
• 铸造 NFT
• 加密货币支付
• Solana 转账（SOL 或 SPL 代币）

DFlow 交易与市场数据：

• 现货代币兑换（报价、签名、提交、确认）
• 实时价格、订单簿深度或优先费流

许多任务会结合两者（例如，兑换界面既需要钱包连接，也需要 DFlow 交易）。编写代码前，请阅读所有相关参考资料。

步骤 2：阅读相关参考资料

Phantom Connect SDK（钱包连接、签名、身份验证）：

• references/react-sdk.md：React hooks、组件、主题设置、PhantomProvider
• references/react-native-sdk.md：Expo 配置、polyfill、深层链接、移动端身份验证
• references/browser-sdk.md：BrowserSDK 初始化、事件、钱包发现、vanilla JS

Solana 模式（交易、门控、铸造、支付）：

• references/transactions.md：SOL/SPL 转账、签名、费用估算
• references/token-gating.md：客户端和服务端的代币门控访问
• references/nft-minting.md：铸造页面、Metaplex Core、压缩 NFT
• references/payments.md：SOL/USDC 支付、通过后端验证的结账流程

DFlow（兑换、流式数据）：

• references/dflow-crypto-trading.md：通过 /order 进行现货兑换（原子单位、base58 铸币地址、无需钱包即可报价、优先费／平台费／赞助费）
• references/dflow-websockets.md：实时报价、订单簿和优先费流（浏览器通过后端代理）

步骤 3：提出恰当的问题

实施前，请根据领域提出问题：

对于 Phantom Connect 任务：

• 使用哪个平台？（React、React Native、vanilla JS）
• 是否需要社交登录（Google/Apple），还是仅使用扩展程序？

对于 DFlow 任务：

• 是否有 DFlow API 密钥？（有：使用 prod 主机并提供 x-api-key。没有：使用 dev 主机，但会受到速率限制。Prod 密钥：pond.dflow.net/get-started/api-key。）一个密钥即可用于所有 DFlow 服务。
• 客户端环境是什么？（Web、移动端、后端、CLI）浏览器应用应将密钥保存在后端，并通过后端代理 DFlow HTTP 和 WebSocket。
• 是否需要平台费？如果需要，费率是多少 bps？使用哪个由构建方拥有的费用账户（该账户必须已存在）？

步骤 4：实施

遵循参考文件中的模式。各领域的关键规则：

Phantom Connect：

• 所有 SDK 详情（Provider 设置、hooks、组件、身份验证 Provider）都在 SDK 参考文件中。编写 Phantom 集成代码前，请先阅读这些文件。

DFlow：

• 交易是同步的：一次 /order 调用会返回一笔可供签名的交易，接着对其签名、提交并确认。
• 出于安全最佳实践，应将 DFlow API 密钥保存在后端，而非浏览器代码中。浏览器应用应通过后端代理 DFlow HTTP（/order 不提供 CORS）和 WebSocket 流。
• Dev 端点（dev-quote-api.dflow.net）无需密钥即可使用，但会受到速率限制；生产环境需要从 pond.dflow.net/get-started/api-key 获取密钥。在生产环境中，报价和订单簿流的访问权限按密钥授予。

步骤 5：处理错误

每个参考文件都包含特定领域的错误处理方式。需要关注的通用问题：

• 用户拒绝交易或签名请求
• 尝试执行签名操作时，钱包尚未连接
• DFlow API 返回 429（速率受限）：退避重试或获取生产 API 密钥
• DFlow 返回 route_not_found：可能是该交易规模下交易对流动性不足；也请检查铸币地址，以及 amount 是否使用原子单位

示例

示例 1：React 钱包连接

用户说：“为我的 Next.js 应用添加 Phantom 钱包登录”

操作：

1. 阅读 references/react-sdk.md
2. 安装 @phantom/react-sdk
3. 使用所需的身份验证提供方和 appId 包装应用
4. 使用 useModal hook 创建连接按钮
5. 使用 useAccounts 显示已连接的钱包地址

结果：实现支持社交登录和扩展程序的钱包连接

示例 2：代币门控页面

用户说：“构建一个只有 BONK 持有者才能查看的页面”

操作：

1. 阅读 references/react-sdk.md 和 references/token-gating.md
2. 设置钱包连接
3. 查询已连接钱包的 BONK 代币余额
4. 根据余额阈值有条件地渲染内容
5. 用于生产环境：添加服务器端签名验证

结果：页面可检查钱包代币余额并限制内容访问

示例 3：DFlow 代币兑换

用户说：“使用 DFlow 添加兑换功能”

操作：

1. 询问：API 密钥？客户端环境？平台费用？
2. 阅读 references/dflow-crypto-trading.md
3. 使用 /order 流程：请求订单（在浏览器中通过后端代理），反序列化返回的交易，签名、提交并确认
4. 在浏览器中，使用 Phantom SDK 签名并发送（参见 references/transactions.md）；在服务器端，使用密钥对签名并通过 RPC 提交

结果：实现由 DFlow 路由的代币兑换

示例 4：带钱包连接的完整兑换页面

用户说：“构建一个带钱包连接和 DFlow 的完整兑换页面”

操作：

1. 询问：使用哪个平台？API 密钥？平台费用？
2. 阅读相关 SDK 参考文档和 references/dflow-crypto-trading.md
3. 使用 Phantom SDK 设置钱包连接
4. 构建兑换表单；通过后端代理 /order，确保密钥保留在服务器端
5. 使用 Phantom SDK 签名并发送，然后确认

结果：构建端到端兑换页面，结合 Phantom 钱包和 DFlow 交易

示例 5：实时订单簿

用户说：“显示某个代币交易对的实时订单簿”

操作：

1. 阅读 references/dflow-websockets.md
2. 搭建一个持有密钥的后端中继服务，使用 x-api-key 标头打开 /book-stream，并将帧中继到浏览器
3. 使用 { op: "subscribe", base_mint, quote_mint } 订阅；渲染按槽位批量发送的 updates[]
4. 断开连接时重新连接并重新订阅

结果：实现实时订单簿流，密钥保留在服务器端

资源

• Phantom Portal：phantom.com/portal/login
• Phantom 文档：docs.phantom.com/introduction
• SDK 示例：github.com/phantom/phantom-connect-sdk/tree/main/examples
• Phantom MCP 服务：docs.phantom.com/resources/mcp-server
• DFlow MCP 服务：pond.dflow.net/mcp
• DFlow MCP 文档：pond.dflow.net/ai/mcp
• DFlow 文档：pond.dflow.net/introduction