Skip to main content

canRenderMediaOnWeb()

warning

非常实验性的功能——随时可能出现漏洞和重大更改。 在 GitHub 上跟踪进度 并在 Discord 的 #web-renderer 通道中讨论。

属于 @remotion/web-renderer 包的一部分.

🌐 Part of the @remotion/web-renderer package.

在实际尝试之前检查是否可以使用给定的配置进行渲染。 这对于向用户提供有关浏览器兼容性和配置问题的反馈非常有用。

🌐 Checks if a render can be performed with the given configuration before actually attempting it. This is useful for providing feedback to users about browser compatibility and configuration issues.

Example usage
import {canRenderMediaOnWeb} from '@remotion/web-renderer';

const result = await canRenderMediaOnWeb({
  container: 'mp4',
  videoCodec: 'h264',
  width: 1920,
  height: 1080,
});

if (!result.canRender) {
  for (const issue of result.issues) {
    console.error(issue.message);
  }
} else {
  console.log('Ready to render!');
  console.log('Video codec:', result.resolvedVideoCodec);
  console.log('Audio codec:', result.resolvedAudioCodec);
}

参数​

🌐 Arguments

一个具有以下属性的对象：

🌐 An object with the following properties:

width​

数字 - 必填

🌐 number - required

视频的像素宽度。

🌐 The width of the video in pixels.

height​

数字 - 必填

🌐 number - required

视频的像素高度。

🌐 The height of the video in pixels.

container?​

字符串 WebRendererContainer

🌐 string WebRendererContainer

容器格式。默认是 "mp4"。

🌐 The container format. Default is "mp4".

videoCodec?​

字符串 WebRendererVideoCodec

🌐 string WebRendererVideoCodec

要使用的视频编解码器。默认值取决于容器：

🌐 The video codec to use. Default depends on the container:

  • 对于 mp4 容器："h264"
  • 对于 webm 容器："vp8"

audioCodec?​

字符串 | 空 WebRendererAudioCodec

🌐 string | null WebRendererAudioCodec

要使用的音频编解码器。默认取决于容器：

🌐 The audio codec to use. Default depends on the container:

  • 对于 mp4 容器："aac"
  • 对于 webm 容器："opus"

transparent?​

boolean

视频是否应具有 alpha 通道。默认值为 false。

🌐 Whether the video should have an alpha channel. Default is false.

只有 vp8 和 vp9 编解码器支持透明度。

🌐 Only vp8 and vp9 codecs support transparency.

muted?​

boolean

如果为 true，音频编解码器检查将被跳过。默认值为 false。

🌐 If true, audio codec checks are skipped. Default is false.

videoBitrate?​

数字 | 字符串 WebRendererQuality

🌐 number | string WebRendererQuality

视频比特率。可以是一个数字（每秒比特数）或者一个质量预设："very-low"、"low"、"medium"、"high"、"very-high"。

🌐 The video bitrate. Can be a number (bits per second) or a quality preset: "very-low", "low", "medium", "high", "very-high".

默认是 "medium"。

🌐 Default is "medium".

audioBitrate?​

数字 | 字符串 WebRendererQuality

🌐 number | string WebRendererQuality

音频比特率。可以是一个数字（每秒比特数）或质量预设："very-low"、"low"、"medium"、"high"、"very-high"。

🌐 The audio bitrate. Can be a number (bits per second) or a quality preset: "very-low", "low", "medium", "high", "very-high".

默认是 "medium"。

🌐 Default is "medium".

outputTarget?​

字符串 | 空 WebRendererOutputTarget

🌐 string | null WebRendererOutputTarget

用于渲染的输出目标。可以是：

🌐 The output target to use for rendering. Can be:

  • "web-fs"：使用文件系统访问 API 将数据流写入磁盘
  • "arraybuffer"：将整个视频缓存在内存中
  • null：根据浏览器支持自动检测（默认）

如果请求 "web-fs" 但浏览器不支持，则会返回 output-target-unsupported 错误。

🌐 If "web-fs" is requested but not supported by the browser, an output-target-unsupported error will be returned.

返回值​

🌐 Return value

返回一个 Promise，其解析为具有以下属性的对象：

🌐 Returns a Promise that resolves to an object with the following properties:

canRender​

boolean

true 如果渲染可以继续，false 如果存在阻塞问题。

issues​

CanRenderIssue[]

在检查过程中发现的一系列问题。每个问题都有：

🌐 An array of issues found during the check. Each issue has:

  • type：问题类型（见下方 问题类型）
  • message：对该问题的可人类阅读的描述
  • severity：要么是 "error"（阻塞），要么是 "warning"（非阻塞，例如使用了回退）

resolvedVideoCodec​

字符串 WebRendererVideoCodec

🌐 string WebRendererVideoCodec

将用于渲染的视频编解码器。

🌐 The video codec that will be used for rendering.

resolvedAudioCodec​

字符串 | 空 WebRendererAudioCodec

🌐 string | null WebRendererAudioCodec

将用于渲染的音频编码器。如果应用了备用方案，可能与请求的编码器不同。如果 muted 是 true，则为 null。

🌐 The audio codec that will be used for rendering. This may differ from the requested codec if a fallback was applied. null if muted is true.

resolvedOutputTarget​

WebRendererOutputTarget

将使用的输出目标。详情请参见 renderMediaOnWeb() outputTarget。

🌐 The output target that will be used. See renderMediaOnWeb() outputTarget for details.

问题类型​

🌐 Issue types

可能返回以下问题类型：

🌐 The following issue types may be returned:

类型描述
webcodecs-unavailable此浏览器不支持 WebCodecs API
container-codec-mismatch所选容器不支持该视频编码器
invalid-dimensionsH.264 和 H.265 需要宽度和高度为 2 的倍数
video-codec-unsupported浏览器无法编码所选视频编码器
audio-codec-unsupported浏览器无法编码所选音频编码器
transparent-video-unsupported透明度需要 VP8 或 VP9 编码器
webgl-unsupported3D CSS 转换需要 WebGL
output-target-unsupported此浏览器不支持请求的输出目标

另请参阅​

🌐 See also

Last updated on