js + php 读取、播放视频流 兼容firefox,chrome,ie,mac的safari,ios的safari,ios的微信浏览器(curl读取文件流篇)
2014-04-22 11:59
711 查看
————————————2015-5-13————最新更新———————————————
由于jwplayer6已经完全无法正常工作,以下介绍的方法也已经失效,请更换视频播放插件,可以参考楼主的文章:
http://blog.csdn.net/snow_finland/article/details/45670683
————————————————————————————————————————
1、选用jwplayer6作为前端播放器
2、前端动态加载jwplayer视频盒子
3、前端加载的视频非视频的物理地址,而是通过php读取的视频流
4、php通过curl方式读取的视频流
加载视频盒子的部分js代码
其中请求检查设备和浏览器类型的devicecontroller.php代码
加载视频流的php
补充说明:
1、在js中请求判断一次设备,并通过js传递给php读取视频流,而不是在php端读取视频流时每次判断设备:
因为ios safari在第一次(会设定$_SERVER['HTTP_RANGE'])请求的时候,能判断出是ios的safari设备
在第二次以及之后的请求时,无法判断出是ios的safari设备
2、判断是否是ios的safari,在之后的文章中介绍
由于jwplayer6已经完全无法正常工作,以下介绍的方法也已经失效,请更换视频播放插件,可以参考楼主的文章:
http://blog.csdn.net/snow_finland/article/details/45670683
————————————————————————————————————————
1、选用jwplayer6作为前端播放器
2、前端动态加载jwplayer视频盒子
3、前端加载的视频非视频的物理地址,而是通过php读取的视频流
4、php通过curl方式读取的视频流
加载视频盒子的部分js代码
function load_video_player(width,height,fileid,type,title,size){ var player_w = width; var player_h = height; var isiphone; $.ajax({ type: 'POST', url: 'devicecontroller.php', data: 'islink='+islink, dataType:"JSON", async: false, success:function(data){ if(data.code == 1){ isiphone = data.data; }else{ isiphone = 0; } } }); var file_path = '/XXX/url?fileid='+fileid+'&type='+type+'&title='+title+'&size='+size+'&isiphone='+isiphone; var player_wrap = [ '<div id="J_video_container" class="video_container hide">', '<div class="video_box">', '</div>', '</div>' ].join(''); var player_box = [ '<div id="Jwplayer_box">Loading player...</div>' ].join(''); if($('#J_video_container').length==0){ $('#J_video_main').append(player_wrap); } $('#J_video_container').css('height',player_h+'px'); if($('#Jwplayer_box').length==0){ $('#J_video_container .video_box').append(player_box); } $('.video_box').css({'width':player_w+'px','height':player_h+'px'}); $('#J_video_container').show(); jwplayer("Jwplayer_box").setup({ 'width': player_w, 'height': player_h, 'controlbar': 'bottom', "autostart":"true", 'provider': 'video', 'type': 'mp4', 'file': file_path }); }
其中请求检查设备和浏览器类型的devicecontroller.php代码
//json_encode中文乱码问题修正 function arrayRecursive(&$array){ foreach ($array as $key => $value) { if (is_array($value)) { arrayRecursive($array[$key]);//如果是数组就进行递归操作 } else { if(is_string($value)){ $temp1= addslashes($value); $array[$key]= urlencode($temp1);//如果是字符串就urlencode }else{ $array[$key] = $value; } } } } function JSON($result) { $array=$result; arrayRecursive($array);//先将类型为字符串的数据进行 urlencode $json = json_encode($array);//再将数组转成JSON return urldecode($json);//最后将JSON字符串进行urldecode } require_once("Mobile_Detect.php"); $detect = new Mobile_Detect(); if($detect->isiPhone() || $detect->isiPad()){ if($detect->isSafari()|| $detect->isGenericBrowser()){//iphone和ipad上的safari或者微信浏览器 $iphone = 1; }else{ $iphone = 0; } }else{ $iphone = 0; } $data['code']=1; $data['data']=$iphone; echo JSON($data);
加载视频流的php
session_start(); $fileid = $_GET['fileid']; $isiphone = $_GET['isiphone']; $file_name = $_GET['title']; $file_type = $_GET['type']; $file_size = $_GET['size']; $cookie = $_SESSION['token']; //如果没有文件名,设置带扩展名的默认文件名 if(empty($file_name)){ $type = substr($file_type,0,5); if($type == "video"){ $type = substr($file_type,6); $file_name = "downfile.".$type; } } header("Content-type: ".$file_type); if(isset($_SERVER['HTTP_RANGE'])){ $http_range = $_SERVER['HTTP_RANGE']; $at = explode('=',$http_range); $at = explode('-',$at[1]); $start = $at[0]; if($at[1]==null){ $end = $file_size - 1; }else{ $end = $at[1]; } $length = $end - $start + 1; if($isiphone!=1){ $url = "/XXX/url/".$fileid; $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, $url); curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE); // 对认证证书来源的检查 curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE); // 从证书中检查SSL加密算法是否存在 curl_setopt($curl, CURLOPT_HEADER, 0); curl_setopt($curl, CURLOPT_TIMEOUT, 30); curl_setopt($curl, CURLOPT_RETURNTRANSFER, false); curl_setopt($curl, CURLOPT_HTTPHEADER, Array($cookie)); header('Expires: 0'); header('Cache-Control: must-revalidate, post-check=0, pre-check=0'); header('Pragma: public'); header("Content-Description: File Transfer"); header("Content-Transfer-Encoding: binary"); Header("Content-type: ".$file_type); Header('Content-Disposition: attacurlment; filename="'.$file_name.'"'); Header("Content-Length: ".$file_size); ob_end_flush(); flush(); $result = curl_exec($curl); curl_close($curl); }else{ header("Accept-Ranges: 0-$length"); set_time_limit(0); header("Content-Range: bytes $start-$end/$file_size"); header("Content-Length: $length"); $url2 = "/XXX/url/".$fileid; $ch = curl_init(); curl_setopt($ch, CURLOPT_URL,$url2); curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); curl_setopt($ch, CURLOPT_HEADER, false); curl_setopt($ch, CURLOPT_HTTPHEADER, Array($cookie)); curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE); // 对认证证书来源的检查 curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE); // 从证书中检查SSL加密算法是否存在 curl_setopt($ch, CURLOPT_TIMEOUT, 600); $content = curl_exec($ch); curl_close($ch); $output = substr($content,$start,$length); echo $output; exit; } }else{ $url = "/XXX/url/".$fileid; $curl = curl_init(); curl_setopt($curl, CURLOPT_URL, $url); curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE); // 对认证证书来源的检查 curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE); // 从证书中检查SSL加密算法是否存在 curl_setopt($curl, CURLOPT_HEADER, 0); curl_setopt($curl, CURLOPT_TIMEOUT, 30); curl_setopt($curl, CURLOPT_RETURNTRANSFER, false); curl_setopt($curl, CURLOPT_HTTPHEADER, Array($cookie)); header('Expires: 0'); header('Cache-Control: must-revalidate, post-check=0, pre-check=0'); header('Pragma: public'); header("Content-Description: File Transfer"); header("Content-Transfer-Encoding: binary"); Header("Content-type: ".$file_type); Header('Content-Disposition: attacurlment; filename="'.$file_name.'"'); Header("Content-Length: ".$file_size); ob_end_flush(); flush(); $result = curl_exec($curl); curl_close($curl); }
补充说明:
1、在js中请求判断一次设备,并通过js传递给php读取视频流,而不是在php端读取视频流时每次判断设备:
因为ios safari在第一次(会设定$_SERVER['HTTP_RANGE'])请求的时候,能判断出是ios的safari设备
在第二次以及之后的请求时,无法判断出是ios的safari设备
2、判断是否是ios的safari,在之后的文章中介绍
相关文章推荐
- js + php 读取、播放视频流 兼容firefox,chrome,ie,mac的safari,ios的safari,ios的微信浏览器(curl读取文件流篇) 分类: php javascript 浏览器兼容 safari 视频流 jwplayer6
- js + php 读取、播放视频流 兼容firefox,chrome,ie,mac的safari,ios的safari,ios的微信浏览器(文件读取文件流篇) 分类: php javascript jwplayer6 视频流 视频 safari
- js + php 读取、播放视频流 兼容firefox,chrome,ie,mac的safari,ios的safari,ios的微信浏览器(文件读取文件流篇)
- php 实现文件下载,兼容IE、Firefox、Chrome等浏览器
- JS 读取Excel文件(xls) 兼容Chrome/IE/Firefox
- Win/CentOS/MacOS Chrome/Firefox/IE/Safari DNS缓存时间与刷新
- javascript生成.xls文件(兼容IE&Chrome&Firefox)
- CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari
- css页面变灰度兼容ie、firefox、chrome、opera、safari实现样式
- js实现上传文件大小限制,兼容IE、Firefox、Chrome
- 多图片上传+图片预览,兼容所有浏览器 IE5/IE6/IE7/IE8/IE9/Chrome/Safari/Firefox/Opera/
- CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari
- CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari
- javascript生成.xls文件(兼容IE&Chrome&Firefox)
- 使用php文件读取视频stream并用flowplayer播放
- CSS半透明度设置,兼容Firefox, IE, Chrome, Opera and Safari
- 利用AJAX,得到XML和JSON信息,不用JQuery等UI框架,兼容 IE、Firefox、Chrome、Safari、Opera 等浏览器。
- 兼容IE和chrome的.wav音频文件在线播放
- CSS设置DIV Herf底层图片和链接同时改变,兼容IE,Firefox,Opera,Safari,Chrome等
- CSS设置DIV Herf底层图片和链接同时改变,兼容IE,Firefox,Opera,Safari,Chrome等