将 HTMLMediaElement 连接到 Android 播放控件

Question

我已经用 HTML/Javascript 创建了一个用于播放列表的 HTML 音频播放器。播放列表通过媒体列表进行内部管理，并且

ended

事件会自动播放队列中的下一个媒体。

通过 Android Bromite 浏览器，我可以播放媒体并且一切正常。 Android 通知卡显示媒体播放控件（上一个、下一个、暂停），但只有播放/暂停有效。

如何将我的下一个/上一个 Javascript 方法（从播放器 HTML 按钮调用时工作正常）连接到 Android 下一个/上一个播放控件？ HTMLMediaElement API 似乎有一个 audioTracks 属性可以做到这一点，但目前只有 Safari 支持。

Answer 1

我偶然发现它，在https://googlechrome.github.io/samples/picture-in-picture/audio-playlist

上寻找画中画

这是相关代码：

// Update Media Session metadata
navigator.mediaSession.metadata = new MediaMetadata({
    title: track.title,
    artist: track.artist,
    album: track.album,
    artwork: track.artwork
});

let playlist = ... // get your playlist as array
let audio = new Audio();

function switchTrack(index) {
   let track = playlist[index];
   audio.src = track.src;
   audio.play();
}

navigator.mediaSession.setActionHandler('previoustrack', function() {
  log('> User clicked "Previous Track" button.');
  index = (index - 1 + playlist.length) % playlist.length;
  switchTrack(index);
});

navigator.mediaSession.setActionHandler('nexttrack', function() {
  log('> User clicked "Next Track" button.');
  index = (index + 1) % playlist.length;
  switchTrack(index);
});

更多信息在这里：https://developer.mozilla.org/en-US/docs/Web/API/MediaSession