'MediaMetadata' 未定义 no-undef 且 MediaMetadata 不是构造函数答案

【问题标题】：'MediaMetadata' is not defined no-undef and MediaMetadata is not a constructor'MediaMetadata' 未定义 no-undef 且 MediaMetadata 不是构造函数
【发布时间】：2021-08-25 03:26:41
【问题描述】：

我已经在 vuejs 中使用 howler.js 实现了播放列表播放器。我想将MediaMetadata API 集成到它。 MediaSession API 在通知栏、键盘控制、远程设备等控件上运行良好。但我无法使用 MediaMetadata 设置音频的元数据（标题、艺术家、专辑、艺术品）。关注tutorial 给定github repo。

出现以下错误： error 'MediaMetadata' is not defined no-undef

我正在使用chrome 57 来运行它。还测试了浏览器与以下代码的兼容性：

if ('mediaSession' in navigator) {
    console.log("Browser supports MediaMetadata API")
    navigator.mediaSession.metadata = new MediaMetadata({
      title: "my_track_name",
      artist: "track_artist_name",
      album: "track_album_name",
      artwork: "track_image",
    });

} else {
    console.log("Your browser doean't support MediaMetadata")
}

上面的代码打印Browser supports MediaMetadata API，但它不断抛出错误MediaMetadata is not defined。

我还尝试从包@mdn/browser-compat-data 导入它，如下所示：

const MediaMetadata = require("@mdn/browser-compat-data").api.MediaMetadata;

现在，它显示以下错误： Uncaught TypeError: MediaMetadata is not a constructor.

还尝试了this 解决方案，但没有成功，错误仍在继续。

谁能帮我解决这个问题？提前致谢。

【问题讨论】：

标签： javascript vue.js webapi howler.js mediasession

【解决方案1】：

通过使用 new window.MediaMetadata({}) 而不是 new MediaMetadata({}) 来修复它

【讨论】：