跳到内容

一个连接器,满足每位交易者的接入需求

在移动端网页上,KyberSwap 交易者通过深度链接连接,该链接会直接打开 MetaMask 应用,而非依赖二维码,iOS 用户将进入授权确认页面。

5 分钟
一个连接器,满足每位交易者的接入需求

KyberSwap 是一个去中心化交易平台,其 DEX 聚合器已为超过 500 万用户促成了逾 1500 亿美元的交易。在将前端整合到 Wagmi v3 和 Viem 的过程中,团队用 MetaMask Connect 提供的官方 metaMask() connector 取代了自行编写的 MetaMask 检测代码。本案例将介绍 KyberSwap 为何做出这一改变、移动端网页发生了哪些变化,以及 Connect 集成如何与 KyberSwap 为 MetaMask 用户提供兑换汇率这一独立角色并行运作。

KyberSwap 的使命:为每一笔交易提供最优汇率

KyberSwap 的 DEX 聚合器是一款去中心化交易解决方案,旨在为每一笔交易提供最优汇率和可靠的执行。它基于 Smart Settlement 运行,这是一种智能路由算法,通过接入跨链的深度流动性,最大化成交输出并尽量降低滑点。围绕这一核心,还有限价单、覆盖 23 个网络的跨链兑换,以及提供收益机会的 Kyber Earn。

对于一个以执行质量为核心的平台来说,入口有一个朴素的要求:连接钱包应该毫不费力。

自行编写的钱包代码是一笔维护成本

KyberSwap 之前的方案是将 Wagmi v2 与 ethers.js 以及一个临时拼凑的 injected connector 层结合使用,其中包括用于检测并连接 MetaMask 的自定义代码。在迁移到 Wagmi v3 和 Viem 的过程中,团队选择弃用这些代码,改用 MetaMask Connect 的官方 connector。

这一决定有三个原因。现在,一个 connector 即可同时覆盖桌面端的浏览器扩展程序,以及移动端网页的深度链接和中继流程。需要维护的自定义钱包检测代码更少了。此外,随着 EIP-6963 和 MetaMask Wallet Protocol (MWP) 成为钱包与 dapp 相互发现的标准方式,沿用 MetaMask 支持的路径也能让 KyberSwap 与之保持一致。

之前

使用 MetaMask Connect 之后

Wagmi v2、ethers.js 以及临时拼凑的 injected connector 方案

Wagmi v3 和 Viem,搭配官方 metaMask() connector

需要维护自行编写的 MetaMask 检测与连接代码

检测与连接均由 connector 处理

移动端网页依赖 WalletConnect 二维码

通过 MWP 中继,以原生深度链接方式连接 MetaMask 应用

需要自定义代码来跟进钱包发现标准

通过 MetaMask 支持的路径与 EIP-6963 和 MWP 保持一致

打造顺畅的移动端跳转

在移动端网页上,二维码并不是一个顺手的方式:用户本来就在手机上。MetaMask Connect 为 KyberSwap 提供了深度链接连接流程,可通过 MWP 中继打开 MetaMask 应用,因此使用手机的交易者无需扫描任何内容即可完成连接。

KyberSwap 在 iOS 端的跳转体验上投入了特别的精力。目标是让用户直接进入 MetaMask 的授权确认界面,从点击连接到确认授权之间不再有任何多余步骤。无论交易者是通过桌面扩展程序还是移动应用进入,最终都能获得一致的连接体验。

技术栈

层级

组件

交易

KyberSwap DEX 聚合器、Smart Settlement、限价单、跨链兑换(23 个网络)、Kyber Earn

前端

Wagmi v3、Viem

钱包连接

MetaMask Connect (connect-evm)、metaMask() connector

发现与传输

EIP-6963、MetaMask Wallet Protocol 中继

钱包

MetaMask 浏览器扩展程序(桌面端)、MetaMask 移动应用

目前成效

自采用 MetaMask Connect 以来,KyberSwap 反馈用户连接一直稳定可靠,上线过程从第一天起就很顺利,也没有收到任何投诉或问题反馈。

用 KyberSwap 的话来说,用户层面的成果是:连接和交易现在感觉就像一步完成。交易者通过 MetaMask 连接后,即可直接以最优汇率进行兑换,中间没有任何阻碍。MetaMask Connect 负责这一流程的入口,其余部分则交给 Smart Settlement。

两项集成,一段合作关系

Connect 集成只是 KyberSwap 与 MetaMask 合作关系的一半。另一半则是反向运作:KyberSwap Aggregator API 为 MetaMask 用户提供跨链的兑换汇率和交易执行。MetaMask Connect 将 MetaMask 用户带入 KyberSwap,而 Aggregator API 则将 KyberSwap 的路由能力带入 MetaMask。

“MetaMask 在两个方面都是我们珍视的合作伙伴。MetaMask Connect 简化了交易者连接 KyberSwap 的方式,无论使用扩展程序还是移动应用,都能获得可靠、一致的体验。与此同时,KyberSwap Aggregator API 也为 MetaMask 用户提供跨链的最优兑换汇率和交易执行。这段合作建立在我们最看重的同一原则之上:让 DeFi 交易对每个人来说都更简单、更顺畅、更高效。” — Ken Tran,KyberSwap 业务拓展经理

KyberSwap 给开发者的建议

以官方文档为准。这样可以确保您的集成符合标准,过渡也比参考旧示例或自定义连接方式更顺畅。

将钱包连接迁移作为整体技术栈清理的一部分。KyberSwap 在升级到 Wagmi v3 和 Viem 的同时替换了其 MetaMask 代码,因此连接器的变更只是计划中整合工作的一环,而不是一个单独的项目。

端到端测试移动端跳转。对用户来说,关键在于点击连接后会跳转到哪里。KyberSwap 已确认 iOS 用户可以直接进入 MetaMask 的授权界面。

结合自身架构进行评估。此次迁移对 KyberSwap 的架构来说进行得很顺利,但每个团队的技术栈各不相同,具体如何选择取决于您产品的需求。

使用 MetaMask Connect 进行构建:一次集成,即可适用于每一位用户,无论他们选择何种方式连接。

AI 翻译。可能包含错误。请务必核实信息。

评价此翻译

本文作者:

  • MetaMask

    MetaMask(前身为 Consensys Software Inc)是全球最大的自托管金融平台,为用户提供一站式服务,涵盖加密资产与传统资产的持有、消费、储蓄与增值。公司正在打造实现上述功能的消费级平台,将支付、储蓄、投资与数字资产整合于一体,带来无缝一体化的使用体验。MetaMask 脱胎于全球使用最广泛的自托管钱包,让用户直接掌控自己的资金与资产,覆盖约 190 个国家和地区。自 2016 年起,MetaMask 在以太坊的发展历程中扮演了举足轻重的奠基角色。如今,MetaMask 处于区块链经济的核心位置,致力于构建「开放货币」的操作系统,让每个人都能全面掌控自己的财务生活。

    阅读所有文章