Skip to main content

正在加载 <Img> ，源 http://localhost:3000/proxy

错误消息 A delayRender() "Loading <Img> with src=http://localhost:3000/proxy?src=[...]&time=[...]&transparent=[...]" was called but not cleared after 28000ms. See https://remotion.dev/docs/timeout for help:

A delayRender() "Loading <Img> with src=http://localhost:3000/proxy?src=http%3A%2F%2Flocalhost%3A3000%2Fpublic%2Fbackground.mp4&time=683.45&transparent=false" was called but not cleared after 28000ms. See https://remotion.dev/docs/timeout for help

当加载 <OffthreadVideo> 时发生，并且无法在 timeout 内提取帧。

🌐 occurs when loading an <OffthreadVideo> and the frame cannot be extracted within the timeout.

要能够提取一个帧，<OffthreadVideo> 需要:

🌐 To be able to extract a frame, <OffthreadVideo> needs to:

  • 完整下载文件
  • 打开文件并定位到正确的位置
  • 解码帧并将其转换为图片

尤其是对于需要一些时间才能下载的大文件，可能会发生此错误。

🌐 Especially for large files which take some time to download, this error may occur.

从 @remotion/media 使用 <Video>​

🌐 Use <Video> from @remotion/media

来自 @remotion/media 的新 <Video> 标签没有必须下载整个视频才能提取帧的限制。考虑使用它来替代 <OffthreadVideo>。

🌐 The new <Video> tag from @remotion/media doesn't have the constraint that the entire video needs to be downloaded in order to extract a frame. Consider using it instead of <OffthreadVideo>.

参见：视频标签比较

🌐 See: Comparison of video tags

增加超时时间​

🌐 Increase the timeout

考虑使用 delayRenderTimeoutInMilliseconds 属性来增加超时时间。

🌐 Consider increasing the timeout using the delayRenderTimeoutInMilliseconds prop.

使用详细日志进行调试​

🌐 Debug using verbose logging

你也可以启用详细日志记录 来查看 <OffthreadVideo> 正在进行的工作的进度。在通常情况下，你可以从时间安排中理解为什么会发生超时。

🌐 You can also enable verbose logging to see the progress of the work that <OffthreadVideo> is doing. In the usual case, you can understand from the timings why the timeout occurred.

将视频分块​

🌐 Chunk the video

目前，<OffthreadVideo> 需要下载整个视频才能提取一帧（我们未来将努力消除这种需求）。

🌐 Currently, <OffthreadVideo> needs to download the entire video in order to extract a frame (we work on eliminating this need in the future).

如果你正在加载一个大型视频，考虑将其拆分成较小的部分，并且每次只加载视频的一部分。

🌐 If you are loading a large video, consider chunking it into smaller parts and only load part of the video at a time.

例如，创建一个包含 <OffthreadVideo> 组件的 <Series>，每个组件都有不同的 src 属性。

🌐 For example, create a <Series> of <OffthreadVideo> components, each with a different src prop.

import {Series, useVideoConfig, OffthreadVideo, staticFile} from 'remotion';

const parts = ['part1.mp4', 'part2.mp4', 'part3.mp4'];

const SeriesTesting: React.FC = () => {
  const {fps} = useVideoConfig();

  return (
    <Series>
      {parts.map((part) => {
        return (
          <Series.Sequence durationInFrames={30 * 60}>
            <OffthreadVideo src={staticFile(part)} />
          </Series.Sequence>
        );
      })}
    </Series>
  );
};

使用更快的CDN​

🌐 Use a faster CDN

确保使用一个具有足够出口带宽容量来托管你视频的地方。将视频放到地理位置靠近你的渲染的服务器上。

🌐 Ensure using a place to host your video that has enough egress bandwidth capacity.
Place the video onto a server that is close to your render geographically.

如果你认为此错误是由 Remotion 的漏洞引起的，请提交问题。

🌐 If you believe this error was triggered by a bug in Remotion, please open an issue.

Last updated on