上周Chrome浏览器发布了媒体中心。这是浏览器顶部栏右侧的一个小按钮,可访问所有播放的视频和音频。
https://blog.google/products/chrome/manage-audio-and-video-in-chrome/
使用<video>
元素使您的播放器出现在此媒体中心中,就可以使用。
但是对于youtube视频(请参阅上文),媒体中心似乎能够找到封面图像,颜色和标题/副标题。但是,我找不到有关如何通过标准视频元素获得此方面的任何文档。有什么主意吗?
[我们都在同一条船上,在没有运气的情况下尝试挖掘铬的来源后,我向铬开发人员发送了一封电子邮件,以解决此问题,并获得了有关MediaSession的有用链接。
因此遵循文档,您可以通过在metadata
中设置mediaSession
属性来自定义它,以显示标题,说明和插图(又称背景图片)(背景颜色除外),这是因为背景颜色由像素的像素决定图片自动显示。
if ('mediaSession' in navigator) {
navigator.mediaSession.metadata = new MediaMetadata({
title: 'Never Gonna Give You Up',
artist: 'Rick Astley',
album: 'Whenever You Need Somebody',
artwork: [
{ src: 'https://dummyimage.com/96x96', sizes: '96x96', type: 'image/png' },
{ src: 'https://dummyimage.com/128x128', sizes: '128x128', type: 'image/png' },
{ src: 'https://dummyimage.com/192x192', sizes: '192x192', type: 'image/png' },
{ src: 'https://dummyimage.com/256x256', sizes: '256x256', type: 'image/png' },
{ src: 'https://dummyimage.com/384x384', sizes: '384x384', type: 'image/png' },
{ src: 'https://dummyimage.com/512x512', sizes: '512x512', type: 'image/png' },
]
});
}
我已经在JSFiddle上创建了demo。结果显示如下。