没有音频的 Chrome MediaSession API

Eva*_*ess 5 android google-chrome media-player html5-audio web

我正在开发一个 Web 应用程序,让本地网络上的用户控制媒体服务器。

我想让 Android 用户看到来自 Chrome 的媒体通知,有没有办法在没有实际<audio>标签的情况下使用媒体会话 API ?或者我应该在页面上放置一个空的音频标签并以这种方式欺骗它。

https://developers.google.com/web/updates/2017/02/media-session

编辑:我通过阅读不同的文件回答了我自己的问题:

请注意:通知仅针对时长超过 5 秒的媒体显示。除非通过音频元素播放,否则不会收到来自 Web Audio API 的音频通知。使用 Media Session API,您可以通过为 Web 应用程序正在播放的媒体提供元数据来自定义媒体通知。此 API 还允许您处理媒体相关事件,例如可能来自通知或媒体密钥的搜索或跟踪更改。

来自:https : //developers.google.com/web/updates/2015/07/media-notifications

我能够使用https://github.com/anars/blank-audio来触发通知,然后将元数据设置为实际播放的内容。

setUpNotification = () => {
    if (!this.audioTag) {
      this.audioTag = document.createElement('audio');
      document.body.appendChild(this.audioTag);
      this.audioTag.src = "https://raw.githubusercontent.com/anars/blank-audio/master/10-seconds-of-silence.mp3";
      this.audioTag.loop = true;
      this.audioTag.play();
    }
  }

richMediaNotification = () => {
    if (this.audioTag) {

      let { playing } = this.state;
      let song = this.state.Queue.CurrentSong;

      navigator.mediaSession.metadata = new MediaMetadata({
        title: song.Name,
        artist: song.Artist,
        album: song.Album,
        artwork: [{ src: song.Image }]
      });

      navigator.mediaSession.playbackState = playing ? "playing" : "paused"

      navigator.mediaSession.setActionHandler('previoustrack', () => this.state.socket.emit("prevTrack"));
      navigator.mediaSession.setActionHandler('nexttrack', () => this.state.socket.emit("nextTrack"));
      navigator.mediaSession.setActionHandler('play', () => { this.audioTag.play(); this.state.socket.emit("playpause") });
      navigator.mediaSession.setActionHandler('pause', () => { this.audioTag.pause(); this.state.socket.emit("playpause") });

    }
  }
Run Code Online (Sandbox Code Playgroud)