2

我正在使用 HTML5 AudioElement 播放我的 .mp3 文件,但我注意到无法跳过该位置。我正在通过 PHP 从 www 根目录之外获取文件。

我正在使用 HTML 代码:

<audio src="" controls id="appAudio" style="width:1000px;margin-top:10px"></audio>

JavaScript 代码:

document.getElementById('appAudio').src= 'http://localhost/index.php/player/get_audio_via_php/1';

PHP代码:

    $file = "/myfolder/1.mp3";
    header('Content-Type: audio/mpeg');
    header('Content-Length: ' . filesize($file));

    return file_get_contents($file);

就像我说的那样,它确实会播放音频文件,但无法跳过位置。有针对这个的解决方法吗?

谢谢

4

3 回答 3

4

如果浏览器没有缓存中的文件,“跳过”会导致浏览器发送一个带有“范围”标头的新请求。您的 PHP 文件需要处理此标头。

这表示:

  1. 获取并解析范围标头
  2. 使用状态码 206 和相应的范围标头响应请求
  3. 只输出必要的字节
于 2012-11-19T15:44:18.023 回答
3

看看这篇文章,与通过 php 提供 mp3 文件有关。

答案建议更改内容类型以包括几种类型:

header("Content-Transfer-Encoding: binary"); 
header("Content-Type: audio/mpeg, audio/x-mpeg, audio/x-mpeg-3, audio/mpeg3");
于 2012-11-19T15:08:32.950 回答
0

老问题...我用过这个,似乎在 Chrome 上工作。

    header("Content-Transfer-Encoding: binary"); 
    header("Content-Type: audio/mpeg, audio/x-mpeg, audio/x-mpeg-3, audio/mpeg3");
    header('Content-Disposition:: inline; filename="'.$audio->filename.'"');
    header('Content-length: '.$fileSize);
    header('Cache-Control: no-cache');
    header('Accept-Ranges: bytes');
    readfile($filepath);
于 2017-04-20T10:13:47.533 回答