您的位置 首页 php

js + php 读取、播放视频流 兼容firefox,chrome ie mac的safari

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->is safari ()|| $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- ch eck=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

文章地址:https://www.zhihuclub.com/76801.shtml

关于作者: 智云科技

热门文章

网站地图