You need to enable JavaScript to run this app.
文档中心
实时音视频

实时音视频

复制全文
下载 pdf
基础美颜(免费版)
Web 端基础美颜
复制全文
下载 pdf
Web 端基础美颜

RTC 提供基础美颜插件,你可以通过此插件实现美白、磨皮、锐化等基础美颜功能。

功能变更日志
  1. 自 Web SDK v4.47 起,本功能可用。
  2. Web SDK v4.52 对本功能做了如下修改:
    • 注册插件后,美颜不再默认开启,需要调用 enableBeauty 开启美颜。
    • 开启美颜的接口名由 enable 变更为 enableBeauty,关闭美颜的接口名由 disable 变更为 disableBeauty,原接口废弃。
    • 浏览器兼容性变动,由支持在桌面端 Chrome 94+、Edge 94+ 上使用变更为支持在桌面端 Chrome 70+、Edge 83+、Safari 12+、Firefox 80+ 上使用。
  3. Web SDK v4.60.2 对本功能做了如下修改:
    • 增加鉴权步骤,你需要在创建美颜插件实例时传入鉴权文件,请联系技术支持团队获取。

    • 浏览器兼容性变动,变更后的浏览器最低版本要求如下表。

      设备类型

      浏览器

      浏览器最低版本要求

      桌面端

      Chrome

      78

      Safari

      15

      Firefox

      80

      Edge

      83

      移动端

      Chrome

      78

      Safari

      15.4

      微信内嵌浏览器

      8.0.32

前提条件
  1. RTC SDK v4.47+ 你需要集成 RTC SDK,并实现音视频通话功能。
  2. 不建议在移动端使用本功能。这是由于本功能依赖一些 WASM 文件,对移动端设备的性能要求较高。
  3. 为了更好的使用体验,建议设备满足以下要求:
    1. 双核 Intel Core i5+
    2. RAM 8 GB+
    3. 64 位操作系统
  4. 如果你使用了云代理功能,你需要在防火墙白名单中添加基础美颜域名,参看在防火墙限制下进行通话。

操作步骤
  1. 在你的项目中引入美颜插件:

    • 可以直接引入。

      import RTCBeautyExtension from '@volcengine/rtc/extension-beauty';
      
    • 自 v4.51.1 版本起,可以通过 UMD 方式引入。

      const {EffectBeautyMode, RTCBeautyExtension} = window.VERTCExtensions;
      
  2. 注册美颜插件。

注意

注册插件后,无法动态修改视频流帧率。你可以在注册插件前调用 setVideoEncoderConfig 修改帧率。

import VERTC from '@volcengine/rtc';

// 创建引擎实例
const engine = VERTC.createEngine('appid');

// 创建美颜插件实例,4.60.2 及之后版本需传入鉴权文件
const beautyExtension = new RTCBeautyExtension({
    authFileUrl: 'xx.auth',
});

// 创建美颜插件实例,4.60.1 及之前版本无需传入鉴权文件
// const beautyExtension = new RTCBeautyExtension();

// 注册美颜插件
try {
  await engine.registerExtension(beautyExtension);
} catch (error) {
  // 注册失败,详细信息:error.message
}
  1. 开始视频采集,并设置渲染视图及模式。 示例代码以内部采集为例,如需使用外部采集,参看 setVideoSourceType。

注意

基础美颜仅对主流、本地流生效,不支持屏幕流、远端流。即 StreamIndex 必须为 STREAM_INDEX_MAIN。

// 开启内部视频采集
engine.startVideoCapture();
// 设置本地视频渲染时使用的视图,并设置渲染模式。
engine.setLocalVideoPlayer(StreamIndex.STREAM_INDEX_MAIN, {
  renderDom: 'yourDomId'
});
  1. 设置基础美颜参数,包括美白、磨皮、锐化。参看 setBeautyIntensity。
import { EffectBeautyMode } from '@volcengine/rtc/extension-beauty';

// 美颜参数设置-美白
beautyExtension.setBeautyIntensity(EffectBeautyMode.EFFECT_WHITE_MODE, 0.2);
// 美颜参数设置-磨皮
beautyExtension.setBeautyIntensity(EffectBeautyMode.EFFECT_SMOOTH_MODE, 0.2);
// 美颜参数设置-锐化
beautyExtension.setBeautyIntensity(EffectBeautyMode.EFFECT_SHARPEN_MODE, 0.2);
  1. 开启基础美颜。

说明

如调用本方法前未调用 setBeautyIntensity 设置参数,则基础美颜强度使用默认值。

// 开启美颜
beautyExtension.enableBeauty();
  1. 关闭基础美颜。

说明

若关闭基础美颜后再次调用 enableBeauty 开启基础美颜,则保留上次的美颜强度设置。若销毁引擎,则美颜强度恢复为默认值。

// 关闭美颜
beautyExtension.disableBeauty();

API 参考

IRTCBeautyExtension

类型: interface

  • API

方法

描述

checkCompatibility

测试当前浏览器兼容性情况。

enableBeauty

开启基础美颜。

disableBeauty

关闭基础美颜。

setBeautyIntensity

设置基础美颜强度。

checkCompatibility

测试当前浏览器兼容性情况。

  • 类型

    () => Promise<CompatibilityCheckResult>
    
  • 返回值
    类型: Promise<CompatibilityCheckResult>
    兼容性测试结果。

enableBeauty

开启基础美颜。

  • 类型

    () => void
    
  • 注意

    • 调用 setBeautyIntensity 设置基础美颜强度。若在调用本方法前没有设置美颜强度,则初始美白、磨皮、锐化强度均为 0.5。
    • 调用 disableBeauty 关闭基础美颜。
    • 本方法仅适用于视频源,不适用于屏幕源。

disableBeauty

关闭基础美颜。

  • 类型
    () => void
    

setBeautyIntensity

设置基础美颜强度。

  • 类型

    (beautyMode: EffectBeautyMode, intensity: number) => void
    
  • 注意

    • 若在调用 enableBeauty 前设置美颜强度,则对应美颜功能的强度初始值会根据设置更新。
    • 销毁引擎后,美颜功能强度恢复默认值。
  • 参数

    • beautyMode
      类型: EffectBeautyMode
      基础美颜模式。
    • intensity
      类型: number
      美颜强度,取值范围为 [0,1]。强度为 0 表示关闭,默认强度为 0.5。

CompatibilityCheckResult

类型: interface
兼容性测试结果。
isCompatible
类型: boolean
是否兼容。

true:符合兼容性最低要求,可正常运行。
false:不兼容,无法正常运行。
reasons
类型: number[]
不兼容的原因。

  • 0:其他未知原因。
  • 1:系统不支持 getUserMedia API。
  • 2:系统不支持 WebAssembly。
  • 3:系统获取不到 video input 设备。
  • 100:WebAR SDK 加载失败。

EffectBeautyMode

类型: enum
基础美颜模式。

  • 成员

    属性

    值

    描述

    EFFECT_WHITE_MODE

    0

    美白。

    EFFECT_SMOOTH_MODE

    1

    磨皮。

    EFFECT_SHARPEN_MODE

    2

    锐化。

最近更新时间:2026.08.04 14:34:43
这个页面对您有帮助吗?
有用
有用
无用
无用