ckplayer插件播放m3u8视频

var flashvars = {f: 'ckplayer/m3u8.swf',      //使用swf向播放器发送视频地址进行播放a: 'video/m.m3u8',       //m3u8文件c: 0,       //调用 ckplayer.js 配置播放器p: 1,     //自动播放视频s: 4,       //flash插件形式发送视频流地址给播放器进行播放lv: 0,        //注意，如果是直播，需设置lv:1loaded: 'loadedHandler'
}

昨天，要将下载的 m3u8 文件改成 “m.m3u8" 这种格式，再将 a 设置成 video/m.m3u8 ，才能播放视频，今天却播放不了了，而且不断报错，如下图：

var flashvars = {f: 'ckplayer/m3u8.swf',      //使用swf向播放器发送视频地址进行播放a: 'video/m3u8',     //m3u8文件c: 0,       //调用 ckplayer.js 配置播放器p: 1,     //自动播放视频s: 4,       //flash插件形式发送视频流地址给播放器进行播放lv: 0,        //注意，如果是直播，需设置lv:1loaded: 'loadedHandler'
}

然后，我将 m.m3u8 格式改回成 m3u8，再将a设置成video/m3u8，视频反而可以播放了。浏览器控制台显示如下图：

无语了，下午，m.m3u8格式又可以播放视频了……

var flashvars = {f: 'ckplayer/m3u8.swf',      //使用swf向播放器发送视频地址进行播放a: encodeURIComponent(decodeURIComponent('http://pl.youku.com/playlist/m3u8?ts=1422522760&keyframe=0&vid=XODc1NzMyNTA0&type=mp4&ep=cSaWGEyPVc4F4CDYgT8bNS60ciNbXJZ1gkyE%2F5gfScVAOejQmjbUxQ%3D%3D&sid=342252305537912b2f6dd&token=3852&ctype=12&ev=1&oip=3663591661')),    //m3u8文件c: 0,       //调用 ckplayer.js 配置播放器p: 1,     //自动播放视频s: 4,       //flash插件形式发送视频流地址给播放器进行播放lv: 0,        //注意，如果是直播，需设置lv:1loaded: 'loadedHandler'
}

刚刚解决了外部链接播放m3u8视频的问题。

例如：我们得到了一个外部m3u8链接1

http://pl.youku.com/playlist/m3u8?ts=1422522760&keyframe=0&vid=XODc1NzMyNTA0&type=mp4&ep=cSaWGEyPVc4F4CDYgT8bNS60ciNbXJZ1gkyE%2F5gfScVAOejQmjbUxQ%3D%3D&sid=342252305537912b2f6dd&token=3852&ctype=12&ev=1&oip=3663591661

这个链接中有一部分被进行了URI编码

首先，我们要用 decodeURIComponent() 方法对其解码，得到如下链接2

http://pl.youku.com/playlist/m3u8?ts=1422522760&keyframe=0&vid=XODc1NzMyNTA0&type=mp4&ep=cSaWGEyPVc4F4CDYgT8bNS60ciNbXJZ1gkyE/5gfScVAOejQmjbUxQ==&sid=342252305537912b2f6dd&token=3852&ctype=12&ev=1&oip=3663591661

然后，再用 encodeURIComponent() 方法对上面的链接进行 URI 编码，得到如下链接3

http%3A%2F%2Fpl.youku.com%2Fplaylist%2Fm3u8%3Fts%3D1422522760%26keyframe%3D0%26vid%3DXODc1NzMyNTA0%26type%3Dmp4%26ep%3DcSaWGEyPVc4F4CDYgT8bNS60ciNbXJZ1gkyE%2F5gfScVAOejQmjbUxQ%3D%3D%26sid%3D342252305537912b2f6dd%26token%3D3852%26ctype%3D12%26ev%3D1%26oip%3D3663591661

上面的链接就可以用在 ckplayer 的代码里了。

这里需要注意的是，不能直接对链接1进行URI编码，必须先解码再编码。

