PHP视频流Seekbar在Chrome中无法使用

时间:2016-05-17 17:03:55

标签: javascript php google-chrome video seekbar

这与我的其他PHP视频流媒体帖子有些相关,但这次问题是视频的搜索栏在Chrome中不起作用。

我在Stack Overflow上找到了几个不同的帖子,但没有一个人解决了这个问题。我会链接所有这些,但我似乎找不到昨天发现的相同帖子。

我将列出两个版本的PHP代码。我还应该指出在PHP加载视频数据之前我到底做了什么。在HTML网页上,我有一个<video>标记,但没有<source>个标记。我使用Javascript对具有源标记的PHP文件进行AJAX调用。源标记本身不包含指向视频源文件的直接链接。相反,它们引用了另一个加载数据的PHP文件。

视频的顶级HTML。超级简单。

<video id="showvideo" height="540" width="864" controls></video>

现在进行AJAX调用

function showVideo() {
        if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("showvideo").innerHTML = xmlhttp.responseText;
       }
    }
   xmlhttp.open("GET", "/firstphpfile.php", true);

    xmlhttp.send();

}

页面加载时会加载Javascript函数。

这里是firstphpfile.php的内容

<?php

echo "

<source src=\"http://example.com/video1.php?type=stuff.mp4\" type=\"video/mp4\">

<source src=\"http://example.com/video2.php?type=stuff.ogv\" type=\"video/ogg\">
";
?>

同样,没什么大不了的。现在我将发布几个不同版本的video1.php文件,它实际上抓取了文件资源。

版本1:

<?php

$file = video.mp4;



$filesize = filesize($file);

$offset = 0;
$length = $filesize;

if ( isset($_SERVER['HTTP_RANGE']) ) {
// if the HTTP_RANGE header is set we're dealing with partial content

$partialContent = true;

// find the requested range
// this might be too simplistic, apparently the client can request
// multiple ranges, which can become pretty complex, so ignore it for now
preg_match('/bytes=(\d+)-(\d+)?/', $_SERVER['HTTP_RANGE'], $matches);

$offset = intval($matches[1]);
$length = intval($matches[2]) - $offset;
} else {
$partialContent = false;
}

$file = fopen($file, 'r');

// seek to the requested offset, this is 0 if it's not a partial conten request
fseek($file, $offset);

$data = fread($file, $length);

fclose($file);

if ( $partialContent ) {
// output the right headers for partial content

header('HTTP/1.1 206 Partial Content');

header('Content-Range: bytes ' . $offset . '-' . ($offset + $length) . '/' . $filesize);
}

// output the regular HTTP headers
header("Content-Type:video/mp4");
header('Content-Length: $filesize');
header('Accept-Ranges: bytes');

// don't forget to send the data too
print($data);



?>

版本2(我更喜欢这个在Firefox中的功能,但在Chrome中仍然没有骰子)

<?php

$file = video.mp4;


$mime = "video/mp4"; // The MIME type of the file, this should be replaced with your own.
$size = filesize($file); // The size of the file

// Send the content type header
header('Content-type: ' . $mime);

// Check if it's a HTTP range request
if(isset($_SERVER['HTTP_RANGE'])){
// Parse the range header to get the byte offset
$ranges = array_map(
    'intval', // Parse the parts into integer
    explode(
        '-', // The range separator
        substr($_SERVER['HTTP_RANGE'], 6) // Skip the `bytes=` part of the header
    )
);

// If the last range param is empty, it means the EOF (End of File)
if(!$ranges[1]){
    $ranges[1] = $size - 1;
}

// Send the appropriate headers
header('HTTP/1.1 206 Partial Content');
header('Accept-Ranges: bytes');
header('Content-Length: ' . ($ranges[1] - $ranges[0])); // The size of the range

// Send the ranges we offered
header(
    sprintf(
        'Content-Range: bytes %d-%d/%d', // The header format
        $ranges[0], // The start range
        $ranges[1], // The end range
        $size // Total size of the file
    )
);

// It's time to output the file
$f = fopen($file, 'rb'); // Open the file in binary mode
$chunkSize = 8192; // The size of each chunk to output

// Seek to the requested start range
fseek($f, $ranges[0]);

// Start outputting the data
while(true){
    // Check if we have outputted all the data requested
    if(ftell($f) >= $ranges[1]){
        break;
    }

    // Output the data
    echo fread($f, $chunkSize);

    // Flush the buffer immediately
    @ob_flush();
    flush();
    }
}
else {
// It's not a range request, output the file anyway
header('Content-Length: ' . $size);

// Read the file
@readfile($file);

// and flush the buffer
@ob_flush();
flush();
}


?>

所以,虽然两个播放视频都没有问题,但只有Firefox版本会让我做任何寻求。第二个版本使它只能向后搜索,我更喜欢。

我尝试了另一个版本,但在编写此代码之前我已经删除了代码并且还没有找到它。

我不确定我做错了什么,而且我找不到解决方案来解决允许Chrome版本的视频搜索的问题。

1 个答案:

答案 0 :(得分:0)

好的,所以我终于开始工作了。我决定不用javascript加载php文件。

另外,我摆脱了mime类型变量,只是正确设置了标题。我发现使用mime类型的变量会导致我的浏览器为内容类型标头加载错误的mime类型,从而导致视频资源失败。