mediaelement.js - android 默认浏览器和 dolphin 浏览器加载 mp3 问题答案

【问题标题】：mediaelement.js - android default browser and dolphin browser loading mp3 issuesmediaelement.js - android 默认浏览器和 dolphin 浏览器加载 mp3 问题
【发布时间】：2013-03-06 06:26:07
【问题描述】：

早安，

我目前正在为自己构建一个网站（我是一名作曲家/制作人），并且我正在将 Media Element 用于主演示页面。该页面正在建设中，链接如下：

http://www.vincentrubinetti.com/listen.html

http://www.vincentrubinetti.com/listen.js

以下是我认为的相关函数和代码：

function initPlayer()
{
    player = new MediaElementPlayer('#listen_player',{
        success: function (mediaElement, domObject) 
        { 
            mediaElement.addEventListener('play', resumeSong, false);
            mediaElement.addEventListener('ended', playNextSong, false);
            mediaElement.addEventListener('pause', pauseSong, false);
        }
    });

    [omitted]
}

function setSong(element)
{
    if (element != "")
    {
        unselectAllSongs();
        document.getElementById(element).className = "listen_song_highlight";

        [omitted]

        var newSrc = document.querySelector("#"+element+" .listen_song_source").title;
        player.pause();
        player.setSrc(newSrc);
        player.load();
    }
}

function playSong(element)
{
    document.querySelector("#"+element+" .listen_song_status").innerHTML = "playing";
    player.play();
}

function playNextSong()
{
    var newSong = document.querySelector(".listen_song_highlight + div.listen_song");
    if (autoplay && newSong != null)
    {
        setSong(newSong.id);
        playSong(newSong.id);
    }
    else
    {
        document.querySelector(".listen_song_highlight .listen_song_status").innerHTML = "stopped";
    }
}

所有的 CSS 结尾似乎都很好。它找到列表中的下一首歌曲并设置新的来源；我已经通过警报和其他调试验证了它是否正确执行此操作。但是在Android默认浏览器和Dolphin浏览器上，有时似乎无法加载mp3，过早触发“end”事件去下一首歌曲。结果是在播放完一首歌曲后似乎跳过了 2-3 首歌曲。甚至要让它播放一个，单击歌曲 div 和播放器播放按钮也需要一些技巧。我可以输入与 html 中相同的 url，浏览器会正常播放/下载它，访问或加载它没有问题。

以下是在播放列表中重复播放的 3 个 mp3 文件，以供参考。它们是我的，但它们是真实音乐的占位符。

NEW/music/creation.mp3
NEW/music/startup.mp3
NEW/music/win.mp3

请注意，所有这些都可以在 Chrome、Firefox、IE8+ 和 Android Chrome 上正常运行（我还没有测试过 iPhone 或 iPad）。

我的诊断正确吗？谁能指出我正确的方向？是否有任何 MediaElement 在 Android 默认浏览器和 Dolphin 浏览器上无法正常工作的经历？

【问题讨论】：

如果是服务器或 MediaElement 异常，我没关系。但如果是我的代码，我不能休息，直到它是正确的！但我无法想象我的代码有什么问题。由于 Web 开发的临时/零碎性质，可能需要一些解决方法。

标签： android browser load mediaelement.js dolphin-browser

【解决方案1】：

我在 android 中遇到了同样的问题（但是视频...）

有人告诉我这是文件没有及时下载的问题——即浏览器开始下载，但由于文件没有下载，它的长度为 0:00，因此触发了结束事件。

如果有办法使视频/音频可以更快地下载，它可以解决问题。

奇怪的是，如果设备有良好的 WiFi，那么这个问题基本上就消失了。

看看 John Dyer 在这里怎么说：

https://github.com/johndyer/mediaelement/issues/543

【讨论】：