Beauty AR
  • 개요
  • Web
    • 빠른 실행
    • 통합
      • 개요
      • 내장 카메라
      • 사용자 정의 스트림
      • 로딩 최적화
      • 특수효과 설정
      • 인물사진 분할 사용
      • 이모티콘 및 가상 아바타 설정
    • 인터페이스 문서
    • 배포 설명
    • 모범 관례
      • WebRTC를 결합한 푸시
      • WebRTC를 결합한 푸시(사전 초기화 방안)
      • TRTC를 결합한 푸시
    • 자주 받는 질문들
  • Android
    • 통합
      • SDK 통합
      • TEBeautyKit 통합
    • 인터페이스 문서
    • 배포 설명
    • 모범 관례
      • SDK 크기 축소
      • 특수효과 매개변수
    • 고급 기능
      • 제스처 인식
      • 얼굴 인식
      • 가상 배경
    • 소재 만들기
      • 뷰티 AR Studio 소개
    • 자주 받는 질문들
  • IOS
    • 통합
      • SDK 통합
      • TEBeautyKit 통합
    • 인터페이스 문서
    • 배포 설명
    • 모범 관례
      • SDK 크기 축소
      • 특수효과 매개변수
    • 고급 기능
      • 제스처 인식
      • 얼굴 인식
      • 가상 배경
    • 소재 만들기
      • 뷰티 AR Studio 소개
    • 자주 받는 질문들
  • Flutter
    • 통합
    • 인터페이스 문서
    • 소재 만들기
      • 뷰티 AR Studio 소개
  • 개요
    • 개요
  • 서비스 활성화
  • 가격
  • 무료 버전
    • Web
    • 모바일
Beauty AR

인터페이스 문서

초기화 매개변수

