RTC Engine
  • 개요
  • Web
    • Demo 실행
    • SDK 빠른 실행
    • 기본 기능
      • 화면 공유
      • 라이브 방송
      • 미디어 장치
      • 볼륨
      • 인코딩 구성 파일 설정
      • 네트워크 품질 검사
      • 검출 능력
    • 고급 기능
      • AI 노이즈 캔슬링 활성화
      • 오디오 믹싱 활성화
      • 워터마크 활성화
      • Enable Virtual Background
      • 뷰티 및 특수효과 활성화
      • 데이터 메시지
      • 사용자 정의 수집 및 렌더링
    • 인터페이스 목록
    • 배포 설명
    • 플랫폼 지원
    • Web 관련 자주 받는 질문
      • 다중 사용자 비디오 통화 최적화
      • 자동 재생 제한 처리
      • 방화벽 제한 대응
      • 기타
  • Android
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCStatistics
      • TRTCCloudListener
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • 에러코드
    • 솔루션
      • 실시간 합창 (TUIKaraoke)
        • 빠른 통합
        • 실시 절차
        • 노래 동기화
        • 가사 동기화
        • 음성 동기화
        • 혼합 스트림 솔루션
        • TRTCKaraoke 관련 인터페이스
        • 자주 받는 질문들
    • 배포 설명
  • iOS
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • ErrorCode
    • 솔루션
      • 빠른 통합
      • 실시 절차
      • 노래 동기화
      • 가사 동기화
      • 음성 동기화
      • 혼합 스트림 솔루션
      • TRTCKaraoke 관련 인터페이스
      • 자주 받는 질문들
    • 배포 설명
  • macOS
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • Advanced Features
      • 하드웨어 장치 테스트
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • TRTCCloud
      • TRTCCloudDelegate
      • TRTCStatistics
      • TXAudioEffectManager
      • TXBeautyManager
      • TXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • ErrorCode
      • 배포 설명
    • 배포 설명
  • Windows
    • Run Sample Code
    • Integration
    • 통합
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 비디오 품질 설정
      • 10. 비디오 회전
    • Advanced Features
      • 하드웨어 장치 테스트
      • 네트워크 품질 테스트
      • 사용자 정의 수집 및 렌더링
      • 사용자 정의 오디오 수집 및 재생
    • 고객 인터페이스
      • 개요
      • ITRTCCloud
      • ITRTCStatistics
      • TRTCCloudCallback
      • ITXAudioEffectManager
      • ITXDeviceManager
      • 유형 정의
      • 인터페이스 폐기
      • 에러코드
    • 배포 설명
  • Electron
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
      • 3. 룸 들어가기
      • 4. 오디오/비디오 스트림 구독
      • 5. 오디오/비디오 스트림 배포
      • 6. 룸 퇴출
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • 고객 인터페이스
      • 개요
      • 에러코드
  • Flutter
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
      • 3. 룸 들어가기
      • 4. 오디오/비디오 스트림 구독
      • 5. 오디오/비디오 스트림 배포
      • 6. 룸 퇴출
      • 7. 네트워크 품질 검사
      • 8. 화면 공유 활성화
      • 9. 컴퓨터 소리 공유
      • 10. 비디오 품질 설정
      • 11. 비디오 회전
    • 고객 인터페이스
      • 개요
      • 에러코드
  • Unity
    • 통합
      • 1. 인터페이스 예시
      • 2. SDK 가져오기
    • 고객 인터페이스
      • 개요
      • 에러코드
  • QT
    • 통합
      • 1. SDK 가져오기
  • 개요
    • 개요
  • 개념
  • Features
  • 성능 통계
  • 가격
    • 무료시간
    • RTC-Engine 패키지
    • 구독 패키지 기간 과금 설명
    • 종량제
      • 오디오 및 비디오 시간 과금 설명
      • 클라우드 녹화 과금 설명
      • 믹스 트랜스코딩 및 CDN 중계 과금 설명
  • 자주 받는 질문들
    • 자주 받는 질문들
    • 마이그레이션 가이드
      • Twilio Video에서 TRTC로의 마이그레이션
      • 과금
      • Features
      • UserSig
      • 방화벽 제한
      • 설치 패키지 축소 방법
      • TRTCCalling Web 관련
      • 오디오/비디오 품질
      • 기타
