zoukankan      html  css  js  c++  java
  • ckplayer

    ckplayer 的使用基本功能实现(一)

    有个项目里用到视频播放功能,虽然是国产的插件,但我觉得做的还是不错,而且是免费使用,顺便支持下国内的一些项目(O(∩_∩)O~)。

    一、首先去官网下载 插件 http://www.ckplayer.com/

    下载完了以后,解压里面有demo,我觉得demo做的不错,有各种参数切换查看,兼容flash与html5  在pc与移动设备都可播放。

    二、实现任意拖动播放

    官网也有说明,这边自己实现了一遍,记录下而已,以便下次参考。

    (1)下载最新nginx 

    nginx官网地址(最新下载地址):http://nginx.org/en/download.html

    我的是windows2008 r2 64位服务器 我下载

    解压后放到D盘,当然你可以放到自己喜欢的盘下,这里要特别注意,路径里不要有中文符号(不能有中文)

    D: ginx

    下面配置nginx
    找到conf/nginx.conf文件(找不到说明你没开显示文件后缀名的功能),用记事本打开
    在server段,不知道server段在哪?那就找
            location / {
                root   html;
                index  index.html index.htm;
            }
    在该段第三行的下方添加上如下代码
            location ~ .flv {
                flv;
            }
            location ~ .mp4 {
                mp4;
            }

    最后的效果应该如下图(部份,只截了改动的部份)

     注意:listen    8088;  这边的8088端口可以修改自己想要的  当然,不要与IIS配置的或者与其他的冲突即可。

    下面来启动nginx,win+r 输入cmd  进入nginx目录,输入:start nginx

    启动后看到这个文件就成功了,另外在服务器输入:http://localhost:8088/  浏览器中看到

    完成了启动了,然后服务器配置好了,把1.mp4视频放入D: ginxhtml 该目录下,视频播放路径为http://localhost:8088/1.mp4 

    那么ckplayer的播放器配置为:

    <div id="a1"></div>
    <script type="text/javascript" src="ckplayer.js" charset="utf-8"></script>
    <script type="text/javascript">
     var flashvars={
         f: 'http://localhost:8088/1.mp4',
         c:'0'
         ,h:'4',
         q:'start'
     };
     var params={bgcolor:'#FFF',allowFullScreen:true,allowScriptAccess:'always',wmode:"transparent"};
    var video=['http://localhost:8088/1.mp4->video/mp4'];
     CKobject.embed('ckplayer.swf', 'a1', 'ckplayer_a1', '600', '400',false, flashvars,video, params);
    </script>

    这样的话   进度条可任意拖动了。

    遗留的问题,如果视频已经缓存完毕了,我拖动下进度条,又要重新进行读取数据缓存了,也就是说 任意拖动 缓存不起作用了,自己体会下吧。

    如果你们解决这个问题 请麻烦告诉我,万分感谢~

    有兴趣加下QQ群交流:112992863 (微软技术交流群)

  • 相关阅读:
    Windows Power Shell
    一个自律的人有多可怕!
    Android之TextureView浅析
    BEGINNING SHAREPOINT&#174; 2013 DEVELOPMENT 第9章节--client对象模型和REST APIs概览 介绍SP2013中远程APIs
    敌兵布阵(线段树)
    kendo AutoComplete实现多筛选条件
    Android 65K问题之Multidex原理分析及NoClassDefFoundError的解决方法
    让我心碎的五道题
    输入一列数组,输出它的逆序数组
    centos下配置防火墙port失败
  • 原文地址:https://www.cnblogs.com/Leo_wl/p/4176213.html
Copyright © 2011-2022 走看看