帮你快速理解、总结文档立即下载
文档中心>智能媒资托管>SDK 文档>SMH UIKit>微信小程序 UIKit

微信小程序 UIKit

最近更新时间：2026-05-06 17:29:22
我的收藏

本页目录：

准备工作

1. 您需要一个微信小程序应用，这个应用可以是您现有的工程，也可以是您新建的一个空的工程。
2. 请确保您的微信小程序的基础库版本为 3.6.1 或更高版本。
3. SMH UIKit 以分包形式集成到您的小程序中。

操作步骤

步骤1：拷贝分包目录

从 cnb 根目录下 miniapp 目录下载 小程序分包代码，将所有文件拷贝到您小程序项目根目录下的 `smh-ui-kit/` 目录：
your-miniapp-project/
├── pages/                  # 您的主包页面
│   └── index/
├── smh-ui-kit/             # 将 smh uikit 文件放到这里（整个目录）
├── app.js
├── app.json
└── project.config.json
注意：
请保持 smh-ui-kit/ 内部的文件结构不变，不要移动或删除其中的文件。

步骤2：配置分包路由

在 app.json 中添加分包配置：
{
  "pages": [
    "pages/index/index"
  ],
  "subPackages": [
    {
      "root": "smh-ui-kit",
      "pages": ["index"]
    }
  ],
  "window": {
    "navigationStyle": "custom"
  }
}

步骤3：注册 AccessTokenProvider

当前发布产物中的 smh-ui-kit/index.js 已经内置完成 SDK 初始化、全局方法挂载和页面注册；宿主侧不需要再手动 require('./smh-ui-kit/lib/miniApp.js') 或调用 initSDK() / initApp()。
宿主只需要在打开页面前，将 AccessTokenProvider 注册到全局表：
if (!global._smhAccessTokenProviders) {
  global._smhAccessTokenProviders = {};
}

function createSmhAccessTokenProvider() {
  return function(callback) {
    wx.request({
      url: 'https://your-server.com/api/smh/token',
      success: function(res) {
        callback({
          token: res.data.token,
          accessToken: res.data.token,
          startTime: res.data.startTime,
          expiresIn: res.data.expiresIn
        });
      },
      fail: function() {
        callback({ errorMsg: '获取 Token 失败' });
      }
    });
  };
}

步骤4：跳转到分包页面

通过路由参数传入 SmhConfig 和 smh_access_token_provider_key：
function openSmhPage() {
  var providerKey = 'provider_' + Date.now();
  var smhConfig = {
    host: 'https://xxx.api.tencentsmh.cn',
    libraryId: 'your-library-id',
    spaceId: 'your-space-id'
  };

  global._smhAccessTokenProviders[providerKey] = createSmhAccessTokenProvider();

  wx.navigateTo({
    url: '/smh-ui-kit/index?SmhConfig='
      + encodeURIComponent(JSON.stringify(smhConfig))
      + '&smh_access_token_provider_key='
      + encodeURIComponent(providerKey)
      + '&page_name=smh_netdisk'
  });
}
其中：
SmhConfig：SMH 配置对象，SDK 会自动从路由参数中读取
smh_access_token_provider_key：用于在全局 provider 注册表中定位当前页面实例对应的 TokenProvider
page_name：可选，默认值为 smh_netdisk

SmhConfig 参数

参数
说明
类型
是否必填
host
SMH API 地址，如 https://xxx.api.tencentsmh.cn
String
是
libraryId
媒体库 ID
String
是
spaceId
空间 ID
String
是
path
初始 space 目录路径，默认根目录
String
否
userId
用户 ID（SMH 服务端概念）
String
否

AccessToken 参数

参数
说明
类型
是否必填
token
访问凭证
String
是
startTime
Token 起始时间（毫秒时间戳）
number
是
expiresIn
有效时长（秒）
number
是
说明：
startTime 和 expiresIn 用于描述 Token 有效期。SDK 内部会优先复用未过期 Token，接入方无需额外管理 Token 生命周期。

中国站