短视频 SDK 微信小程序多端框架

多端框架 SDK 的版本要求:iOS SDK ≥ 1.4.18;Android SDK ≥ 1.5.2。

相关产品
短视频 SDK 产品页,含版本规格、价格与购买入口。

一、权限要求

·Android 端要求在适应 SDK 接口前申请好权限:android.permission.WRITE_EXTERNAL_STORAGE。

·iOS 端要求在适应 SDK 接口前申请好权限 NSAppleMusicUsageDescription 。

二、插件配置

打开多端应用,找到 project.miniapp.json 配置文件,找到其中的多端插件配置选项。

三、Android 插件配置

在 Android 插件配置中,需要填写下面选项:

1. 是否启用此插件:勾选

2. 插件 ID:wx9cfd2cd2a9497bf6

3. 插件版本:1.0.0(示例值)

4. 插件配置文件:不填

四、iOS 插件配置

在 iOS 插件配置中,需要填写下面选项:

1. 是否启用此插件:勾选

2. 插件 ID:wx9cfd2cd2a9497bf6

3. 插件版本:1.0.0(示例值)

4. 插件配置文件:不填

五、集成 JS API

在 miniprogram 目录下执行如下命令安装 donut-ugc-editor :

npm i donut-ugc-editor

在微信开发者工具中构建 npm(路径:微信开发者工具 > 工具 > 构建 npm)。

六、使用方法

1. 引入 jsapi

import UGCEditor from "donut-ugc-editor"

2. 设置 License

2.1 参见 License 申请 的指引申请 License 后,从 云点播控制台 复制 License Key 和 License URL:

2.2 在项目中调用 UGCEditor#setUGCLicense 方法来设置 License:

UGCEditor.setUGCLicense( $licenseUrl, $licenseKey, (code,msg) => { console.log("setUGCLicense listener => code:"+code+",msg:"+msg); } );

调用 UGCEditor#setUGCLicense 方法来设置 License 信息,需要的参数为:

·licenseUrl :腾讯云申请到的 licenseUrl 信息。

·licenseKey :腾讯云申请到的 licenseKey 信息。

·callback :(code: number, msg: string) => void 。License 设置的回调信息,code = 0 时为成功,否则失败。

3. 进入 UGC 编辑页

UGCEditor.openUGCEditor( $wxFilePath, $minDurationInMilliSec, $maxDurationInMilliSec, (resultJSON)=>{ console.log("openUGCEditor success listener => resultJSON:"+JSON.stringify(resultJSON, null, 2)); }, (errorMsg)=>{ console.log("openUGCEditor fail listener => errorMsg:"+errorMsg); }, ()=>{ });

调用 UGCEditor.openUGCEditor 方法来进入到 UGC 编辑页面,它所需要的参数如下:

·wxFilePath:要编辑的文件路径 (MP4格式),示例:wxfile://xxxxx.mp4。

·minDurationInMilliSec:编辑后视频的最小时长,单位 ms。

·maxDurationInMilliSec:编辑的最大时长,单位 ms。

·success: (jsonStr: string) => void ,编辑完成之后的回调,返回编辑后视频的信息,格式为 JSON,内容包括:

duration:编辑后的视频时长,单位ms。

size:编辑后视频的文件大小,单位byte。

tempFilePath:编辑后视频路径,示例:wxfile://xxxxx。

tempThumbPath:编辑后视频封面图路径,示例:wxfile://xxxxx。

·failed: (errMsg: string) => void ,编辑失败的错误信息。

七、运行效果示例

该方法执行之后,会调起 UGC 视频编辑页面,运行示例截图如下:

 
赞 (0)
上一篇 4天前
下一篇 4天前