Skip to main content

媒体键行为v4.0.221

🌐 Media Keys Behaviorv4.0.221

本文件关于用户在以下情况下的行为：

🌐 This document is about the behavior when a user:

  • 按下键盘上的播放/暂停（⏯️）或上一曲（⏪）按钮
  • 使用其他控件，例如在用户头像旁边的 Chrome 内置控件来控制播放

这些行为由 browserMediaControlsBehavior 属性控制。 底层使用的 Web API 是 Media Session API。

🌐 These behaviors are controlled by the browserMediaControlsBehavior prop.
The underlying Web API used is the Media Session API.

模式​

🌐 Modes

prevent-media-session（默认）​

🌐 prevent-media-session (default)


import {Player} from '@remotion/player';

export const MyComp: React.FC = () => {
  return (
    <Player
      browserMediaControlsBehavior={{
        mode: 'prevent-media-session',
      }}
      {...otherProps}
    />
  );
};

在此模式下，Remotion 不会响应用户的媒体键，而是将任何键盘操作映射为无操作。
这可以防止播放器被暂停，但按下键盘上的播放/暂停按钮时音频标签被恢复的问题，这是 Remotion v4.0.221 之前存在的一个问题。

🌐 In this mode, Remotion will not act on the user's media keys, but map any keybord action to a no-op.
This prevents that the Player is paused but the audio tags get resumed by pressing the Play/Pause button on the keyboard, which was a problem prior to Remotion v4.0.221.

register-media-session​


import {Player} from '@remotion/player';

export const MyComp: React.FC = () => {
  return (
    <Player
      browserMediaControlsBehavior={{
        mode: 'register-media-session',
      }}
      {...otherProps}
    />
  );
};

在此模式下，Remotion 将使用 Media Session API 来注册处理程序：

🌐 In this mode, Remotion will use the Media Session API to register handlers:

  • 当用户按下键盘上的播放/暂停按钮时
    • 切换 Remotion 播放器的状态
  • 当用户按下键盘上的上一曲按钮时
    • 寻到视频的开头
  • 当用户按下键盘上的快进按钮时
    • 向前快进10秒
  • 当用户按下键盘上的倒带按钮时
    • 回退10秒

此外，Remotion 会对寻址事件做出反应，并通知设备当前的播放位置和时长。

🌐 Also, Remotion will react to seeking events and inform the device about the current playback position and duration.

do-nothing​


import {Player} from '@remotion/player';

export const MyComp: React.FC = () => {
  return (
    <Player
      browserMediaControlsBehavior={{
        mode: 'do-nothing',
      }}
      {...otherProps}
    />
  );
};

恢复到 Remotion v4.0.221 之前的行为。 Remotion 不会响应任何媒体键，让浏览器处理媒体键。 这会导致用户可以通过键盘上的播放/暂停按钮恢复任何媒体标签，而 Remotion 播放器不会同时恢复。

🌐 Reverts to the behavior prior to Remotion v4.0.221.
Remotion will not react to any media keys, leaving the browser to handle the media keys.
This leads to the problem that the user can resume any media tag by pressing the Play/Pause button on the keyboard, without the Remotion Player also resuming.

使用多个 <Player> 时​

🌐 When using multiple <Player>'s

Remotion 的 register-media-session 处理程序应该只在安装了 1 个播放器时工作。
未定义哪个播放器会对媒体键作出反应。

🌐 Remotion's register-media-session handler is supposed to only work with 1 Player mounted.
It is not defined which Player reacts to the media keys.

在使用多个播放器时，将一个设置为 do-nothing 模式，另一个设置为 register-media-session 模式，以便仅为一个播放器明确设置多媒体键。

🌐 When working with multiple Players, set one to do-nothing mode and the other to register-media-session mode to explicitly set the Media Keys for only 1 Player.

如果你希望所有播放器都能对多媒体键做出反应，你需要使用 do-nothing 模式，并通过播放器 API 自行实现此行为。

🌐 If you want all Players to react to the media keys, you need to use do-nothing mode and implement this behavior yourself with the Player API.

在 Remotion 工作室​

🌐 In the Remotion Studio

从 v4.0.221 开始，该行为被设置为 register-media-session，之前它的行为像 do-nothing。

🌐 The behavior is set to register-media-session as of v4.0.221 and previously it behaved like do-nothing.

Last updated on