RTC Engine
이 페이지는 현재 영어로만 제공되며 한국어 버전은 곧 제공될 예정입니다. 기다려 주셔서 감사드립니다.

뷰티 및 특수효과 활성화

Function Description

This document primarily describes how to use the beauty plugin.

Prerequisites

To use the Virtual Background Feature with SDKAppID, please make sure you have subscribed to the RTC-Engine Professional Edition Monthly Package. For related instructions on the Monthly Package, please refer to the Billing overview in the RTC-Engine documentation.
TRTC Web SDK version must be ≥ 5.5.0.
The requirements for different systems and configurations on the Web platform are as shown in the table below:
Platform
Operating System
Browser Version
FPS
Recommended Configuration
Remarks
Web
Windows
Chrome 90+
Firefox 90+
Edge 97+
30
Memory: 16GB
CPU: i5-10500
GPU: Dedicated 2GB
It is recommended to use the latest version of Chrome browser (Enable hardware acceleration in the browser)
15
Memory: 8GB
CPU: i3-8300
GPU: Integrated Intel 1GB
Mac
Chrome 98+
Firefox 96+
Safari 14+
30
2019 MacBookMemory: 16GB (2667MHz)
CPU: i7 (6-core 2.60GHz)
GPU: AMD Radeon 5300M
Android
Chrome
Firefox
30
High-end devices (e.g., Qualcomm Snapdragon 8 Gen1)
It is recommended to use Chrome, or Firefox browsers and other mainstream browsers
20
Mid-range devices (e.g., MediaTek Dimensity 8000-MAX)
10
Low-end devices (e.g., Qualcomm Snapdragon 660)
iOS
Chrome
Safari
Firefox
30
iPhone 13
Requires iOS 14.4 or above- It is recommended to use Chrome or Safari browsers
20
iPhone XR

Implementation Steps

Step 1: Register the Plugin

Before using it, you need to register the plugin. Below is an example code for registering the plugin:
import TRTC from 'trtc-sdk-v5';
import { Beauty } from 'trtc-sdk-v5/plugins/video-effect/beauty';

const trtc = TRTC.create({ plugins: [Beauty] });

Step 2: Start the Local Camera

await trtc.startLocalVideo({
view: 'local-video' // Fill in the div id
});

Step 3: Using Beauty and built-in Effects

Beauty Effect

The beauty effect can be controlled using three interfaces for starting, updating, and stopping:
trtc.startPlugin('Beauty', options) to enable the beauty effect.
trtc.updatePlugin('Beauty', options) to update the beauty effect parameters.
trtc.stopPlugin('Beauty') to stop the beauty effect.
The options parameter supports six beauty effect parameters:
type BeautifyOptions = {
whiten?: number; // Whitening 0-1
dermabrasion?: number; // Dermabrasion 0-1
lift?: number; // Face Slimming 0-1
shave?: number; // Jaw Shaving 0-1
eye?: number; // Enlarged Eyes 0-1
chin?: number; // Chin Adjustment 0-1
}

Built-in Effects

The plugin offers build-in video effects, here is the list:
EffectId
Name
EDE5D18065451445
Milk-Bottle-Face-Mask
7A62218064EF7959
Felt-Hairband
B4D63180653948C3
Bangs-Headband
D7C6418064B90F4C
Cute-Kitty
1D6EB18069D76A62
Polka-Dot-Girl
CBE7618065D9D76F
Heart-Fireworks
9B86618065596018
Cute-Piggy
428C518065369ACF
Double-Braids
B30E218064F7B397
Vibrant-Stickers
AE3C81806521B49B
Rabbit-Sauce
We use EffectId to identify the effect which will be apply.
type EffectListOptions = {
id: string;
intensity?: number; // specify the strength of the effect
}

Example Code

