Skip to main content

导出字幕

🌐 Exporting subtitles

本指南介绍了从你的 Remotion 视频导出字幕的不同方法。

🌐 This guide covers different ways to export subtitles from your Remotion video.

烧录字幕​

🌐 Burned-in subtitles

如果你希望字幕成为视频本身的一部分（烧录在视频中），请按照显示字幕中的说明渲染字幕，然后像平常一样渲染视频即可。

🌐 If you want the subtitles to be part of the video itself (burned in), follow the instructions in Displaying captions to render the captions, then simply render the video as usual.

npx remotion render

导出为单独的 .srt 文件​

🌐 Exporting as a separate .srt file

要将字幕导出为单独的 .srt 文件，请将 <Artifact> 组件与 serializeSrt() 一起使用。

🌐 To export subtitles as a separate .srt file, use the <Artifact> component together with serializeSrt().

Exporting captions as .srt

export const MyComp: React.FC = () => {
  const frame = useCurrentFrame();

  // Convert captions to SRT format
  // Each caption becomes its own line
  const srtContent = serializeSrt({
    lines: captions.map((caption) => [caption]),
  });

  return (
    <>
      {/* Only emit the artifact on the first frame */}
      {frame === 0 ? <Artifact filename="subtitles.srt" content={srtContent} /> : null}
      {/* Rest of your video content */}
    </>
  );
};

在渲染时，工件将被保存到 out/[composition-id]/subtitles.srt。

🌐 The artifact will be saved to out/[composition-id]/subtitles.srt when rendering.

将单词分组为行​

🌐 Grouping words into lines

如果你的字幕是逐字的，你可能想将多个单词组合到一个字幕行中。你可以使用 createTikTokStyleCaptions() 创建页面，然后将它们转换回 serializeSrt() 期待的格式：

🌐 If your captions are word-by-word, you may want to group multiple words into a single subtitle line. You can use createTikTokStyleCaptions() to create pages, then convert them back to the format expected by serializeSrt():

Grouping captions into lines

const {pages} = createTikTokStyleCaptions({
  captions,
  combineTokensWithinMilliseconds: 3000,
});

const srtContent = serializeSrt({
  lines: pages.map((page) => {
    // Convert page tokens back to Caption format
    return page.tokens.map((token) => ({
      text: token.text,
      startMs: token.fromMs,
      endMs: token.toMs,
      timestampMs: (token.fromMs + token.toMs) / 2,
      confidence: null,
    }));
  }),
});

另请参阅​

🌐 See also

Last updated on