Skip to main content

renderStill()v2.3

@remotion/renderer 包的一部分.

🌐 Part of the @remotion/renderer package.

将单个帧渲染为图片，并将其写入指定的输出位置。

🌐 Renders a single frame to an image and writes it to the specified output location.

如果你想渲染视频，请改用 renderMedia()。

🌐 If you want to render a video, use renderMedia() instead.

示例用法​

🌐 Example usage

你首先需要打包项目并获取组合。
查看网站上的服务器端渲染代码片段以获取如何生成 serveUrl 和 composition 变量的示例。

🌐 You first need to bundle the project and fetch the compositions.
Read the code snippet on the site for server-side rendering for an example how to come up with the serveUrl and composition variables.

await renderStill({
  composition,
  serveUrl,
  output: '/tmp/still.png',
  inputProps: {
    custom: 'data',
  },
});

参数​

🌐 Arguments

接受具有以下属性的对象：

🌐 Takes an object with the following properties:

composition​

视频配置

🌐 VideoConfig

一个描述使用 id、width、height、fps 和 durationInFrames、defaultProps 以及 props 组成的对象。 调用 selectComposition() 或 getCompositions() 来获取可能配置的数组。

🌐 An object describing a composition using id, width, height, fps and durationInFrames, defaultProps and props. Call selectComposition() or getCompositions() to get an array of possible configs.

serveUrl​

string

可以是指向由 bundle() 生成的 Remotion Webpack 打包包的本地路径，或者是托管该打包包的 URL。

🌐 Either a local path pointing to a Remotion Webpack bundle generated by bundle() or a URL where the bundle is hosted.

output​

string

帧应该呈现到的绝对路径。

🌐 An absolute path to where the frame should be rendered to.

inputProps?​

object

传递给你的视频所选组合的输入属性。。 必须是一个 JSON 对象。 从根组件可以使用 getInputProps() 读取属性。 你可以使用 calculateMetadata() 转换输入属性。

port?​

number

偏好用于服务 Remotion 项目的特定端口。如果未指定，将使用随机端口。

🌐 Prefer a specific port that will be used to serve the Remotion project. If not specified, a random port will be used.

frame?​

应根据其编号渲染哪个帧。默认值：0。帧从零开始索引。

🌐 Which frame should be rendered based on its number. Default: 0. Frames are zero-indexed.

从 v3.2.27 起，允许负值，其中 -1 是最后一帧。

🌐 From v3.2.27, negative values are allowed, with -1 being the last frame.

imageFormat?​

字符串 StillImageFormat

🌐 string StillImageFormat

图片应该采用哪种输出格式，可以是 png、jpeg、webp 或 pdf。默认："png"。

🌐 Which output format the image should have, either png, jpeg, webp or pdf. Default: "png".

scale?​

Scales the output dimensions by a factor. For example, a 1280x720px frame will become a 1920x1080px frame with a scale factor of 1.5. See Scaling for more details.

jpegQuality?​

设置 JPEG 质量 - 必须是 0 到 100 之间的整数，并且只有在 imageFormat 设置为 jpeg 时才能传递。

🌐 Sets the JPEG quality - must be an integer between 0 and 100 and can only be passed if imageFormat is set to jpeg.

puppeteerInstance?​

一个已打开的 Browser 实例。使用 openBrowser() 来创建一个新实例。在多个函数调用中重复使用同一个浏览器可以加快渲染过程。你需要自己负责打开和关闭浏览器。如果你不指定此选项，将会在结束时打开并关闭一个新的浏览器。

🌐 An already open Browser instance. Use openBrowser() to create a new instance. Reusing a browser across multiple function calls can speed up the rendering process. You are responsible for opening and closing the browser yourself. If you don't specify this option, a new browser will be opened and closed at the end.

note

尽管名字如此，实际上不兼容 puppeteer，仅兼容 openBrowser()。

envVariables?​

一个包含环境变量的键值对的对象，这些环境变量将被注入到你的 Remotion 项目中，并且可以通过读取全局 process.env 对象来访问。默认值：{}。

🌐 An object containing key-value pairs of environment variables which will be injected into your Remotion project and which can be accessed by reading the global process.env object. Default: {}.

logLevel?v4.0.115​

One of trace, verbose, info, warn, error.
Determines how much info is being logged to the console.

Default info.

onArtifact?v4.0.176​

函数 OnArtifact

🌐 function OnArtifact

