ckplayer已经升级至全新的X2版本，ckplayer用于在网页端播放视频，支持mp4,flv,m3u8及rtmp协议的直播，支持移动端，PC端，m3u8 和 mp4都可以完美播放，为防止盗用链接，这里我们就不放演示了！

本源码支持：手机端和PC端的M3U8格式的点播和直播，MP4就不用说了，肯定是支持的！

ckplayer X2点播+直播解析实例(含源文件)插图
ckplayer X2

基本使用：

<script type="text/javascript" src="ckplayer/ckplayer.js" charset="utf-8" data-name="ckplayer"></script>
<div class="video" style="width: 600px;height: 400px;"></div>
<script type="text/javascript">
    //定义一个变量：videoObject，用来做为视频初始化配置
    var videoObject = {
	container: '.video', //“#”代表容器的ID，“.”或“”代表容器的class
	variable: 'player', //播放函数名称，该属性必需设置，值等于下面的new ckplayer()的对象
	video: 'http://ckplayer-video.oss-cn-shanghai.aliyuncs.com/sample-mp4/05cacb4e02f9d9e.mp4'//视频地址
    };
    var player = new ckplayer(videoObject);//初始化播放器
</script>

演示示例：

1.将下面代码保存为index.html文件，上传服务器，即可看到效果

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>ckplayer播放器</title>
		<meta name="referrer" content="no-referrer">
		<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/cc963020001/ckplayer/ckplayer/ckplayer.js" charset="utf-8" data-name="ckplayer"></script>
    <style type="text/css">
      html, body {width:100%;height:100%;margin:auto;overflow: hidden;}
    </style>
	</head>

	<body>
<div class="video" style="width: 100%;height: 100%;"></div>
<script type="text/javascript">
    //定义一个变量：videoObject，用来做为视频初始化配置
    var videoObject = {
	container: '.video', //“#”代表容器的ID，“.”或“”代表容器的class
	variable: 'player', //播放函数名称，该属性必需设置，值等于下面的new ckplayer()的对象
	autoplay: false,//是否自动播放(true、false)
	poster: 'https://cdn.jsdelivr.net/gh/cc963020001/image/30f07120fcc36c44a7e9edd99d9581a5.jpg', //封面图片
	video: '//player.alicdn.com/video/aliyunmedia.mp4',//视频地址
	html5m3u8: true,//PC平台上是否使用h5播放器播放m3u8
    };
    var player = new ckplayer(videoObject);//初始化播放器
</script>
	</body>

</html>

注意：上述代码中ckplayer.js我调用是CDN可自行替换为自己的或者其他CDN静态资源库，如

https://cdn.jsdelivr.net/npm/p2p-ckplayer@latest/ckplayer/ckplayer.min.js

2.如果需要调用则把视频地址替换为如下代码

<?php echo $_GET['url'];?>

3.打开你的域名/index.php?url=即可解析视频地址完成播放了

更多自定义：

<script type="text/javascript">
    var videoObject = {
        container: '.video', //“#”代表容器的ID，“.”或“”代表容器的class
        variable: 'player', //播放函数名称，该属性必需设置，值等于下面的new ckplayer()的对象
        volume: 0.8, //音量，范围：0-1
        poster: 'poster.png', //封面图片
        video: 'http://ckplayer-video.oss-cn-shanghai.aliyuncs.com/sample-mp4/05cacb4e02f9d9e.mp4',//视频地址
        autoplay: false,//是否自动播放
        loop: false,//是否需要循环播放
        live: false,//是否是直播
        duration: 0,//指定总时间
        forceduration:0,//强制使用该时间为总时间
        seek: 0,//默认需要跳转的秒数
        drag: '',//拖动时支持的前置参数
        loaded: '',//加载播放器后调用的函数
        flashplayer: false,//设置成true则强制使用flashplayer
        html5m3u8: false,//PC平台上是否使用h5播放器播放m3u8
        track: null,//字幕轨道
        cktrack: null,//ck字幕
        cktrackdelay:0,//字幕显示延迟时间
        preview: null,//预览图片对象
        prompt: null,//提示点功能
        type: '',//视频格式
        crossorigin: '',//设置html5视频的crossOrigin属性
        crossdomain: '',//安全策略文件地址
        unescape: false,//默认flashplayer里需要解码
        mobileCkControls: false,//移动端h5显示控制栏
        mobileAutoFull: true,//移动端是否默认全屏播放
        playbackrate: 1,//默认倍速
        h5container: '',//h5环境中使用自定义容器
        debug: false,//是否开启调试模式
        overspread:true,//是否让视频铺满播放器
        config: '',//调用配置函数名称
        language:'',//语言文件路径
        style:'',//风格文件路径
        adfront: '',//前置贴片广告列表
        adfronttime: '',//前置贴片广告强制时间列表
        adfrontlink: '',//前置 贴片广告链接地址列表
        adpause: '',//暂停广告列表，只是是图片
        adpausetime: '',//暂停广告列表每个图片播放的时间
        adpauselink: '',//暂停广告列表的链接地址列表
        adinsert: '',//插入广告列表
        adinserttime: '',//插入贴片广告时间列表
        adinsertlink: '',//插入贴片广告链接列表
        inserttime: '',//插入贴片广告显示的时间点列表
        adend: '',//播放结速帖片广告列表
        adendtime: '',//播放结速帖片时间列表
        adendlink: '',//播放结速帖片链接列表
        advertisements: ''//可以使用单独的json文件配置广告
    };
