本文介绍AUI Kits低代码集成工具提供Windows开播小助手的操作方式及相关代码示例等内容。
背景信息
针对互动直播场景横屏样式,AUI Kits低代码集成工具提供Windows端的开播客户端《开播小助手》。
通过该客户端,主播用户可以实现以下开播功能:
摄像头采集视频画面推流,支持切换至外接摄像设备,支持美颜特效设定(需要额外付费)。
共享屏幕、其他应用窗口及系统音频,共享屏幕时支持与上述摄像头画面叠加。
麦克风采集音频信号推流,支持切换至外设麦克风设备。
设定直播画质。
聊天互动,支持设定全员禁言。
支持导入本地多媒体MP4文件插播。
集成方可以通过URL唤起《开播小助手》,若需要基于《开播小助手》进行二次开发,请您联系商务经理沟通定向开源事宜。
更多AUI Kits问题咨询及使用说明,请搜索钉钉群(35685013712)加入AUI客户支持群联系我们。
前提条件
为保证开播小助手能够正常使用,请确保您的设备满足以下条件:
内存:8GB及以上。
CPU:酷睿i5或R7处理器及以上。
显卡:推荐使用独立显卡。
说明如果您的电脑拥有双显卡,请切换至独立显卡。
显卡驱动:推荐安装最新版本。
操作系统:Windows 10及以上64位版本的操作系统。
麦克风:推荐使用外置麦克风或带麦克风的耳机。
网络:推荐10 Mbps及以上的上行带宽。
下载安装
下载地址
下载地址请参见Windows端开播小助手。
安装说明
安装开始前,为避免客户端无法启动等问题,推荐将开播小助手安装至默认路径。
安装过程中,如果安全软件提示存在风险,请忽略并跳过处置即可。
安装成功后,如果无法启动开播小助手,请退出所有安全软件后尝试卸载重装开播小助手。
集成唤起
推荐集成方以如下逻辑唤起开播小助手,以下功能需要您根据您的系统自行开发:
获取开播链接
前提条件
所使用的接口依赖于AppServer服务,请先部署、运行、接入直播间AppServer,操作方式参见服务端集成。
示例代码
以下为生成开播链接的示例代码,需要在项目中引入依赖axios,引入示例:npm install axios --save,您可以根据您的实际情况换用其他的HTTP库。
import axios from 'axios';
// 这里填入您的 Appserver 域名,结尾字符请勿是 /
const origin = '';
const username = 'AUILivePusher';
const password = username;
const anchorNick = '小助手测试员';
// 请结合服务端判断互动消息服务使用的版本,旧版时为 v1,新版时为 v2
const version = 'v1';
async function genurl() {
// 先调用 login 接口获取身份 token
const res = await axios.post(
`${origin}/api/v1/live/login`,
{
username,
password,
},
{
headers: {
accept: 'application/json',
'Content-Type': 'application/json',
},
}
);
const { token } = res.data;
const now = new Date();
// 创建直播间,获取直播间 id
const createApi = `${origin}/api/${version}/live/create`;
const liveIdRes = await axios.post(
createApi,
{
anchor: username,
anchor_nick: anchorNick,
extends: JSON.stringify({
userNick: anchorNick,
userAvatar: '',
}),
mode: 0, // 直播间类型,0:普通直播,1:连麦直播
notice: '直播公告',
title: `直播测试${now.getMonth() + 1}${now.getDate()}`,
// 新版 v2 接口使用,请结合实例情况是否开启
im_server: version === 'v2' ? ['aliyun_new'] : undefined,
},
{
headers: {
Authorization: `Bearer ${token}`,
accept: 'application/json',
'Content-Type': 'application/json',
},
}
);
const { id: liveId } = liveIdRes.data;
// 最后调用 getLiveJumpUrl 获取开播链接
const urlRes = await axios.post(
`${origin}/api/v1/live/getLiveJumpUrl`,
{
live_id: liveId,
user_id: username,
user_name: anchorNick,
version,
},
{
headers: {
Authorization: `Bearer ${token}`,
accept: 'application/json',
'Content-Type': 'application/json',
},
}
);
// 返回的 data.live_jump_url 字段即为开播链接
return urlRes.data.live_jump_url;
}
// 结合您的工程在合适的位置调用 genurl 函数
genurl().then((url) => {
console.log('url ->', url);
});
唤端示例
需要在项目中引入依赖custom-protocol-check
,引入示例:npm install custom-protocol-check --save。
import customProtocolCheck from "custom-protocol-check";
// 链接为上方 genurl 生成的地址,或其他方案通过 getLiveJumpUrl 接口得到的地址
const url = `auipusher://page/live-room?xxxxxx`;
// 更多文档请查看 https://www.npmjs.com/package/custom-protocol-check
customProtocolCheck(
url,
() => {
// 建议此处实现提示下载的弹窗
console.log("未已找到自定义协议,请检查是否已安装开播小助手!");
},
() => {
console.log("已找到自定义协议,并成功打开!");
},
5000,
() => {
console.log("当前环境不支持使用");
},
);
登录说明
输入开播链接,单击进入直播间按键后,将从开播链接中提取关键数据,调用服务端验签接口对开播链接的合法性进行校验。校验成功后,再调用获取单个直播间接口校验其他信息,无问题后进入直播间页。
如遇到登录失败时,先根据服务端接口文档,使用postman等工具确定相关接口是否正常。
接口参数及返回结果的字段名需要和服务端文档保持一致。
开始直播
登录开播小助手。当前支持外部唤起和手动进入两种登录方式。
外部唤起:在浏览器中通过唤端URL打开开播小助手,客户端解析出服务器、直播间、主播信息后,会自动登入。
手动进入:单击开播小助手快捷方式,进入登录页面,键入唤端URL,单击进入直播间,客户端解析出服务器、直播间、主播信息后,会自动登入。
(可选)设置摄像头设备。
关闭/开启摄像头:单击摄像头图标,切换摄像头状态;进入直播间时,默认开启摄像头。
切换摄像头:单击摄像头图标旁的三角图标,唤出摄像头列表,单击选择指定的视频源输入设备。
(可选)设置麦克风设备。
关闭/开启麦克风:单击麦克风图标,切换麦克风状态;进入直播间时,默认开启麦克风。
切换麦克风:单击麦克风图标旁的三角图标,唤出麦克风列表,单击选择指定的音频源输入设备。
(可选)共享屏幕。
共享屏幕/窗口:单击共享屏幕按钮,在打开的弹窗中选择屏幕或窗口,即可分享对应画面。
结束共享:共享屏幕/窗口时,会出现结束共享按钮,单击结束共享。
(可选)根据当前网速选择推荐的直播画质。
单击设置图标,唤出设置弹窗。
选择所需画质。如果选择自定义画质,则主播可以自行设定推流的分辨率、码率、帧率等。
说明建议在开播之前完成设定,如果在直播、连麦或录制视频期间调整直播画质,会直接影响观看效果。
完成相关配置并单击开始直播。
准备观看
推流使用的音频格式是Opus,建议设置转码以确保播放端的兼容性。以普通直播观看为例,操作步骤如下:
登录视频直播控制台。
在视频直播控制台左侧导航栏,单击域名管理,进入域名管理页面。
选择您要配置的播流域名,单击操作列域名配置。
单击 。
在通用转码页签下,单击添加。
在配置转码模板页面,选择原画-仅转音频模板,并将编码格式设置为AAC。
单击确定,完成配置,并将对应转码后的播流地址在直播间详情接口中返回。
如需直播回看,需要添加录制配置。
单击
,在存储至VOD或存储至OSS的页签下,单击添加,在弹窗中开启录制转码流,而转码模板ID选择oriaac,单击确定即可。
常见问题
开播小助手常见问题及解决方法请参见:开播小助手常见问题。