youkuplayer

优酷主站播放器

优酷主站播放器是基于 ku-h5player 播放核心进行二次开发的适用于 优酷全站的 H5 播放器项目， 项目集成 广告，UPS , 日志等服务。

开始

git clone [e-mail]:ku/youkuplayer.git

最新的代码一般在 dev 分支上，建议切到该分支；

代码切到本地后，进入项目 切记使用 tnpm 安装依赖；

tnpm install

关于 tnpm 的安装可以 点击 这里

安装

tnpm instal @ali/youkuplayer@0.1.2 --save

npm scripts

支持的 npm 命令

# 运行 example 下面的页面，进行开发 指定端口 --port 80
npm run dev
 
# 使用 webpack 打包到浏览器支持的版本, 目标文件在 browser 下面
npm run build-browser
 
# 打包成 amd 的形式，需要 使用 require.js 支持
npm run build-browser-amd
 
# 使用 rollup 打包成 node 模块, 目标文件在 dist 下面
npm run build
 
 
 

运行 demo

进入项目输入 npm run dev ，然后如果端口被占用可以使用其他端口进行尝试;

在浏览器输入 htpp://localhost:8088/example/test.html 查看运行效果。

项目支持 webpack2, rollup, less, es2015, 你可以在 build 目录下修改配置或者自行添加命令支持

初始化配置

var container = document.querySelector('.js-player')
var player = new YoukuPlayer(container,{
    ccode: "0590", //业务识别码 大的业务都有自己的业务识别码，以前flash使用04开头，h5使用05开头[必选]
    vid:_vid,//视频ID，建议使用加密之后的，不要使用数字[必选]
    autoplay: true,//是否自动播放[可选]
    quality:'480p', //优先使用清晰度 (320p/480p/720p/1080p)[可选]
    loop:false,//是否循环播放 [可选]
    language:'guoyu'//默认播放语言[可选]
    isShowRelatedVideo:false,//是否显示播后推荐[可选]
    playmode:1,//播放模式 1-普通视频 2-专辑播放 3-节目播放 4-播放播放[可选] 默认为1
    skip:false //是否默认跳过片头片尾 [可选]
    title: '标题内容'//不传默认走服务返回的标题 [可选]
    windType:'interior',//广告播放器类型 interior站内，exterior站外，BDskin合作，popup弹出窗口，index首页，adshow广告，touch安卓播放器, tudoupartner土豆拂晓,html5 [可选]
    fid: 1, //专辑id，playmode=Folder的时候必传[可选]
    ob: 1 ,//专辑排序 0|1 playType=Folder的时候必传[可选]
    pt: 1 ,//专辑中的位置 playType=Folder的时候必传[可选]
    hasWatermark: true, //是否需要水印
    watermark: null, //自定义水印 图片地址
    hasWatermark:false,
    supportType:'mp4',//默认播放支持类型，非优酷域名下请传入该参数
    limitVideo:2,//播放器启用vidoe个数
    adext:1,  //广告指定扩展参数
    upsRequestType:'jsonp',//服务请求方式 站外，非主站使用，建议都使用jsonp
    customParam:{ //云视频扩展参数
        client_id:'',
        password:'',
        atm:''
    }
});

customeEvents说明

    playerReady //播放是数据服务已经完备，可以触发play()接口
    onPlayerStart   // 开始播放
    PlayerPlayNext // 播放下一个
    onTrialEnd 试看结束
    onPlayerComplete // 结束播放
    onTimeUpdate //播放器进度更新
    onPlayerPreAdInit  // 播放器前贴广告
    onPlayerLastAdInit // 播放器后贴广告
    onPlayerMidAdInit,   // 播放器中插广告
    PlayerInteract,// 互动交互接口
    playerSubscribe // 播放器订阅按钮点击
    onFullscreen //全屏状态改变
    dashboardStateChange //播放控制条状态改变 展示或者隐藏

播放器实例支持的 Api

在获取 player 的实例后，你可以对它做下面这些操作

• setMiniWin 设置固定小窗

• revertMiniWin 还原固定小窗

---

关于底层播放核心使用和二次开发 详见 ku-h5player