用html5播放m3u播放列表

Question

我创建了一个非常简单和基本的html5音频播放器，实际上不超过：

<audio src="[url-to-m3u]" controls>

但我面临两个问题，这个简单的音频标签适用于Chrome，但不适用于Safari 7 第二个是它不适用于我的iPhone iOS7，也不适用于HTC Android 2.3

---

播放列表元素为mp3， 内容类型：audio / mpeg

Answer 1

我想对m3u文件格式的支持将分散在HTML5媒体兼容的浏览器中。

它应该在iOS上播放：尝试将mime-type audio / mpegURL或application / x-mpegURL添加到您的服务器（如果尚未完成）和我们的源标记。

<audio controls>
    <source src="[url-to-m3u]" type="audio/mpegURL" />
</audio>

您需要使用canPlayType方法检查mp3和m3u的浏览器支持 - 例如：

var supportsMp3 = false;
var myAudio = document.createElement('audio');
if (myAudio.canPlayType('audio/mpeg') !== ""){supportsMp3 = true;}

您需要先检查音频/ mpegURL和application / x-mpegURL以及audio / mpeg，然后再发送m3u文件。我建议您使用回退来处理您的案例场景，因为并非所有浏览器都支持m3u文件。

例如，m3u文件未出现在supported media matrix for Android中。

编辑：您可以使用支持m3u文件的JW player来获得更广泛的浏览器覆盖率。否则，请尝试找一个开放的source/free flash player作为后备。

此外，您的m3u文件可以使用JS解析来提取mp3 URL（m3u文件通常只引用项目的播放列表）。之后，它只是用正确的mp3 URL动态更改音频标签的src。