JS SDK 集成

使用微吼云JS SDK,只需简单几步,就能快速发起直播。

跟随本文的步骤,即使你对Javascript语言不熟悉,也完全可以做到。

其中,一至三步为准备工作,第四步为代码接入,下面,就分步来说明。

推流准备

  1. 注册微吼开发者账号

  2. 创建应用 获取AppID

  3. 创建直播间 获取roomId

    可以通过 【测试工具】 或 【API】 获得

  4. 获取直播间包含推流权限的access_token

    可以通过 【测试工具】 或 【API】 获得

时序图

注:已知直播间ID的情况下虚线框部分无需请求。

引入sdk文件

接下来,我们正式接入sdk: 将下面sdk引入代码,插入页面的head标签里。

<script src="https://static.vhallyun.com/jssdk/vhall-jssdk-live-stream-1.0.0.js"></script>
<script src="https://static.vhallyun.com/jssdk/vhall-jssdk-base-1.0.0.js"></script>

注意:

1.直接用本地网页(file协议,地址栏以file:///开头)是调试不了的,需要运行在服务器上,且推流需https环境,(地址栏以https:// 开头)才能正常调试。

2.上面两个文件都需要引用,而且顺序需要保持与上面一致。

3.建议直接复制上面代码。

引入推流依赖flash文件

点此下载推流依赖flash文件,文件名为:Shy.swf。

下载后,在当前推流页同级目录建images文件夹,将下载的 Shy.swf文件放入images中。保证相对目录./images/Shy.swf文件能被推流页面访问到。

代码对接

至此,你已完成所有推流准备工作,距离你看到自己的推流画面,只差以下4步:

1.创建推流器对象

在页面加入推流器容器,也就是放一个div,然后给它取个名字,比如: my-publisher 。之后推流回显画面都会在这个容器里渲染,示例:

<div id="my-publisher"></div>

2.注册ready事件

接下来,在页面里写javascript代码,调用sdk提供的接口,注册sdk ready事件,接口调用方法如下:

 /**
  *  注册ready事件
  */
  Vhall.ready(function(){
    //TODO
  })

注意:所有推流相关逻辑需要写在此事件里。

3.初始化SDK配置

接下来,在Vhall.ready事件之后,进行初始化配置:

 /**
  *  注册ready事件
  */
  Vhall.ready(function(){
    //TODO
  });
  
 /**
  * 初始化SDK配置
  */
   Vhall.config({
     appId :'',//应用 ID ,必填
     accountId :'',//第三方用户唯一标识,必填
     token:'',//token必填
   })     

注意:

1.此方法必须写在Vhall.ready事件之后。

2.appId获取方式,参考[推流准备]的“创建应用 获取AppID”

3.token生成方式,参考[推流准备]的“获取直播间 access_token”

4.此处的toekn,即为参考准备的access_token。