1. CKplayer简介

CKplayer 它是一款用于网页上播放视频的插件，支持的格式有：http 协议上的 flv, f4v, mp4格式，同时支持 rtmp 视频流格式播放。使用非常简单。

测试界面

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <title>ckplayer 6.4 版本视频播放测试</title>

    <script src="ckplayer.js" type="text/javascript"></script>

</head>

<body>

    <div id="videoPlay"></div>

    <script type="text/javascript">

        //var flashvars = {

        //    "f": "m3u8.swf",//视频地址

        //    "a": "http://open.ys7.com/openlive/0cdaada32f2d4106949b073e48d126da.m3u8",//调用时的参数，只有当s>0的时候有效

        //    "s": "0",//调用方式，0=普通方法（f=视频地址），1=网址形式,2=xml形式，3=swf形式(s>0时f=网址，配合a来完成对地址的组装)

        //    "c": "0",//是否读取文本配置,0不是，1是

        //    "x": "",//调用配置文件路径，只有在c=1时使用。默认为空调用的是ckplayer.xml

        //    "e": "3",//视频结束后的动作，0是调用js函数，1是循环播放，2是暂停播放并且不调用广告，3是调用视频推荐列表的插件，4是清除视频流并调用js功能和1差不多，5是暂停播放并且调用暂停广告

        //    "v": "80",//默认音量，0-100之间

        //    "p": "0",//视频默认0是暂停，1是播放，2是不加载视频

        //    "h": "0",//播放http视频流时采用何种拖动方法，=0不使用任意拖动，=1是使用按关键帧，=2是按时间点，=3是自动判断按什么(如果视频格式是.mp4就按关键帧，.flv就按关键时间)，=4也是自动判断(只要包含字符mp4就按mp4来，只要包含字符flv就按flv来)

        //    "q": "",//视频流拖动时参考函数，默认是start

        //    "m": "",//让该参数为一个链接地址时，单击播放器将跳转到该地址

        //    "o": "",//当p=2时，可以设置视频的时间，单位，秒

        //    "w": "",//当p=2时，可以设置视频的总字节数

        //    "g": "",//视频直接g秒开始播放

        //    "j": "",//跳过片尾功能，j>0则从播放多少时间后跳到结束，<0则总总时间-该值的绝对值时跳到结束

        //    "k": "30|60",//提示点时间，如 30|60鼠标经过进度栏30秒，60秒会提示n指定的相应的文字

        //    "n": "这是提示点的功能，如果不需要删除k和n的值|提示点测试60秒",//提示点文字，跟k配合使用，如 提示点1|提示点2

        //    "wh": "",//宽高比，可以自己定义视频的宽高或宽高比如：wh:"4:3",或wh:"1080:720"

        //    "lv": "1",//是否是直播流，=1则锁定进度栏

        //    "i": "http://www.ckplayer.com/images/loadimg3.jpg",//初始图片地址

        //    "d": "http://www.ckplayer.com/down/pause6.1_1.swf|http://www.ckplayer.com/down/pause6.1_2.swf",//暂停时播放的广告，swf/图片,多个用竖线隔开，图片要加链接地址，没有的时候留空就行

        //    "u": "",//暂停时如果是图片的话，加个链接地址

        //    "l": "http://www.ckplayer.com/down/adv6.1_1.swf|http://www.ckplayer.com/down/adv6.1_2.swf",//前置广告，swf/图片/视频，多个用竖线隔开，图片和视频要加链接地址

        //    "r": "",//前置广告的链接地址，多个用竖线隔开，没有的留空

        //    "t": "10|10",//视频开始前播放swf/图片时的时间，多个用竖线隔开

        //    "y": "",//这里是使用网址形式调用广告地址时使用，前提是要设置l的值为空

        //    "z": "http://www.ckplayer.com/down/buffer.swf",//缓冲广告，只能放一个，swf格式

        //    "loaded": "loadedHandler"//当播放器加载完成后发送该js函数loaded

        //};

        //var params = {

        //    "bgcolor": "#FFF",

        //    "allowFullScreen": true,

        //    "allowScriptAccess": "always"

        //};//这里定义播放器的其它参数如背景色（跟flashvars中的b不同），是否支持全屏，是否支持交互

        var flashvars = {

            "c": 0, //不加载文本配置

            "p": 1, //页面加载完成后直接播放视频

            "k": "5|10|18|20|25", //提示点时间列表

            "n": "提示点5|提示点10|提示点18|提示点20|提示点25", //提示点文字列表

            "f": "video_test.flv"

            //"f": "http://movie.ks.js.cn/flv/other/1_0.flv" //视频地址

        };

        var params = {

            "bgcolor": "#fff",

            "wmode": "transparent",

            "allowFullScreen": true,

            "allowScriptAccess": "always"

        };

        CKobject.embedSWF("ckplayer.swf", "videoPlay", "ckplayer_a1", "600", "338", flashvars, params);

        //支持并优先使用h5播放

        //var video = ["http://movie.ks.js.cn/flv/other/1_0.mp4->video/mp4"];

        //CKobject.embed("ckplayer.swf", "videoPlay", "ckplayer_a1", "600", "338", true, flashvars, video, params);

    </script>