SDK의 Config는 다음 초기화 매개변수를 지원합니다.
매개변수
설명
유형
필수 여부
module
모듈 구성
type ModuleConfig = {
beautify: boolean // 기본값: true
segmentation: boolean // 기본값: false
}
No, 기본값: {beautify: true, segmentation: false}
auth
인증 매개변수
type AuthConfig = { licenseKey: string // 콘솔의 Web License 관리 에서 가져오기 appId: string // 콘솔의 계정 정보 > 기본 정보에서 APPID 보기 authFunc:() => Promise<{ signature:string, timestamp:string }> // License 구성 및 사용에 대한 문서를 참고하십시오.}
Yes
input
입력
MediaStream|HTMLImageElement|String
No
camera
내장 카메라 구성
type CameraConfig = {
width: number, // 비디오 너비
height: number, // 비디오 높이
mirror: boolean, // 비디오 수평 뒤집기 여부
frameRate: number // 캡처 프레임 레이트
}
No
beautify
뷰티 필터 효과
type BeautifyOptions = {
whiten?: number, // 브라이트닝 효과. 값 범위: 0-1
dermabrasion?: number // 매끄러운 피부 효과. 값 범위: 0-1
lift?: number // 갸름한 얼굴 효과. 값 범위: 0-1
shave?: number // 얼굴 너비. 값 범위: 0-1
eye?: number // 큰 눈 효과. 값 범위: 0-1
chin?: number // 턱 효과. 값 범위: 0-1
}
No
background
배경 매개변수
type BackgroundOptions = {
type: 'image' | 'blur' | 'transparent',
src?: string
}
No
loading
내장 loading icon 구성
type loadingConfig = {
enable: boolean,
size?: number
lineWidth?: number
strokeColor?: number
}
No

콜백 이벤트

let effectList = [];
let filterList = [];
// sdk의 콜백 사용
sdk.on('created', () => {
// created 콜백에서 필터 및 효과 목록을 풀링하여 표시합니다.
sdk.getEffectList({
Type: 'Preset',
Label: '메이크업',
}).then(res => {
effectList = res
});
sdk.getCommonFilter().then(res => {
filterList = res
})
})
sdk.on('cameraReady', async () => {
// cameraReady 콜백에서 출력 스트림을 가져오면 비디오 이미지를 더 빨리 표시할 수 있지만 초기화 매개변수는 이 시점에서 적용되지 않습니다.
// 비디오 이미지를 가능한 한 빨리 표시하지만 비디오가 표시되는 순간에 효과를 적용할 필요가 없는 경우 이 방법을 선택할 수 있습니다.
// 뷰티 효과가 작동하기 시작한 후에는 stream을 업데이트할 필요가 없습니다.
const arStream = await ar.getOutput();
// 로컬 재생
// localVideo.srcObject = arStream

})
sdk.on('ready', () => {
// ready 콜백에서 출력 스트림을 가져옵니다. 이제 초기화 매개변수가 적용되었습니다.
// 비디오가 표시되는 순간 효과를 보여주길 원하지만 가능한 한 빨리 표시되기를 기대하지 않는 경우 output 스트림을 cameraReady로 가져올 수 있습니다.
// 두 가지 방법 중에서 필요에 맞는 방법을 선택합니다.
const arStream = await ar.getOutput();
// 로컬 재생
// localVideo.srcObject = arStream

// ready 콜백에서 setBeautify/setEffect/setFilter를 호출합니다.
sdk.setBeautify({
whiten: 0.3
});
sdk.setEffect({
id: effectList[0].EffectId,
intensity: 0.7
});
sdk.setEffect({
id: effectList[0].EffectId,
intensity: 0.7,
filterIntensity: 0.5 // v0.1.18 이상에서는 이 매개변수를 사용하여 특수 effect의 필터 강도를 설정할 수 있습니다. 이 매개변수를 전달하지 않으면 효과에 대해 지정된 intensity가 사용됩니다.
});
sdk.setFilter(filterList[0].EffectId, 0.5)
})

콜백
설명
반환 값
created
SDK 인증이 완료되고 인스턴스가 생성되었습니다.
-
cameraReady
SDK의 비디오 output을 생성했습니다(뷰티 필터는 아직 적용되지 않음).
-
ready
감지가 초기화되었습니다. 이제 효과가 output 비디오에 적용됩니다. 효과 설정을 변경할 수 있습니다.
-
error
SDK 오류 발생 시 트리거
error 객체

객체 메소드

API
요청 매개변수
응답 매개변수
설명
async getOutput(fps)
fps(선택 사항): 출력 프레임 레이트
MediaStream|String
이 API는 Web SDK에서만 사용할 수 있습니다.
setBeautify(options)
options: 뷰티 필터 매개변수 객체
type BeautifyOptions = {
whiten?: number, // 브라이트닝 효과. 값 범위: 0-1
dermabrasion?: number // 매끄러운 피부 효과. 값 범위: 0-1
lift?: number // 갸름한 얼굴 효과. 값 범위: 0-1
shave?: number // 얼굴 너비. 값 범위: 0-1
eye?: number // 큰 눈 효과. 값 범위: 0-1
chin?: number // 턱 효과. 값 범위: 0-1
}
-
뷰티 필터를 구성하려면 뷰티 필터 모듈을 활성화해야 합니다.
setEffect(effects, callback)
effects: 효과 ID | effect 객체 | 효과 ID / effect 배열
effect:{
id: string,
intensity: number, // 효과 강도, 기본값: 1, 값 범위: 0-1
filterIntensity: number // 효과의 필터 강도(v0.1.18 이상에서 지원됨). 값 범위: 0-1. 기본적으로 이 매개변수는 intensity와 동일
}
callback: 설정 성공 콜백
-
특수 효과를 구성하려면 뷰티 필터 모듈을 활성화해야 합니다.
setAvatar(params)
{
mode: 'AR' | 'VR',
effectId?: string, // 내장 모델을 사용하려면 effectId를 패스스루합니다.
url?: string, // 사용자 정의 모델을 사용하려면 url을 패스스루합니다.
backgroundUrl?: string, // 배경 이미지의 URL입니다. 이 매개변수는 VR 모드에서만 유효합니다.
}
-
Animoji 또는 가상 아바타를 사용합니다.
setBackground(options)
{
type: 'image|blur|transparent',
src: string // 이 매개변수는 유형이 image인 경우에만 필요합니다.
}
-
배경을 구성하려면 키잉 모듈을 활성화해야 합니다.
setFilter(id, intensity, callback)
id: 필터 ID
intensity: 필터 강도, 값 범위: 0-1
callback: 설정 성공 콜백
-
이 API는 필터를 설정하는 데 사용됩니다.
getEffectList(params)
{
PageNumber: number,
PageSize: number,
Name: '',
Label: Array,
Type: 'Custom|Preset'
}
효과 목록
이 API는 효과의 목록 풀링에 사용됩니다.
getAvatarList(type)
type = 'AR' | 'VR'
가상 아바타 목록
가상 아바타 목록을 풀링합니다.
getEffect(effectId)
effectId: 효과 ID
단일 특수 효과 정보
이 API는 특정 효과의 정보 풀링에 사용됩니다.
getCommonFilter()
-
내장 필터 목록
이 API는 내장 필터를 가져오는 데 사용됩니다.
async updateInputStream(src:MediaStream)
(v0.1.19부터 지원)
src: 새로운 입력 스트림(MediaStream)
-
이 API는 입력 스트림을 업데이트하는 데 사용됩니다.
disable()
-
-
이 API는 얼굴 감지를 비활성화하는 데 사용됩니다. 비활성화되면 원시 스트림이 반환됩니다. CPU 사용량을 줄일 수 있습니다.
enable()
-
-
이 API는 얼굴 감지를 활성화하는 데 사용됩니다. 활성화되면 반환된 스트림이 처리됩니다.
destroy()
-
-
이 API는 sdk 인스턴스를 종료하고 텍스처 리소스를 지우는 데 사용됩니다.

오류 처리

error 콜백에 의해 반환된 오류 객체에는 문제 해결을 용이하게 하는 오류 코드와 오류 메시지가 포함됩니다.
sdk.on('error', (error) => {
// error 콜백에서 오류 처리
const {code, message} = error
...
})
에러 코드
설명
비고
10000001
지원되지 않는 브라우저
Chrome, Firefox, Safari 사용 권장
10000002
렌더링 컨텍스트 누락
-
10000003
렌더링 시간 오래 걸림
해상도를 낮추거나 일부 기능을 비활성화하는 것을 고려하십시오
10000005
입력 구문 분석 오류
-
10001101
특수 효과를 구성하는 동안 오류 발생
-
10001102
필터를 구성하는 동안 오류 발생
-
10001103
유효하지 않은 효과 강도
-
10001201
카메라 시작 실패
-
10001202
카메라 중단
-
20002001
인증 매개변수 누락
-
20001001
인증 실패
License를 생성했고 서명이 올바른지 확인하십시오
20001002
API 요청 실패
오류 콜백은 API에서 반환한 데이터를 반환합니다. 자세한 내용은 API 에러 코드를 참고하십시오.
40000001
SDK 버전이 너무 오래되어 일부 효과가 작동하지 않습니다. SDK를 업데이트하십시오.
-

누락된 렌더링 컨텍스트 오류 처리

일부 PC에서는 SDK가 오랫동안 백그라운드에 있으면 contextlost 오류가 발생할 수 있습니다. 이러한 경우 ArSdk.prototype.resetCore(input: MediaStream)를 호출하여 렌더링을 재개할 수 있습니다.
sdk.on('error', async (error) => {
if (error.code === 10000002) {
const newInput = await navigator.mediaDevices.getUserMedia({...})
await sdk.resetCore(newInput)
}
})