因为最开始得到的链接可能是部分变编码了的，如果对这种链接直接编码，得到的链接，和先解码再编码得到的链接是不一样的。

例如，我们直接对链接1编码，得到的链接4：

http%3A%2F%2Fpl.youku.com%2Fplaylist%2Fm3u8%3Fts%3D1422522760%26keyframe%3D0%26vid%3DXODc1NzMyNTA0%26type%3Dmp4%26ep%3DcSaWGEyPVc4F4CDYgT8bNS60ciNbXJZ1gkyE%252F5gfScVAOejQmjbUxQ%253D%253D%26sid%3D342252305537912b2f6dd%26token%3D3852%26ctype%3D12%26ev%3D1%26oip%3D3663591661

对比一下，链接4和链接3是不一样的，encodeURIComponent() 对百分号% 再次进行了编码。

我已经很久没接触这方面的内容了，相关的知识点早已忘记，所以各位的问题都回答不了了。2016-12-14

ckplayer插件播放m3u8视频相关推荐

360极速浏览器不能添加hls插件，怎样播放m3u8视频？
谷歌和火狐浏览器都可以在扩展程序添加Native HLS Playback插件播放m3u8视频,但是360搜了一下没有类似的插件. 那怎么办呢,有个好办法就是大家可以简单粗暴直接换成Chrome浏览器 ...
video插件播放m3u8格式视频(存原生)
video插件播放m3u8格式视频(存原生) 这里使用原生的javascript实现m3u8格式视频播放. 使用了包括video.min.js库和HLS插件. 1-基础使用 <!DOCTYPE ...
Hls.js播放m3u8视频 DPlayer视频播放器（easypan） MSE简介
文章目录学习链接 hls.js播放m3u8视频效果代码前端代码安装hls.js App.vue 后台代码准备文件 mp4文件切片java实现 TsController TsService ...
android 3.0 m3u8,在Android中播放m3u8视频
我想直播视频,并且它采用m3u8格式.所以,我想下面的代码在Android中播放m3u8视频 public class StreamingPlayer extends Activity impleme ...
video.js播放m3u8视频
m3u8 是一种基于HTTP Live Streaming(HLS)文件视频格式,它主要是存放整个视频的基本信息和分片(Segment)组成.目前由 Apple.inc 率先提出的 HLS 协议在 ...
video.js兼容微信浏览器，（播放.m3u8视频源）解决微信浏览器黑屏问题
video.js兼容微信浏览器,(播放.m3u8视频源)解决微信浏览器黑屏问题一.问题描述: 在h5做根据视频源直播功能时,在浏览器能打开视频,但是在部分安卓机和苹果机在微信浏览器打开会出现黑屏的状 ...
怎么播放m3u8视频
为了播放 m3u8 视频,你需要有一个支持 m3u8 格式的视频播放器.常用的视频播放器有 VLC.Potplayer 等. 你需要在这些视频播放器中打开 m3u8 文件,即可播放视频. 你也可以使用 ...
h5在IOS使用videojs插件播放hls视频
h5使用videojs插件播放hls视频踩坑点具体实现步骤 1. index.html页面引入(最好下载到本地) 2. npm install video-js 并且在需要看监控的页面引入 3. ...
m3u8.php怎么调用,怎样使用Vue结合Video.js播放m3u8视频
这次给大家带来怎样使用Vue结合Video.js播放m3u8视频,使用Vue结合Video.js播放m3u8视频的注意事项有哪些,下面就是实战案例,一起来看一下. 首先,我们需要在vue工程中安装vi ...
uniapp 使用 mui-player 插件播放 m3u8/flv 视频流
背景:uniapp 开发的h5项目,需要播放m3u8/flv后缀的视频,网上有很多视频插件,但是样式和效果不尽如人意,博主最后选择mui-player插件,定制化稍微强一点以及有官方文档可以阅读,官网 ...

ckplayer插件播放m3u8视频

ckplayer插件播放m3u8视频相关推荐

最新文章

热门文章