[处理由 <Artifact> 组件发出的工件](/docs/artifacts#using-rendermedia-renderstill-or-renderframes)。

overwrite?​

如果输出已经存在，是否应该覆盖该文件。默认值：true。

🌐 Whether the file should be overwritten if the output already exists. Default: true.

browserExecutable?v2.3.1​

一个字符串，定义应使用的浏览器可执行文件在磁盘上的绝对路径。默认情况下，如果没有可用的，Remotion 将尝试自动检测并下载一个。

🌐 A string defining the absolute path on disk of the browser executable that should be used. By default Remotion will try to detect it automatically and download one if none is available.

onBrowserLog?v3.3.93​

函数 BrowserLog

🌐 function BrowserLog

当你的项目调用 console.log 或从控制台调用的其他方法时会被调用。有关更多信息，请参阅 renderFrames 文档。

🌐 Gets called when your project calls console.log or another method from console. See the documentation for renderFrames for more information.

timeoutInMilliseconds?v2.6.3​

一个数字，描述渲染可能花多长时间来解决所有 delayRender() 调用 在超时之前。默认值：30000

🌐 A number describing how long the render may take to resolve all delayRender() calls before it times out. Default: 30000

cancelSignal?v3.0.15​

一个允许取消渲染的令牌。参见："makeCancelSignal()"

🌐 A token that allows the render to be cancelled. See: makeCancelSignal()

chromiumOptions?v2.6.5​

允许你设置某些 Chromium / Google Chrome 标志。见：Chromium 标志。

🌐 Allows you to set certain Chromium / Google Chrome flags. See: Chromium flags.

note

Chromium 标志需要在浏览器启动时设置。如果你使用 puppeteerInstance 传递一个实例，传递给 renderStill() 的选项将不起作用，而是会使用传递给 openBrowser() 的标志。

disableWebSecurity​

boolean - 默认 false

🌐 boolean - default false

这将尤其会禁用 CORS 以及其他安全功能。

🌐 This will most notably disable CORS among other security features.

enableMultiProcessOnLinux?v4.0.42​

Removes the --single-process flag that gets passed to Chromium on Linux by default. This will make the render faster because multiple processes can be used, but may cause issues with some Linux distributions or if window server libraries are missing.
Default: false until v4.0.136, then true from v4.0.137 on because newer Chrome versions don't allow rendering with the --single-process flag.
This flag will be removed in Remotion v5.0.

ignoreCertificateErrors?​

boolean - 默认 false

🌐 boolean - default false

导致无效的 SSL 证书（例如自签名证书）被忽略。

🌐 Results in invalid SSL certificates, such as self-signed ones, being ignored.

headless?​

Deprecated - will be removed in 5.0.0. With the migration to Chrome Headless Shell, this option is not functional anymore.

If disabled, the render will open an actual Chrome window where you can see the render happen. The default is headless mode.

gl​

Changelog
  • From Remotion v2.6.7 until v3.0.7, the default for Remotion Lambda was swiftshader, but from v3.0.8 the default is swangle (Swiftshader on Angle) since Chrome 101 added support for it.
  • From Remotion v2.4.3 until v2.6.6, the default was angle, however it turns out to have a small memory leak that could crash long Remotion renders.

Select the OpenGL renderer backend for Chromium.
Accepted values:

  • "angle"
  • "egl"
  • "swiftshader"
  • "swangle"
  • "vulkan" (from Remotion v4.0.41)
  • "angle-egl" (from Remotion v4.0.51)

The default is null, letting Chrome decide, except on Lambda where the default is "swangle"

userAgentv3.3.83​

允许你设置 headless Chrome 浏览器使用的自定义用户代理。

🌐 Lets you set a custom user agent that the headless Chrome browser assumes.

darkMode?v4.0.381​

Whether Chromium should pretend to be in dark mode by emulating the media feature 'prefers-color-scheme: dark'. Default is false.

mediaCacheSizeInBytes?v4.0.352​

Specify the maximum size of the cache that <Video> and <Audio> from @remotion/media may use combined, in bytes.
The default is half of the available system memory when the render starts.

offthreadVideoCacheSizeInBytes?v4.0.23​

From v4.0, Remotion has a cache for <OffthreadVideo> frames. The default is null, corresponding to half of the system memory available when the render starts.
This option allows to override the size of the cache. The higher it is, the faster the render will be, but the more memory will be used.
The used value will be printed when running in verbose mode.
Default: null

offthreadVideoThreads?v4.0.261​

The number of threads that<OffthreadVideo> can start to extract frames. The default is 2. Increase carefully, as too many threads may cause instability.

binariesDirectory?v4.0.120​

The directory where the platform-specific binaries and libraries that Remotion needs are located. Those include an ffmpeg and ffprobe binary, a Rust binary for various tasks, and various shared libraries. If the value is set to null, which is the default, then the path of a platform-specific package located at node_modules/@remotion/compositor-* is selected.
This option is useful in environments where Remotion is not officially supported to run like bundled serverless functions or Electron.

onBrowserDownload?v4.0.137​

Gets called when no compatible local browser is detected on the system and this API needs to download a browser. Return a callback to observe progress. See here for how to use this option.

chromeMode?v4.0.248​

One of headless-shell, chrome-for-testing. Default headless-shell. Use chrome-for-testing to take advantage of GPU drivers on Linux.

licenseKey?v4.0.409​

License key for sending a usage event using @remotion/licensing.

isProduction?v4.0.409​

默认 true

🌐 default true

Pass false if this a development render to not count it as a billable render on remotion.pro. Only can be used in conjuction with licenseKey.

apiKey?v4.0.375​

在 v4.0.409 中已弃用

🌐 deprecated in v4.0.409

API key for sending a usage event using @remotion/licensing.

dumpBrowserLogs?​

在 v4.0 中被弃用，取而代之的是 logLevel。

🌐 Deprecated in v4.0 in favor of logLevel.

quality?​

在 v4.0.0 中重命名为 jpegQuality。

🌐 Renamed to jpegQuality in v4.0.0.

返回值​

🌐 Return Value

返回值是一个 Promise，它解析为一个具有以下键的对象：

🌐 The return value is a promise that resolves to an object with the following keys:

  • buffer：v3.3.9 一个仅在未提供 output 选项时存在的 Buffer。否则为 null。
  • contentType：v4.0.426 渲染输出的内容类型，例如 "image/png"、"image/jpeg"。

兼容性​

🌐 Compatibility

BrowsersServersEnvironments
Chrome
Firefox
Safari
Node.js
Bun
Serverless Functions

另请参阅​

🌐 See also

Last updated on