前言
在AudioStation Web播放器上听歌有个非常麻烦的问题:无法利用系统快捷键控制网页播放器的进行诸如上一首、下一首、暂停/播放这些动作,只能切回播放器的页面手动点击来操作。为了解决Web应用在媒体控制方面的优化,Google提出了Media Session API的标准。
Media Session API标准在2017年W3C就完成了规范制定,目前在主流浏览器都得到了支持。我们只需要在AudioStation的Web页面上执行一段自定义JS,就能让网页播放器支持系统级别的媒体控制。
实现
将以下代码AudioStation在控制台执行,也可以使用我写的油猴插件:https://greasyfork.org/en/scripts/526802-audiostation-support-the-mediasession-api
setInterval(function() {
if (!navigator.mediaSession) {
return
}
var main = SYNO?.SDS?.AudioStation?.Window?.getPanelScope("SYNO.SDS.AudioStation.Main")
if (!main) {
return
}
navigator.mediaSession.metadata = new MediaMetadata({
title: main.playerPanel.Ctrl.getCurrentTitle(),
artist: main.playerPanel.Ctrl.getCurrentArtist(),
album: main.playerPanel.Ctrl.getCurrentAlbum(),
artwork: [{
src: main.playerPanel.Ctrl.getCurrentCover(),
}],
});
navigator.mediaSession.setActionHandler('play', function() {
main.audioPlayer.doPlay();
});
navigator.mediaSession.setActionHandler('pause', function() {
main.audioPlayer.doPlay();
});
navigator.mediaSession.setActionHandler('previoustrack', function() {
main.audioPlayer.doPrevious();
});
navigator.mediaSession.setActionHandler('nexttrack', function() {
main.audioPlayer.doNext();
});
},
1000)
Why is setInterval?
尝试过重写AudioStation使用的SoundManager组件的play方法实现mediaSession元数据以及播放事件绑定,但是在macOS的chrome上总是有兼容性问题:有概率metadata设置不上去,故换实现思路。
没想到懒办法的setInterval效果拔群:)
Comments | NOTHING (这是个静态化页面,评论后要等CDN刷新啦~)