在云巴官网的《视频直播弹幕互动》案例中,介绍了为什么云巴非常适合应用于视频直播的弹幕、点赞等场景。
本文主要介绍如何使用云巴的 JavaScript SDK 来实现弹幕功能(可参考案例的 GitHub 页)。
如果你想实现 iOS 系统的视频直播 App,可参考云巴 iOS 视频直播弹幕案例的 GitHub 页。
打开 云巴官方网站,注册并登录。
登录后,点击界面右上角 “我的应用 --> 创建新应用”,填写您的视频直播应用的名称、应用包名等内容。详见 Portal 的说明文档。
创建后,您会在应用详情页面看到该应用的 AppKey。
在云巴官网的 开发者页面 或云巴的 Github 上找到所需平台的 SDK,并下载。
每种 SDK 的文件包内都包含一个 Demo,用来演示主要 API 的用法和功能。 建议您从运行 Demo 开始熟悉云巴的 SDK,详见各个 SDK 的 Demo 运行的文档。
将云巴 SDK 集成到您的应用中(此时会用到第二步中的 AppKey)。
我们以 云巴视频直播案例 所使用的 JavaScript SDK 为例,介绍一下集成 SDK 的步骤:
Yunba JavaScript SDK 依赖于 Socket.IO,所以要先引入 Socket.IO。 请参考(SDK 中的)Demo 分别引入 Socket.IO 和 yunba-js-sdk。
用 “第二步” 中获取到的 AppKey 创建 Yunba 实例。
window.yunba = new Yunba({
server: 'sock.yunba.io',
port: 3000,
appkey: APPKEY // 这里是您在 “第二步” 中获取到的 AppKey。
});
假设弹幕的频道名称为 TOPIC_BULLET
:
yunba.init(function(success) {
if (success) {
var cid = Math.random().toString().substr(2);
// 连接云巴服务器
yunba.connect_by_customid(cid,
function(success, msg, sessionid) {
if (success) {
console.log('sessionid:' + sessionid);
// 设置收到信息回调函数
yunba.set_message_cb(yunba_msg_cb);
// 订阅弹幕 TOPIC
yunba.subscribe({
'topic': TOPIC_BULLET
},
function(success, msg) {
if (success) {
console.log('subscribed');
} else {
console.log(msg);
}
});
} else {
console.log(msg);
}
});
} else {
console.log('yunba init failed');
}
});
用下面的几行代码就可以发布弹幕:
var bullet = {
"mode": mode,
"text": text,
"color": color,
"dur": dur
};
yunba.publish({
topic: TOPIC_BULLET,
msg: JSON.stringify(bullet)
},
function(success, msg) {
if (!success) {
console.log(msg);
}
}
);