集成效果展示

开始集成

1. 服务器端生成加载SDK所需参数

1.1 联系Legend 获取安全参数

1.2 生成电子签名 signature

请根据Legend 提供的加密算法代码，每次调用SDK前，计算一个电子签名signature，传递给前端。

1.3 生成用户UID

Legend 以你方后端从内部 user_id（用户表主键）推导出的 UID 标识用户，另有一个仅供前端 JSSDK 使用的第二轮产物 APP_UID。必须每个用户唯一、不重复，且两者不可互换：

UID（第一轮值）= 你方对 user_id 的不可逆哈希，推荐 sha1(user_id + salt)——40 位十六进制，最长 100 字符。该字符串同时也是此用户所有服务端 API 调用的 uid 入参；Legend 将其原样落库为用户外部 ID。
APP_UID（第二轮产物）= TBClient.encryptUID(UID)——仅限前端 JSSDK 的 app-uid 属性。严禁把 APP_UID（或任何含 : 的值）当作服务端 API 的 uid 传入。

user_id = "1";                  // 交易所内部主键
UID     = sha1(user_id + salt); // 例如 42fa5da9de51f2caa39217c4b8bece42ff6029cf
APP_UID = TBClient.encryptUID(UID);
// 例如 sdfSEEC293K7cYPMJRF07dBoinizp2pKRGiuQlfwzrfh8wZ9qAbGx3+OAMenykBenxH1lKgFOX:M4QXifPj+nsIumRqthAogw==

加密每次调用使用全新随机 IV，因此你的 APP_UID 与任何示例都不同——可通过解密回 UID 来自行验证。完整的术语表、流程图、端到端可复现示例与 Java 示例代码见获取签名。

完成以上操作后，前端页面中存在当前用户的唯一ID，可以用于确定当前用户，但又不用担心被破解。黑客无法还原真实的UID，更无法得到交易所用户表中最原始的user_id。

2. 加载SDK

Legend提供交易系统需要的所有KYC和交易界面，所有复杂界面仅需您通过在前端嵌入几行代码即可实现。

Legend SDK 是一个由 Vue, Vue Router 和 Ant Design Vue 开发的应用组件。我们使用 Web Components 技术来实现 SDK。 SDK 会在不支持 Web Components 特性的平台中降级为普通的 HTML 元素。

从外部导入 Vue

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>
<script src="https://content.legendtrading.com/jssdk-v3/legend-trade.min.js"></script>

<!-- use in plain HTML, or in any other framework -->
<legend-trade 
  signature="o5lnLOd/HxNMXWz2zZEKJvv+wiTxe3FjHFmUyskR4IY=" 
  timestamp="1587420765"
  app-id="Bitrue"
  app-key="xxxxxxxx" 
  app-url="https://www.bitrue.com/" 
  app-uid="sdfSEEC293Bd1ZZ5VO98z8Gf/z39m6RjSxhdOV9nW+8+6j9j+ZV2OOfXWwyChSJ3+xzRZulDyi:OTg3NjVmZWRjYmE0MzIxMA=="
  app-email="[email protected]"
></legend-trade>

从 SDK 导入 Vue

S<script src="https://content.legendtrading.com/jssdk-v3/legend-trade-full.min.js"></script>

<!-- use in plain HTML, or in any other framework -->
<legend-trade-full 
  signature="o5lnLOd/HxNMXWz2zZEKJvv+wiTxe3FjHFmUyskR4IY=" 
  timestamp="1587420765"
  app-id="Bitrue"
  app-key="xxxxxxxx" 
  app-url="https://www.bitrue.com/" 
  app-uid="sdfSEEC293Bd1ZZ5VO98z8Gf/z39m6RjSxhdOV9nW+8+6j9j+ZV2OOfXWwyChSJ3+xzRZulDyi:OTg3NjVmZWRjYmE0MzIxMA=="
  app-email="[email protected]"
></legend-trade-full>

点击查看SDK 更多参数

使用SDK快速接入