如何设置在 Chrome 和 Windows 中显示的 HTML 视频标题？答案

【问题标题】：How to set the HTML video title that is shown in Chrome and Windows?如何设置在 Chrome 和 Windows 中显示的 HTML 视频标题？
【发布时间】：2020-04-22 23:08:00
【问题描述】：

如何设置浏览器（如 Chrome）和 Windows 操作系统显示的 HTML5 <video> 元素的名称（标签）？

就像 Windows 为这个 youtube 视频显示的标题（更改扬声器音量时）：

目前对我来说显示页面标题（在页面head中设置的标题）。
我尝试将title="..." 属性添加到video 元素，但没有效果。在 StackOverflow 上也没有找到解决方案。

【问题讨论】：

标签： javascript html windows html5-video mediasession

【解决方案1】：

我不确定视频。但在某些浏览器中，mediaSession 对我有用。 Javascript...

    if ('mediaSession' in navigator) {
      navigator.mediaSession.metadata = new MediaMetadata({
      title: 'name',
      artist: '',
      album: '',
      artwork: [{ src: '...' }]
      });
  }

【讨论】：

【解决方案2】：

正如另一个答案所述，可以使用 JavaScript 和 Media Session API 来完成。
查看this YouTube video。

if ("mediaSession" in navigator) {
  navigator.mediaSession.metadata = new MediaMetadata({
    title: "Unforgettable",
    artist: "Nat King Cole",
    album: "The Ultimate Collection (Remastered)",
    artwork: [
      { src: "https://dummyimage.com/128x128", sizes: "128x128", type: "image/png" },
      { src: "https://dummyimage.com/512x512", sizes: "512x512", type: "image/png" }
    ]
  });
}

【讨论】：