将ueditor上传的视频转换为flowplayer播放，并隐藏其播放地址

来源：互联网发布：上海君来知乎编辑：程序博客网时间：2024/05/22 17:22

1、在页面引用flowplayer-min.js；

2、将ueditor上传的video标签内容转换成div标签内容，替换后的内容形式如下：

<div src="videoReplaceUrl" style="height:400px;" class="video-js"></video>

3、用jquery遍历class为video-js的div，注册flowplayer播放元素；

/*遍历*/var video_index = 1;        $(".video-js").each(function()        {            var divVideoId = "divVideo" + video_index;            $(this).attr("id", divVideoId);            var videoUrl = $(this).attr("src");            changeToFlowplayer(videoUrl, divVideoId);            video_index++;         });

/*转换成flowplayer播放*/function changeToFlowplayer(videoUrl, divVideoId)    {        var ts = new Date().getTime()/1000;        ts = ts.toString(16);        ts = ts.split(".")[0];        var playing = false;        var autoPlay = false;                flowplayer(            divVideoId,            "/xxx/flowplayer/flowplayer-3.2.8.swf",            {                plugins: {                    secure: {                        url: 'flowplayer.securestreaming-3.2.3.swf',                        timestamp: ts,                        token: "xxxxx"                    }                },                clip:{                    autoPlay: autoPlay,                    autoBuffering: false,                    urlResolvers: 'secure',                    baseUrl: '/swf-play',                    onStart : function() {                        if(!playing && typeof(playCallBack)=='function'){                            playCallBack();                            playing = true;                        }                    }                },                  playlist: [videoUrl]            }        );    }

4、当使用flowplayer播放上时，会生成如下形式url：

http://navy.com/swf-play/05538e221a147e28d206378e66740058/55e3ca51/1440758930760

这时已经达到隐藏url的目的，其中05538e221a147e28d206378e66740058为ts、token、videoUrl通过md5加密生成。ts:55e3ca51;videoUrl:1440758930760

5、接下来就是针对伪url进行处理；

在nginx下，对伪url进行重写操作，让它跳转到处理的swf-play.action中。

rewrite  ^/swf-play/([0-9a-zA-Z]+)/([0-9a-zA-Z]+)/([0-9a-zA-Z\.]+)$ /swf-play.action?ts=$2&token=$1&name=$3 last;

6、在swf-play.action中拿到ts、token、name进行解密验证，以判断该请求是否通过，如通过，读取视频流，写到结果里面，播放视频。

//验证String hashSalt = getHashSalt();String temp = DigestUtils.md5Hex(hashSalt + "/" + name + ts);boolean result = temp.equals(this.token);return result;

//返回视频流BufferedInputStream bis = null;ServletOutputStream os = null;File f = null;f = new File(realPath);bis = new BufferedInputStream(new FileInputStream(f));int available = bis.available();HttpServletResponse response = getResponse();response.setContentType("application/x-shockwave-flash");response.addHeader("x-app", "xxx");response.addHeader("Content-Length", f.length() + "");response.addHeader("Cache-Control", "private");os = response.getOutputStream();byte[] b = new byte[1024];int begin = 0;int readCount = 0;while (begin <= available) {readCount = bis.read(b);if (readCount <= 0) {break;        }os.write(b, 0, readCount);begin += readCount;}

0 0