Safari中的音频持续时间在通过PHP流式传输时始终返回无穷大 [英] audio duration in Safari always returning infinity when streaming through PHP

问题描述

出于某种原因，在Safari（没有其他主要浏览器）中，当我通过 PHP 通过 c>音频上下文提供MP3时> JavaScript ，MP3的持续时间总是以无穷大的形式返回。

For some reason in Safari (and no other major browser), when I serve an MP3 via PHP through an Audio context in JavaScript, the duration of the MP3 is always returned as infinity.

此问题已难倒我在过去的几天里和阅读了几个链接后（包括这个）在寻找解决方案时，我还没有取得进展。

This problem has stumped me for the last few days and after reading a few links (including this one) in search for a solution, I have not progressed at all.

$path = "path/to/file.mp3";
$file = [
    "path"      => $path,
    "size"      => filesize($path),
    "bitrate"   => $bitrate
];

header("Accept-Ranges: bytes", false);
header("Content-Length: " . $file["size"], false);
header("Content-Type: audio/mpeg", false);

echo file_get_contents($file["path"]);

exit;

JavaScript：

JavaScript:

var audio = new Audio(url);
// returns infinite on Safari
// returns 312.27311 on Chrome and Firefox (which is correct)
console.log(audio.duration);

---

我还没弄清楚为什么会这样问题只出现在Safari以及首先导致它的原因，所以如果有人有解决方案，那将非常感谢！

---

I'm still yet to figure out why this problem is only in Safari and what is causing it in the first place, so if anyone has a solution it would be much appreciated!

干杯。

推荐答案

经过大量调查后，我终于弄明白了。

After much investigation like yourself I finally figured it out.

Safari发送的第一个请求有标题：

The first request Safari sends has the header:

Range: bytes=0-1

您的工作是正确回复，以便Safari发送其他请求以获取文件的其余部分。

It's your job to respond "correctly" so that Safari will send additional requests to fetch the rest of the file.

以下是正确标题的示例：

Here is my example of the "correct" headers:

Content-Length: 2
Accept-Ranges: bytes
Content-Range: bytes 0-1/8469
(Make sure you set response status to 206!)
(8469 is the Content-Length of the entire file)

之后发生的事情有点神奇--Safari发出跟进请求有这个标题：

What happens after that is somewhat magical - Safari sends a follow up request that has this header:

Range: bytes=0-8468

您应该像使用这些标题一样正确回复：

And you should respond "correctly" like with these headers:

Content-Length: 8469
Accept-Ranges: bytes
Content-Range: bytes 0-8468/8469
(Again, status 206!)

我希望这能为你解决，因为我花了很多时间寻找无济于事。我最终意识到我需要调整我的服务器以处理Range标头存在的请求。

I hope this solves it for you, since I spent many hours searching to no avail. I eventually realized I needed to adjust my server to handle requests where the Range header is present.

我使用此提交来帮助我理解正确的响应是什么： https://github.com/jooby-project/jooby/commit/142a933a31b9d8742714ecd38475d90e563314f7

I used this commit to help me understand what the "correct" response is: https://github.com/jooby-project/jooby/commit/142a933a31b9d8742714ecd38475d90e563314f7

这篇关于Safari中的音频持续时间在通过PHP流式传输时始终返回无穷大的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！