When starting the plugin, the options should also include the current user's login information (sdkAppId, userId, userSig) for verification.
Here are some code examples:
// Enable the plugin
const options = {
sdkAppId: 0,
userId: '',
userSig: '',

// BeautifyOptions
whiten: 0.5, // Whitening 0-1
dermabrasion: 0.5, // Dermabrasion 0-1
lift: 0.5, // Face Slimming 0-1
shave: 0.5, // Jaw Shaving 0-1
eye: 0.5, // Enlarged Eyes 0-1
chin: 0.5, // Chin Adjustment 0-1

// EffectListOptions Array
effect: [{
id: '7A62218064EF7959', // the effect id
intensity: 0.7 // specify the strength of the effect
}]
}
try {
await trtc.startPlugin('Beauty', options);
} catch (error) {
console.error('Beauty start failed', error);
}
// Update beauty parameters
const options = {
whiten: 0.5, // Whitening 0-1
dermabrasion: 0.5, // Dermabrasion 0-1
lift: 0.5, // Face Slimming 0-1
shave: 0.5, // Jaw Shaving 0-1
eye: 0.5, // Enlarged Eyes 0-1
chin: 0.5, // Chin Adjustment 0-1

effect: [{
id: '7A62218064EF7959', // the effect id
intensity: 0.7, // specify the strength of the effect
},{
id: 'D7C6418064B90F4C', // the effect id
intensity: 0.7, // specify the strength of the effect
}]
}
try {
await trtc.updatePlugin('Beauty', options);
} catch (error) {
console.error('Beauty update failed', error);
}
// Stop the beauty effect
try {
await trtc.stopPlugin('Beauty');
} catch (error) {
console.error('Beauty stop failed', error);
}

API Documentation

trtc.startPlugin('Beauty', options)

Enable the beauty effect.

options

Name
Type
Attributes
Description
sdkAppId
number
Required
Current application ID
userId
string
Required
Current user ID
userSig
string
Required
UserSig corresponding to the user ID
whiten
number
Optional
Whitening, range [0,1]
dermabrasion
number
Optional
Dermabrasion, range [0,1]
lift
number
Optional
Face slimming, range [0,1]
shave
number
Optional
Jaw shaving, range [0,1]
eye
number
Optional
Enlarged eyes, range [0,1]
chin
number
Optional
Chin adjustment, range [0,1]
effect
Array<EffectListOptions>
Optional
effect list
onError
(error) => {}
Optional
Callback for errors that occur during runtime
error.code=10000003 indicates high rendering latency
error.code=10000006 indicates insufficient browser feature support, which may lead to lagging.
Recommended solutions can be found in the Common Issues section at the end of the document.
EffectListOptions:
Name
Type
Attributes
Description
id
number
Required
The effect id
intensity
string
Required
the strength of the effect

trtc.updatePlugin('Beauty', options)

Allows modification of beauty parameters.

options

Name
Type
Attributes
Description
whiten
number
Optional
Whitening, range [0,1]
dermabrasion
number
Optional
Dermabrasion, range [0,1]
lift
number
Optional
Face slimming, range [0,1]
shave
number
Optional
Jaw shaving, range [0,1]
eye
number
Optional
Enlarged eyes, range [0,1]
chin
number
Optional
Chin adjustment, range [0,1]
effect
Array<EffectListOptions>
Optional
effect list
EffectListOptions:
Name
Type
Attributes
Description
id
number
Required
The effect id
intensity
string
Required
the strength of the effect

trtc.stopPlugin('Beauty')

Disables the beauty effect.

Frequently Asked Questions

1. When running the demo in Chrome, the video appears upside down and laggy
This plugin uses GPU acceleration, and you need to enable hardware acceleration mode in your browser settings. You can copy and paste chrome://settings/system into your browser's address bar and enable hardware acceleration mode.
2. When device performance is insufficient and causes high latency with long rendering times
You can reduce video resolution or frame rate by listening to events.
async function onError(error) {
const { code } = error;
if (code === 10000003 || code === 10000006) {
// Reduce resolution and frame rate
await trtc.updateLocalVideo({
option: {
profile: '480p_2'
},
});
// await trtc.stopPlugin('Beauty'); // Or disable the plugin
}
}

await trtc.startPlugin('Beauty', {
...// Other parameters
onError,
});