Как настроить Global Media Controls в Google Chrome (вопрос и ответ)

Question

Как включить или отключить глобальные элементы управления мультимедиа в Google Chrome

см. "Глобальное управление СМИ"

1. Перейдите в chrome://flags/#global-media-controls
2. Установите "Включено"
3. Нажмите кнопку "Перезапустить"

Как настроить (фоновое изображение, действие при нажатии) глобальные элементы управления мультимедиа в Google Chrome

Пример:

if ('mediaSession' in navigator) {
    navigator.mediaSession.metadata = new MediaMetadata({
        title: "TITLE",
        artist: "ARTIST",
        album: "ALBUM",
        artwork: [{
            sizes: "320x180",// <- MUST BE EXACTLY!
            src: "https://i.ytimg.com/vi/yAruCvT7P7Y/hqdefault.jpg?sqp=-oaymwEZCNACELwBSFXyq4qpAwsIARUAAIhCGAFwAQ==&rs=AOn4CLAfHWw5BHrQugGsdPYy4eIXcqMTnQ",
            type: ""
        }]
    });

    navigator.mediaSession.setActionHandler('play', function () { });
    navigator.mediaSession.setActionHandler('pause', function () { });
    navigator.mediaSession.setActionHandler('seekbackward', function () { });
    navigator.mediaSession.setActionHandler('seekforward', function () { });
    navigator.mediaSession.setActionHandler('previoustrack', function () { });
    navigator.mediaSession.setActionHandler('nexttrack', function () { });
}

Answer 1

Насколько я могу судить, Chrome использует mediaSessionметаданные, только если он уже обнаруживает медиапоток с этой страницы. Например, вы можете перейти к видео на YouTube, ввести то, что вы написали, в консоли разработчика, и обновленная информация отобразится в Global Media Controls. То же самое в Stackru не приведет к появлению новой панели в глобальных элементах управления мультимедиа.

Теперь, когда это прояснено, сделать это в расширении Google Chrome просто: вы вставляете сценарий содержимого, который устанавливает объект сеанса метаданных.