只需四个步骤几行代码，即可快速实现直播弹幕功能

在视频直播中，互动是不可缺少、不容小觑的内容，主要包括发送弹幕、打赏、点赞等。想要快速实现这些功能，需要进行怎样的操作呢？

其实，实现直播弹幕功能只需“四个步骤”和“几行代码”！

现在，我们使用云巴 Javascript SDK ，手把手教你实现直播弹幕功能吧！

 

 步骤流程图

 

 

步骤一：注册云巴账号

打开网址（https://yunba.io/），或直接搜索“云巴”，进行注册并登录。

 

 

步骤二：在云巴 Portal 创建应用

登录后，点击侧栏 “应用管理” ，再点击“创建应用”，填写您的视频直播应用的名称、应用包名等内容。

如图所示：

 

创建后，您会在“应用列表”→“管理”→“应用详情”内，看到该应用的 AppKey 和 SecretKey 等信息。

 

步骤三：下载云巴 Javascript SDK

在云巴官网（https://yunba.io/）顶菜单栏“开发者资源”→“SDK下载”，或在云巴的 Github 页面（https://github.com/yunba）找到 Javascript SDK 并下载。

 

步骤四：集成 Javascript SDK

将 Javascript SDK 集成到你的应用中，此处会用到 Appkey。

 

1.引入 Javascript SDK

由于 Yunba JavaScript SDK 依赖于 Socket.IO，所以要确保 Socket.IO 先被引入：

<script type="text/javascript" src="javascripts/socket.io-1.3.5.min.js"></script>
<script type="text/javascript" src="../yunba-js-sdk.js"></script>

 

2.创建云巴实例

使用在云巴 Portal 上创建应用获取的 AppKey 创建 Yunba 实例。

window.yunba = new Yunba({
  server: 'sock.yunba.io',
  port: 3000,
  appkey: APPKEY // 这里是您在 “第二步” 中获取到的 AppKey。
});

 

3. 初始化并连接消息服务器、订阅 “弹幕” 频道

假设弹幕的频道名称为  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');
  }
});

 

4.发布“弹幕”

用下面几行代码即可发送弹幕：

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);
    }
  }
);

同理，你还可以通过订阅“点赞”、“统计信息”等频道，实现点赞、在线信息统计等功能，每种功能只需“几行代码”即可轻松实现。

具体可参考：https://github.com/yunbademo/yunba-live-video/blob/master/main.js

云巴视频直播案例的效果图如下：

云巴视频直播案例的在线演示地址：http://yunbademo.github.io/yunba-live-video/

基于 MQTT，使用 Erlang 编写的云巴实时通信云服务，通过 Pub/Sub 模型的双向实时系统，可为直播平台实现所有的实时消息传输。

使用云巴的实时通信云服务构建的直播聊天室，具备以下特征或功能：

1.直播聊天室无人数上限；

2.支持接入任意直播接口；

3.可查看聊天室历史消息记录；

4.支持聊天室消息自定义，打赏、点赞、献花等功能可轻松实现；

5.聊天室数据支持 SSL 安全协议加密；

6.稳定的消息高并发能力；

7.消息控制在 200 毫秒的延迟内；

此外，云巴还可根据客户需要提供更为优秀的定制服务，以满足直播平台的功能需求。对于初创团队，云巴可提供每月 100 万次的免费 API 调用，以及每月 100 万次的免费推送。