rtmp直播視頻流播放器（ckplayer）使用方法

摘要：

在咱們編寫項目時，也許會接觸到一些視頻的操做，普通視頻流的話，例如Ogg、MPEG四、WebM這類後綴的文件，這幾類文件均可以被h5的video標籤解析，並不須要作解析操做，那麼咱們在項目中也會用到直播視頻的格式，我在項目中就有涉及到直播的需求，是rtmp格式的直播視頻流，起初我找了相關插件進行解析，有video.js插件包，還有ckplayer插件包，由於video.js沒有深研究，因此使用的是ckpalyer，該插件能很好的解析rtmp格式的直播視頻流，可是須要作一些配置；

第一步：下載：http://www.ckplayer.com/down/

該插件有兩種下載方式，請自行選擇；

第二步：在本身的項目中進行引入，前提須要將ckplayer包放到項目中，以後直接引入ckplayer.js文件便可，全部依賴關係都是經過ckplayer.js進行查找，因此只需引入這一個文件

第三步：在body中添加視頻dom容器

<div class="video active" id="video1"></div>
   

第四步：實例化ckplayer（這裏個人操做是寫了一個函數，將配置參數放到了函數裏，以後在進行實例化）

function video(className,url){
   var videoObject = {
      container: className,//「#」表明容器的ID，「.」或「」表明容器的class
      variable: 'player',//該屬性必需設置，值等於下面的new chplayer()的對象
      autoplay:true,//自動播放
      live:true,//直播視頻形式
      mobileCkControls:false,
      video:url//視頻地址
   };
   return videoObject;
};

var player=new ckplayer("容器","rtmp格式地址");

截止目前，全部工做就已完畢，一個簡單的直播功能就搭建好了，ckplayer中提供了不少視頻配置，具體配置請參照官網（通常配置是去掉播放器的logo，這裏我就拿這一個功能進行舉例）

在ckplayer.js文件中，找到style配置參數，將style內部的loading和logo配置的部分代碼註釋掉就能夠了