</script>

ckplayer.json说明：

{
    "config": { //通用配置
        "fullInteractive": true, //是否开启交互功能
        "delay": 30, //延迟加载视频，单位：毫秒
        "timeFrequency": 100, //计算当前播放时间和加载量的时间频率，单位：毫秒
        "autoLoad": true, //视频是否自动加载，如果设置成false，则必需用户点击后才可以加载
        "loadNext": 0, //多段视频预加载的段数，设置成0则全部加载
        "definition": true, //开启清晰度组件
        "subtitle": true, //开启字幕切换组件
        "playbackRate": true, //开启速率调整组件
        "smartRemove": true, //是否使用智能清理，使用该功能则在多段时当前播放段之前的段都会被清除出内存，减少对内存的使用
        "bufferTime": 200, //缓存区的长度，单位：毫秒,建议不要小于100
        "rtmpBufferTime": 0, //rtmp视频缓存区长度，单位：毫秒
        "click": true, //是否支持单击暂停
        "doubleClick": true, //是否支持双击全屏
        "doubleClickInterval": 200, //判断双击的标准，即两次单击间隔的时间差之内判断为是双击，单位：毫秒
        "keyDown": { //开启键盘控制播放器
            "space": true, //是否启用空格键切换播放/暂停
            "left": true, //是否启用方向键-左控制后退
            "right": true, //是否启用方向键-右控制前进
            "up": true, //是否启用方向键-上控制提升音量
            "down": true //是否启用方向键-下降低音量
        },
        "timeJump": 10, //快进快退时的秒数
        "volumeJump": 0.1, //音量调整的步长，大于0小于1的小数，默认0.1，即每次使用方向键调整音量时提高0.1或降底0.1
        "timeScheduleAdjust": "1", //是否可调节播放进度调节栏,0不启用，1是启用，2是只能前进（向右拖动），3是只能后退，4是只能前进但能回到第一次拖动时的位置，5是看过的地方可以随意拖动
        "previewDefaultLoad": true, //预览图片是否默认加载，优点是鼠标第一次经过进度条即可显示预览图片
        "promptSpotTime": true, //提示点文字是否在前面加上对应时间
        "buttonMode": { //鼠标样式
            "player": false, //鼠标在播放器上是否显示可点击形态
            "controlBar": false, //鼠标在控制栏上是否显示可点击形态
            "timeSchedule": true, //鼠标在时间进度条上是否显示可点击形态
            "volumeSchedule": true //鼠标在音量调节栏上是否显示可点击形态
        },
        "liveAndVod": { //直播+点播=时移功能的配置
            "open": false, //是否开启，开启该功能需要设置flashvars里live=true
            "vodTime": 2, //可以回看的整点数
            "start": "start" //回看请求参数
        },
        "usehardwareeecoder": false, //是否采用硬件加速，只针对flashplayer有效
        "errorNum": 1, //出现播放错误时系统重新连接次数
        "playCorrect": false, //是否启用错误修正
        "timeCorrect": true, //http视频播放时间错误纠正，有些因为视频格式的问题导致视频没有实际播放结束视频文件就返回了stop命令
        "m3u8Definition": { //m3u8自动清晰度时按关键字来进行判断
            "tags": [
                    "110k",
                    "200k",
                    "400k",
                    "600k",
                    "800k",
                    "1000k"
                ]
        },
        "m3u8MaxBufferLength": 30, //m3u8最大缓冲时间，单位：秒数
        "split": ",", //当视频地址采用字符形式并且需要使用逗号或其它符号来切割数组里定义
        "timeStamp": "", //一个地址，用来请求当前时间戳，用于播放器内部时间效准
        "videoDrawImage": false, //是否启用hls播放m3u8文件
        "errorTime": 10, //监听错误的计时器秒数
        "addCallback": "adPlay,adPause,playOrPause,videoPlay,videoPause,videoMute,videoEscMute,videoClear,changeVolume,fastBack,fastNext,videoSeek,newVideo,getMetaDate,videoRotation,videoBrightness,videoContrast,videoSaturation,videoHue,videoZoom,videoProportion,videoError,addListener,removeListener,addElement,getElement,deleteElement,elementShow,animate,animateResume,animatePause,deleteAnimate,changeConfig,getConfig,openUrl,fullScreen,quitFullScreen,switchFull,screenshot,custom,changeControlBarShow,getCurrentSrc,changeDefinition,changeSubtitles,changeSubtitlesSize" //允许交互的函数名称列表
    },
    "menu": { //修改右键，下面的内容在鼠标在播放器区域点击右键时显示
        "ckkey": "97b6a7181e0bdbe69e692383e1071ba1", //ckkey，32个字符
        "name": "ckplayer", //版权名称
        "link": "http://www.ckplayer.com", //版权名称链接地址
        "domain": "", //限制播放器只能在指定域名下使用，多个域名请用英文逗号隔开
        "version": "version:X2", //版本信息
        "more": [] //更多右键设置
    },
    "languagePath": "", //语言文件地址
    "stylePath": "", //风格文件地址
    "style": { //部分风格配置，该处的风格只定义少里需要个性化配置的属性。播放器整体风格需要使用单独的文件style.json进行配置
        "loading": { //loading的配置
            "file": "data:image/gif;base64,R0lGODlhPAAeALMIAPRqMPRmK/RqMfNkKPRyPPV+TPRpL/NfIf///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjg3OTQ3RDUzRTEwMTExRUFCNkQxRDI3Mzc1NTY5OUQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg3OTQ3RDU0RTEwMTExRUFCNkQxRDI3Mzc1NTY5OUQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODc5NDdENTFFMTAxMTFFQUI2RDFEMjczNzU1Njk5RDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODc5NDdENTJFMTAxMTFFQUI2RDFEMjczNzU1Njk5RDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQJCgAIACwAAAAAPAAeAAAEuhDJSau9OOfDu/5giHWeaJ4jeaCsNbzwpa5tjcyyaltB76ekXHBHwQlLFSNRokzqLE2NYEo9coDI4hMUZW6dQ3AHQC5jr9CvNryeZdtocVxOo3e97Mn9psa753B1gWeCen9vhnl+gImIfIeFjYyPjpSTkJOWkZqEVm6daYqLm5ibnKGVdzNlZp6ur3Qiqn2jsB+zoqexIVRVqJm4lS17wZktPj+2kqZLG7R7zaC70SEwMb/M1CzQ2igzEQAh+QQJCgAIACwAAAAAPAAeAAAErBDJSau9OOvNu/9gKI5kOQ1oaq7Z4b5sXL2w7NHuhR824f+YnQ4nKBpLwiFNuauNkhYopYnDAK5YZk7Li1Kds6p3yeVKp+IweQyefNvuNHqthiPeW3Z+br/L429BfxJngHZ4XXqJfHuMi4ZUgnSQj5Rmg4SYhZmTnF9WWFdlo3WRJJt+namfp5irjZ4uRketqq+Vtz0/PpKHrjaKpMAam6jDIcbHHykqys7PKxEAIfkECQoACAAsAAAAADwAHgAABKEQyUmrvTjrzbv/YCiOZGmeaKCuaLqqRyy3p2zfdGbs/HX/B4xgSCz9fEAb5khiVpJKZLQCqFqXOAt0JuU+s1owZRvDTsdi9HlCDnbL4TU7LWmbvWp8Hv7d3vl7bnF6dWR/goGHb0CKg4CJjoyLk5R9UI1UVlWYgU6WjyCec36VIqKFpBZERU10CHY5FwWztIsvKrEktwG5vb6/wMHCw8QTEQAh+QQJCgAIACwAAAAAPAAeAAAErRDJSau9OOvNu/9gKGZDaY7od6xs6m5sewV0/W5Arscrxh83ze/n4wUzQ+OFaBE4n6lkrDi1MEdSmVVZuVZ0umUWKK52uWczZUzeqifeNRo+pmrlb3oewbb33Hd4gRJ9ZYN8c3qHhYB/aYeIe4yPjoKVlm2YcYqXhImeknWGnZGQYDkXpwCboIufKKylpLFYr6xPUEextEeUmRQ1Nr0cvMMgxcYeJifJzc7P0B0RACH5BAkKAAgALAAAAAA8AB4AAAS38MiJqr046835pF0ojtonkWjqmdvgvmqMmcdGyzhyl2wW/MBcZjfszYzCCvH44TWTluVFqkReBNjsiFp9MkFFb4ers3bB31MGwG6TuW9zmSaeyuP1M73mREflc356dDZ3gHB7goN9amGKiYqBjXZ5i457hZV4j5B8l56UkYiQmZyVkqAWbW6Hhqdkaal/mq2nsaWTs5FZWiKbuZZQqLiyCEBBwsOMxcnLxM1bgC8w0CGw1SnX2CQRACH5BAkKAAgALAAAAAA8AB4AAAStEMlJq7046827/2AoZkNpjuh3rGzqbmx7BXT9bkCuxyvGHzfN7+fjBTND44VoETifqWSsOLUwR1KZVVm5VnS6ZRYorna5ZzNlTN6qJ941Gj6mauVveh7Btvfcd3iBEn1lg3xzeoeFgH9ph4h7jI+OgpWWbZhxipeEiZ6SdYadkZBgORenAJugi58orKWksVivrE9QR7G0R5SZFDU2vRy8wyDFxh4mJ8nNzs/QHREAIfkECQoACAAsAAAAADwAHgAABKEQyUmrvTjrzbv/YCiOZGmeaKCuaLqqRyy3p2zfdGbs/HX/B4xgSCz9fEAb5khiVpJKZLQCqFqXOAt0JuU+s1owZRvDTsdi9HlCDnbL4TU7LWmbvWp8Hv7d3vl7bnF6dWR/goGHb0CKg4CJjoyLk5R9UI1UVlWYgU6WjyCec36VIqKFpBZERU10CHY5FwWztIsvKrEktwG5vb6/wMHCw8QTEQAh+QQFCgAIACwAAAAAPAAeAAAErBDJSau9OOvNu/9gKI5kOQ1oaq7Z4b5sXL2w7NHuhR824f+YnQ4nKBpLwiFNuauNkhYopYnDAK5YZk7Li1Kds6p3yeVKp+IweQyefNvuNHqthiPeW3Z+br/L429BfxJngHZ4XXqJfHuMi4ZUgnSQj5Rmg4SYhZmTnF9WWFdlo3WRJJt+namfp5irjZ4uRketqq+Vtz0/PpKHrjaKpMAam6jDIcbHHykqys7PKxEAOw==", //flashplyer环境中使用的loading文件
            "fileH5": "data:image/gif;base64,R0lGODlhPAAeALMIAPRqMPRmK/RqMfNkKPRyPPV+TPRpL/NfIf///wAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/wtYTVAgRGF0YVhNUDw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjg3OTQ3RDUzRTEwMTExRUFCNkQxRDI3Mzc1NTY5OUQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjg3OTQ3RDU0RTEwMTExRUFCNkQxRDI3Mzc1NTY5OUQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6ODc5NDdENTFFMTAxMTFFQUI2RDFEMjczNzU1Njk5RDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6ODc5NDdENTJFMTAxMTFFQUI2RDFEMjczNzU1Njk5RDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr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", //h5环境中使用的loading文件
            "align": "center", //水平对齐方式，left(左对齐)，center(中间对齐)，right(右边对齐)
            "vAlign": "middle", //垂直对齐方式，top(上方对齐)，middle(中间对齐)，bottom(底部对齐)
            "width": 60, //图片宽
            "height": 30, //图片高
            "offsetX": -30, //水平偏移量
            "offsetY": -15 //垂直偏移量
        },
        "logo": { //logo的配置
            "file": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFcAAAAUCAYAAAD4BKGuAAAABGdBTUEAAK/INwWK6QAAABl0RVh0U29mdHdhcmUAQWRvYmUgSW1hZ2VSZWFkeXHJZTwAAAVTSURBVHja1Fl/aJVVGP4cw/mH5tUWi3I53cA0WbeIzMgaq6lQoVawm0S6glHhIKM/TELICotqCxMSGWQRdFfRLEhc9mMxqA0rbdS2wsV0GkZXuaKUWlHvgeeNh7f3u1du3Ft74eGcnXu+c873vD/Pt0nZbDZyZL2gWZAQTBH8IjggeEjgPZASPIB+g/P7EsGT6J/BfHfjHFIv2Jpjj/+dlDskvCm42Jk7X3C7YJOgw/z2oOBGwdEYRW0RVAjOCZ4ugNggqwU3CTLRBJFyQ+xuwVRY14igB78tE9QKpgmeEHwkGKRnq9AeMesHRWwEsYGUxwSdBZ51ecweE4Lct0DsOVjaZvptA8jfC4JfghWpXIJ2jMY+EDShf1pwh6DvX5x1GtpDE43cNFlfhyFWpQ9xd5FgFo3fRi++C+2nCBNBRgU3O6RsEyyEQv4QLMb4CcE9RlFBLqS1WZ6BZ83A35ofVhuvfE5QJrjWebdgCJOx51qM1QgewbMzsO57MDQrB9DeC8ObHd5Xyb2eiNiQQxmtgkZBr+OuZwV7BIcF1RgbF1wTE2MbEccX48VY9sMzBilhTke/m+b1Q9lefpgruI7OsYhIGzPJuAnn3+6EM7vu1YKl5vkrYRSfCGZivCxoMklk7M5j6eFlXyRNRSAvAoFf0Fo/CC7LkbwuQjsZsf0qwbuI9wlYgIqGl6NEzDYibJ/gbmAfxpKoMDRcaSK8xZzjZbK+NMhSYoNSngV5e+ksKXp+JdqZwDDmdpSbsqa9gNAyi5JalSGv3iQ+dtNK9HvI+sNBh2AhvNYVaH+msRtAdsa4ehoKCuQsoP2PY8+kCSkJ5IRWjD2FZ4/BOFSWYv9KhI40eUKQ31CqdnLM1c1OOnHufKSS+iEZvgHNhji8g1yT5VZKdCnHO+ajvrYK/I7GkuSWjwvq8Mzl5M79NF89aCHaBNXmWv0sQVUUZEDwsDnbr2i9s31lKyGuFs7kITEBC+snJaToRYIFrRN0CeYgoSUxJ23WUm85eB41b4IUuIvGtyIMVMY8lzHGMoYworF7J/onKYk10/wVQL6zXYr+Zq9aOEhuXZPDel8Q3If+HMzTeHPKlForEK+mws3SMfH2UMxNLIJbasKsoIQZwVLbKFkN4T1C3HxUMM+EkCAfgjwNV40Y304KriOP+jIHqa+jvYsqnH/kqzKaGCFZxWnoTqooxky8+dHUsOGwr6Jfi9jmlVVTHGLnot9L3qGWqCToWYYRF5fDa96mtb93yI2g8B0IWxlTHWmi/hOG00D4mEJfJ5WhQX7ySCsDUaNkJeud6+sgXCgs3OLEG2/xdZSh10JBeiB1zQU0HuQdSib60rOdm9kFToIL8hmFiRHzm1YM0ylet5k579OFpcUk4I0oD0/QuJ7tcBy5ERY6ixdrh5uNwN3bUV7pd4E+J958HmPxbRRydqK/in6vxj5aH9din/udEPKtuU1GqBL24xJwBInQWiHLcbQVKBXTzkVpHP0tWHsIpZUqPeWcrScXuX2ImRkqlufBhdQl15ig3WLKH0/SeAmtD+uprBqGx1ThhlWN5LKG4lcNKbDblFDjVDU0wWK7yLLqnPNk6cKzKsfXt1GQmQQXSuwymhd3tr9lkvPJMUV152kc2PsmUEMxtzdPRk2SNX2DQ3Vhr02Is18LXjHVAz/bG0NEK8johus3UBiwyfkYlDkQUyLaWrwZBrbHMaB8Z3PJLaYk8IIVKKPSJdxbv3ecynNzLNr33GKLV1YVW4IyfycXfq0UxP4X5HJdXCqX4Wv0AKqYkkipw4LG6WxMNi+GhAtH+M/K8wVe7wuWvwQYAFT+UsGCXmX3AAAAAElFTkSuQmCC", //logo图片
            "align": "right", //水平对齐方式，left(左对齐)，center(中间对齐)，right(右边对齐)
            "vAlign": "top", //垂直对齐方式，top(上方对齐)，middle(中间对齐)，bottom(底部对齐)
            "width": 87, //图片宽
            "height": 30, //图片高
            "offsetX": -100, //水平偏移量
            "offsetY": 10 //垂直偏移量
        },
        "advertisement": { //广告相关的配置
            "time": 5, //广告默认播放时长以及多个广告时每个广告默认播放时间，单位：秒
            "method": "get", //广告监测地址默认请求方式，get/post
            "videoForce": false, //视频广告是否强制播放结束
            "videoVolume": 0.8, //广告视频默认音量
            "skipButtonShow": true, //是否显示跳过广告按钮
            "linkButtonShow": true, //是否显示广告链接按钮，如果选择显示，只有在提供了广告链接地址时才会显示
            "muteButtonShow": true, //是否显示表单和取消静音按钮
            "closeButtonShow": true, //暂停广告时是否显示关闭按钮
            "closeOtherButtonShow": true, //其它广告时是否显示关闭按钮
            "frontSkipButtonDelay": 5, //播放开始前广告跳过广告按钮延时显示的时间，秒
            "insertSkipButtonDelay": 0, //中间插入广告跳过广告按钮延时显示的时间，秒
            "endSkipButtonDelay": 0, //结尾广告跳过广告按钮延时显示的时间，秒
            "frontStretched": 1, //播放开始前广告拉伸方式，0=原始大小，1=自动缩放，2=只有当广告的宽或高大于播放器宽高时才进行缩放，3=参考播放器宽高，4=宽度参考播放器宽、高度自动，5=高度参考播放器高、宽度自动
            "insertStretched": 2, //中间插入广告拉伸方式，0=原始大小，1=自动缩放，2=只有当广告的宽或高大于播放器宽高时才进行缩放，3=参考播放器宽高，4=宽度参考播放器宽、高度自动，5=高度参考播放器高、宽度自动
            "pauseStretched": 2, //暂停广告拉伸方式，0=原始大小，1=自动缩放，2=只有当广告的宽或高大于播放器宽高时才进行缩放，3=参考播放器宽高，4=宽度参考播放器宽、高度自动，5=高度参考播放器高、宽度自动
            "endStretched": 2 //结尾广告拉伸方式，0=原始大小，1=自动缩放，2=只有当广告的宽或高大于播放器宽高时才进行缩放，3=参考播放器宽高，4=宽度参考播放器宽、高度自动，5=高度参考播放器高、宽度自动
        },
        "videoDefault": { //flashplayer环境中读取视频元数据时出错显示的宽和高
            "defaultWidth": 4, //默认宽度
            "defaultHeight": 3 //默认高度
        }
    }
}

 

