Remotion LabRemotion Lab
›音訊›音訊播放速度

音訊播放速度

使用 playbackRate prop 控制音訊的播放速度，加速或減慢音訊播放。

控制音訊播放速度

自 v2.2 起，你可以使用 playbackRate prop 控制音訊的播放速度。

速度值說明

playbackRate 值效果
1（預設）正常速度
0.5減慢為兩倍長度（半速）
2加速為兩倍快（兩倍速）
0.25四分之一速（非常慢）
4四倍速（非常快）

Google Chrome 支援 0.0625 到 16 之間的播放速率。

基本用法

import { AbsoluteFill, Html5Audio, staticFile } from 'remotion';
 
export const MyComposition = () => {
  return (
    <AbsoluteFill>
      <Html5Audio src={staticFile('audio.mp3')} playbackRate={2} />
    </AbsoluteFill>
  );
};

加速旁白

適用於需要快速瀏覽的場景，例如教學影片的快轉版本：

import { AbsoluteFill, Html5Audio, staticFile } from 'remotion';
 
export const SpeedTutorial = () => {
  return (
    <AbsoluteFill>
      {/* 以 1.5 倍速播放旁白 */}
      <Html5Audio
        src={staticFile('narration.mp3')}
        playbackRate={1.5}
      />
    </AbsoluteFill>
  );
};

慢動作音效

與慢動作影片搭配使用，讓音效也跟著放慢：

import { AbsoluteFill, Html5Audio, Html5Video, staticFile } from 'remotion';
 
export const SlowMotion = () => {
  const slowRate = 0.5;
 
  return (
    <AbsoluteFill>
      <Html5Video src={staticFile('video.mp4')} playbackRate={slowRate} />
      <Html5Audio src={staticFile('audio.mp3')} playbackRate={slowRate} />
    </AbsoluteFill>
  );
};

速度範圍限制

雖然 Remotion 本身不限制播放速度的範圍，但開發模式下使用的是 HTMLMediaElement.playbackRate API，在極端值時會拋出錯誤。目前 Google Chrome 在播放速率低於 0.0625 或高於 16 時會拋出例外。

import { AbsoluteFill, Html5Audio, staticFile } from 'remotion';
 
export const MyComposition = () => {
  // 安全範圍：0.0625 ~ 16（Chrome 限制）
  const rate = 0.5;
 
  return (
    <AbsoluteFill>
      <Html5Audio
        src={staticFile('audio.mp3')}
        playbackRate={rate}
      />
    </AbsoluteFill>
  );
};

不支援反向播放

注意：playbackRate 不支援負值（反向播放）。若需要反向播放效果，需要在音訊後製處理時預先製作反向版本。

與 Web Audio API 的相容性

Safari 注意事項：在 Safari 上，若同時啟用了 useWebAudioApi prop，playbackRate 將被忽略，音量設定也不會生效。這是 Safari 的已知限制。

// 在 Safari 上，以下組合中 playbackRate 會被忽略
<Html5Audio
  src="https://remotion.media/audio.wav"
  useWebAudioApi
  crossOrigin="anonymous"
  playbackRate={2}  // Safari 上此值無效
  volume={0.5}      // Safari 上此值也會被忽略
/>

動態調整播放速度

playbackRate 目前不支援回呼函數，只能傳入靜態數值。若需要隨時間變化的速度，可考慮使用多個不同速度預先渲染的音訊片段，並搭配 <Sequence> 切換。

另請參閱