flv 自动播放 html autostart="true",GitHub - fesiong/sewise: 一款免费、开源的多媒体播放器，以HTML5技术为平台开发，同时兼容flash技术，实现了...

岳嘉容

2023-12-01

sewise播放器3.2.1_release版本

主要特性

1、全新的架构，代码结构更加合理清晰，简洁易懂，易扩展，易维护。

2、 flash和html5播放器共用一套皮肤。

3、支持一个页面多个播放器实例同时播放

4、轻松支持插件扩展

播放器使用方式：

一：(1)播放器嵌入方式(一个页面只能嵌入一个播放器)

.点播，实际地址播放

.点播，节目ID播放。

.直播，实际地址播放。

.直播，节目ID播放。

(2)播放器实例化方式(支持一个页面多个播放器实例)

.点播实际地址播放

var config={

elid:"container1",//包裹播放器的div容器ID属性值

autostart:true,

url:"video/test.mp4",

skin:"vodWhite"

};

var config2={

elid:"container2",//包裹播放器的div容器ID属性值

autostart:true,

url:"video/test2.m3u8",

skin:"vodTransparent"

};

$(document).ready(dowReady);//页面加载完成

var player,player2;

function dowReady(){

player=new Sewise.SewisePlayer(config);

player.startup();

player2=new Sewise.SewisePlayer(config2);

player2.startup();

};

.点播节目ID播放

只要把上面config对象的url属性设置成如下格式: url:"vod://192.168.3.88/dff999"。

"dff999"表示节目ID。

.直播实际地址播放

var config={

elid:"container1",//包裹播放器的div容器ID属性值

autostart:true,

url:"rtmp://192.168.1.53:1935/livestream/2bsprtda",

duration:3600,

skin:"liveWhite"

};

var config2={

elid:"container2",//包裹播放器的div容器ID属性值

autostart:true,

server:"live",

url:"http://192.168.1.53:1935/livestream/3ggprtda.m3u8",

duration:3600,

skin:"liveWhite"

};

$(document).ready(dowReady);//页面加载完成

var player,player2;

function dowReady(){

player=new Sewise.SewisePlayer(config);

player.startup();

player2=new Sewise.SewisePlayer(config2);

player2.startup();

};

.直播节目ID播放

只要把上面config对象的url属性设置成如下格式:

直播rtmp url:"live://192.168.3.88/dff999/rtmp"

直播m3u8 url:"live://192.168.3.88/dff999/hls"

"dff999"表示节目ID。

二:API接口调用和说明

播放器嵌入方式：var player= window.SewisePlayer;

播放器实例化方式：var player=new Sewise.SewisePlayer(config);

(1)点播直播通用接口

播放

player.play();

暂停

player.pause();

停止

player.stop();

跳转到指定时间播放,

@param time

time类型点播时为数值表示要跳转到的位置(秒)，直播时为字符串表示要跳转到的日期(如：’20110503123456’)

player.seek(time);

设置声音

@param volume 值0-1

player.setVolume(volume);

设置是否静音

@param bool 值true,false

palyer.muted(bool);

根据节目id播放视频

@param programId 节目ID

@param startTime 点播时值为(秒)，直播时值为(日期：’20110503123456’)

@param autostart 是否自动播放

player.playProgram(programId, startTime, autostart);

根据视频地址播放

@param videoUrl 视频地址

@param title 节目标题

@param startTime 点播时为数值表示开始播放的位置(秒)。直播时为字符串表示开始播放位置的日期:’20110503123456’

@param autostart 是否自动播放true false

player.toPlay(videoUrl, title, startTime, autostart);

返回视频总时长(秒)

player.duration();

返回当前播放时间位置、日期

点播返回当前视频播放到的位置(秒)，直播返回当前视频播放到的时间点(日期)

player.playTime ();

获取播放器根容器

player.getPlayerContainer();

获取视频容器

player.getVideoContainer();

获取皮肤容器

player.getSkinContainer();

获取视频元素对象

player.getVideo();

设置播放速率(只支持html5)

1.0 正常速度

0.5 半速(更慢)

2.0 倍速(更快)

-1.0 向后，正常速度

-0.5 向后，半速

player.setPlaybackRate(value);

获取播放速率(只支持html5)

player.getPlaybackRate();

/**

强制刷新皮肤页面布局

player.forceRefreshSkinSize();

/**

开启全屏(必须用户手动触发，比如通过点击按钮事件调用这个接口触发)

player.fullScreen();

/**

退出全屏

player.normalScreen();

(2)点、直播专用接口方法

/* 点播方法

更新多清晰度播放列表

jsonObj(json对象)--- 对应播放器参数videosjsonurl

player.updateVideosjsonurl(jsonObj);

/* 直播方法

回到直播

player.live();

/* 直播方法

返回当前视频最新的直播时间日期

player.liveTime();

/*直播方法

设置直播时间跨度

value类型为数值，表示播放进度条上规化的时长

默认值3600

player.setDuration (value);

三、播放器回调的函数

播放器准备好了

player.on("playerReady",function(){

});

*视频开始播放后回调的函数

player.on("start",function(){

});

*视频暂停播放后回调

player.on("pause",function(){

});

视频播放前回调

player.on("beforePlay",function(){

});

*视频停止播放后回调

player.on("ended",function(){

});

视频时长改变时回调

player.on("durationChange",function(){

});

*视频实时播放回调

player.on("timeupdate",function(){

});

视频加载进度回调

@parame pt

player.on("loadProgress",function(pt){

});

视频缓冲开始回调

player.on("bufferBegin",function(){

});

视频缓冲结束回调

player.on("bufferComplete",function(){

});

播放器获取到视频metadata信息后回调

player.on("metadata",function(obj){

});

视频时移播放后回调的函数

player.on("seek",function(e){

});

皮肤控制条改变显示状态时回调

player.on("controlbarShowState",function(obj){

console.log(obj.isShow);

});

全屏后回调

player.on("fullScreen",function(){

});

退出全屏后回调

player.on("cancelFullScreen",function(){

});

flash端播放hls流时相关事件回调

player.on("hlsEvents",function(obj){

console.log("hls----"+obj.eventName+":"+obj.data);

});

四：播放器参数说明

1、点、直播通用参数：

autostart

说明：[可选]加载视频地址等信息后是否自动开始播放

类型：字符串

取值：”true”、”false”，为空表示：”true”

对应：通用

skin

说明：播放器皮肤

类型：字符串

取值：如，”vodOrange”

对应：通用

type

说明：[可选]播放视频类型，此参数不是必须的，播放器内部会通过url参数自行判断类型，如果视频地址比较特殊,需要设置此参数

类型：字符串

取值：”rtmp”、”flv”、”mp4”、”m3u8”

对应：通用

title

说明：[可选]所播放节目的标题

类型：字符串

取值：如，”深圳卫视”

对应：通用

server

说明：[可选]服务器类型

类型：字符串

取值：”vod”、live”，值为vod时播放器将启用点播模式，值为live时播放器将启用直播模式。

对应：通用

lang

说明：[可选]播放器显示语言

类型：字符串

取值：”en_US”或”zh_CN”

对应：通用

logo

说明：[可选]播放器logo

类型：字符串

取值：如，http://sewise.com/logo.png

对应：通用

volume

说明：[可选]播放器默认音量值

类型：字符串

取值：0 - 1

对应：通用

poster

说明：[可选]视频播放前显示的图像

类型：字符串

取值：如，http://www.sewise.com/img/01.png

对应：通用

claritybtndisplay

说明：[可选]是否显示多码率按钮

类型：字符串