自定义LOGO、loading加载动画：

  • 修改主程序“ckplayer.json”或“ckplayer.js”搜索“logo”替换“file”值
  • 修改主程序“ckplayer.json”或“ckplayer.js”搜索“loading”替换“file”、"fileH5"值

注：修改LOGO、loading加载动画需要把png图片格式转化为“base64”，工具地址（图片转base64点击这里）

风格使用：

style风格
style风格

源码带3种风格文件，替换只需复制style风格文件夹下的“X.json”到源码文件夹ckplayer下替换原有的“style.json”风格文件即可！

调用方式：

http://你的域名/index.php?url=https://video.dious.cc/20200824/zqiHMy5V/index.m3u8

使用心得：

站长下载测试了直播、和点播，个人感觉代码清晰，相比ckplayer X1或更早版本，ckplayer X2版本更加方便、且官方提供了多个风格文件，这样在修改时，就可参考，也不至于像X1版本那么无从下手，好了不多废话，源文件下载需积分！

注:下载源码后在文件夹“其他案例”中包含“点播”和“直播”如果需要点播只需要把“点播文件”复制到根目录替换原有的index.php文件即可，默认是直播！

1.使用本站下载的源码仅限于个人学习和非商业用途。
2.禁止将本站下载的源码用于搭建或支持任何违法、淫秽、暴力或侵犯他人合法权益的网站或应用。
3.使用本站下载的源码需遵守国家法律法规及相关规定，不得从事任何违法活动。
4.如若本站内容侵犯了原著者的合法权益，请联系我们进行处理。