</body>

</html>

2.直播延迟的问题

　　如果在进行rtmp直播的时候，发现画面延迟很严重，可以修改 ckplayer.js 中 ck.setup 参数字符串中的第13个参数(视频缓冲时间,单位：毫秒,建议不超过300)，减少缓冲时间，但不建议修改得太小。

3. 测试源码（ckplayer 6.4版本）

　　https://download.csdn.net/download/tracine0513/10729945

　　说明：源码需要在 web 容器运行才能正常直播和点播

ckplayer 插件在线视频播放的更多相关文章

  1. HTML5的在线视频播放方案

    移动端H5音频与视频问题及解决方案 看下最后实际效果:兼容PC,iphone, 安卓5.0 解决了,手动,自动,不全屏的问题 左边视频代替了动画,然后支持背景蒙板效果,能够透出底图 右边是原视频文件 ...

  2. ckplayer插件播放视频

    官网:超酷网页视频 本篇介绍:插件播放视频,  添加插件(额外的功能),  视频格式之间的转换 PC端一般都是利用插件(Flash)来播放视频,可以支持很多格式.网上很多说这个插件的,这里只是做个记录 ...

  3. eclipse插件在线发布发布和版本更新(web site) 转

    欢迎关注我的社交账号: 博客园地址: http://www.cnblogs.com/jiangxinnju/p/4781259.html GitHub地址: https://github.com/ji ...

  4. 基于Html5的兼容所有主流浏览器的在线视频播放器videoJs

    在一个新的项目上需要实现在线视频播放,原本打算借助优酷的视频存储和播放,但是发现这个需要用户注册优酷账户,严重影响用户体验,于是这个方案被毙掉了.于是开始了自己开发一个在线播放器的想法,当然尽量使用已 ...

  5. js插件---在线类似excel生成图表插件解决方案

    js插件---在线类似excel生成图表插件解决方案 一.总结 一句话总结:google比百度好用多了,多用google google js editable table jquery 双向绑定 这种 ...

  6. 使用pdfjs插件在线预览PDF文件

    前言 本文介绍在html中使用 pdfjs插件在线预览PDF文件的方法. 实现步骤 下载 pdfjs 并引入项目中 到PDFJS官网 http://mozilla.github.io/pdf.js/g ...

  7. Joomla的在线视频播放插件：AllVideos

    一个很好的插件,只需要在文章中插入一条简单的语句就可以实现视频播放,视频可以位于网站服务器上或其他视频网站的. 例如:{f4v}ShaHua-H264{/f4v}   我在使用中只有一个地方觉得需要更 ...

  8. 使用CKplayer插件在网页中嵌入视频的方法（常用笔记2）

    在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...

  9. 【CKplayer】使用CKplayer插件在网页中嵌入视频的方法

    在做网站中有时候我们需要在网页中嵌入视频,一般视频嵌入有以下几种方法: 1. 优酷代码嵌入 优点:简单,方便,可靠. 缺点:有广告,现在的网站非常注重用户体验,如果打开一个在线视频是有长广告的一定会崩 ...

随机推荐

  1. AspJpeg2.0组件教程完整版 aspjpeg教程...

    AspJpeg是一款功能强大的基于Microsoft IIS环境的图片处理组件,网络上对其进行详细和深入介绍的中文文章并不多,即使有一般也只是牵涉到图片缩略图和图片水印,这与其为英文版本有着密切的关系 ...

  2. AMP Physical Link Creation And Disconnect

    A flow diagram of the AMP link establishment and detachment of a connection between two devices is s ...

  3. u3d demo起步第二章

    假设要给一个角色加入寻路组件.那么仅仅须要选中这个角色,Component->Navigation->Nav Mesh Agent就能够加入寻路组件. 然后仅仅要agent.SetDest ...

  4. [译]基于Vue.js的10个最佳UI框架，用于构建移动应用程序

    原文查看10 Best Vue.js based UI Frameworks for Building Mobile Apps 如果您期待使用Vue.js构建移动应用程序,那么您可以选择许多可用的UI ...

  5. [Preact] Use State and Props in the Component Render Function

    Preact offers, in addition to the regular component API from React, the ability to access both props ...

  6. LeetCode——Set Matrix Zeroes

    Given a m x n matrix, if an element is 0, set its entire row and column to 0. Do it in place. 原题链接:h ...

  7. java 封装解析 Json数据。

    import java.util.HashMap; import java.util.Iterator; import java.util.List; import java.util.Map; im ...

  8. PHP中出现BOM字符\ufeff，PHP去掉诡异的BOM \ufeff

    研究一个PHP项目的时候,今天项目突然打不开了. 前几天还好好的,用Chrome看了下Response的内容,AJAX页面和普通HTML页面内容前面有一个红色的点. 鼠标移上去,提示"\uf ...

  9. [React] Cleanly Map Over A Stateless Functional Component with a Higher Order Component

    In this lesson we'll create a Higher Order Component (HOC) that takes care of the key property that ...

  10. [Recompose] Flatten a Prop using Recompose

    Learn how to use the ‘flattenProp’ higher order component to take a single object prop and spread ea ...