时间戳

首页 > 解决方案 > 音频流与ios音频播放器的交互

javascript - 音频流与ios音频播放器的交互

问题描述

这是一件事。有一个带有播放/暂停按钮的小站点，可以播放实时音频流。

rstlss.live

因此，当您在手机上打开它并按播放或暂停时 - 一切正常。但是，如果您继续播放音频，请锁定屏幕，按手机上的电源按钮（任何可以唤醒手机而无需解锁的按钮），然后在手机的迷你播放器中按暂停 - 音频将暂停。但随后您解锁手机，继续在浏览器中翻页 - 按钮并没有改变其状态。您必须先按暂停然后播放才能重新开始播放。

有没有什么办法可以把这两件事联系起来？这是完整的代码。

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>rstlss//live</title>
 <style>
    body{ background:#666; }
    button#playpausebtn{
    background:url(assets/images/pause.png);
    border:none;
    width:200px;
    height:200px;
    cursor:pointer;
</style>

    <script>
    var audio, playbtn, seek_bar;
function initAudioPlayer(){
    audio = new Audio();
    audio.src = "http://78.155.172.94:8000/download.mp3";
    audio.loop = true;
    audio.play();
    playbtn = document.getElementById("playpausebtn");
    playbtn.addEventListener("click",playPause);
    function playPause(){ 
        if(audio.paused){
            audio.play();
            playbtn.style.background = "url(assets/images/pause.png) no-repeat";
        } else {
            audio.pause();
            playbtn.style.background = "url(assets/images/play.png) no-repeat";
        }
    }

}
window.addEventListener("load", initAudioPlayer);
</script>

</head>
<body>
<button id="playpausebtn"></button>
</body>
</html>

预计当您在锁定模式下按下 ios 音频播放器中的暂停时，浏览器中的播放/暂停按钮也会根据播放器更改其状态。

标签： javascriptiosaudiohtml5-audioaudio-streaming

解决方案

推荐阅读