JavaScript 检测 play/pause 键盘（虚拟）键

Question

我不小心按下了键盘上的 play/pause (▶/❚❚) 按钮（Num Lock ，同时在未聚焦的选项卡中播放 YouTube 视频。令我大吃一惊的是，YouTube 视频立即暂停。

现在，我试着查看它是如何工作的，但我无法在 Internet 上找到任何解释如何为这样的键检测按键的内容。我在我的控制台中尝试了运行 onkeydown = function(e) {console.log(e)}，但是按下 play/pause 按钮没有触发任何事件。此外，https://keycode.info/ did not give me any help with this either. I did find http://www.kbdedit.com/manual/low_level_vk_list.html 列出了很多 'virtual key codes'，其中确实包括 VK_MEDIA_PLAY_PAUSE，这可能是我按下的键，但我没有找到任何方法来触发 JS 中的事件有了这个。

现在我想说明的是，此功能似乎在 Firefox 中不起作用，仅在 Chrome 中起作用（据我测试）。它可能仍处于实验阶段，但我真的很想知道 YouTube 使用什么系统来捕获此事件，即使当前未打开选项卡（Chrome 目前甚至没有关注）

PS：我在 Ubuntu 18.04 经历过这个；例如，我不确定这是否适用于 Windows。

Answer 1

Chrome 负责（硬件媒体密钥处理），有关更多详细信息，请查看 chrome://flags/#hardware-media-key-handling

这里还有包含文档和演示的 link：https://www.chromestatus.com/feature/5639924124483584

Answer 2

来自Google Chrome Media Session Samples：

/* Media navigation Action handlers */

    navigator.mediaSession.setActionHandler('previoustrack', function() {
      console.log('> User clicked "Next Track" icon.');
    });

    navigator.mediaSession.setActionHandler('nexttrack', function() {
      console.log('> User clicked "Next Track" icon.');
    });

    navigator.mediaSession.setActionHandler('play', function() {
      log('> User clicked "Play" icon.');
      // Do something more than just playing audio...
    });

这些 chrome API 在 chrome 57+ 和 Firefox 82+

上可用

JavaScript 检测 play/pause 键盘（虚拟）键

JavaScript detecting play/pause keyboard (virtual) key

javascript

google-chrome

media-player

dom-events