tencent cloud

Initialization Parameters

Config of the SDK supports the following initialization parameters:

type ModuleConfig = {
  beautify: boolean // The default is `true`.
  segmentation: boolean // The default is `false`.
}

type AuthConfig = {
  licenseKey: string // View in  Web Licenses of the console.
  appId: string // View in Account Information > Basic Information of the console.
  authFunc:() => Promise<{
    signature:string,
    timestamp:string
  }> // See documentation about the configuration and use of licenses
}

type CameraConfig = {
    width: number, // The video width.
    height: number, // The video height.
    mirror: boolean, // Whether to horizontally flip the video.
    frameRate: number // The capturing frame rate.
}

type BeautifyOptions = {
    whiten?: number, // The brightening effect. Value range: 0-1.
    dermabrasion?: number // The smooth skin effect. Value range: 0-1.
    lift?: number // The slim face effect. Value range: 0-1.
    shave?: number // The face width. Value range: 0-1.
    eye?: number // The big eyes effect. Value range: 0-1.
    chin?: number // The chin effect. Value range: 0-1.
}

type BackgroundOptions = {
    type: 'image' | 'blur' | 'transparent', 
    src?: string
}

type loadingConfig = {
    enable: boolean,
    size?: number
    lineWidth?: number
    strokeColor?: number
}

Callbacks

let effectList = [];
let filterList = [];
// Using the callbacks of the SDK
sdk.on('created', () => {
// Pull and display the filter and effect list in the `created` callback
sdk.getEffectList({
       Type: 'Preset',
       Label: 'Makeup',
}).then(res => {
    effectList = res
});
sdk.getCommonFilter().then(res => {
    filterList = res
})
})
sdk.on('cameraReady', async () => {
// By getting the output stream in the `cameraReady` callback, you can display a video image sooner, but the initialization parameters have not taken effect at this point.
// You can choose this method if you want to display a video image as soon as possible but do not need to apply effects to the video the moment it is displayed.
// You don’t need to update the stream after the effects start working.
const arStream = await ar.getOutput();
// Play the stream locally
// localVideo.srcObject = arStream
})
sdk.on('ready', () => {
// Get the output stream in the `ready` callback. The initialization parameters have taken effect at this point.
// You can get the output stream in `ready` if you want your video to show effects the moment it is displayed but do not expect it to be displayed as soon as possible.
// Between the two methods, choose the one that fits your needs.
const arStream = await ar.getOutput();
// Play the stream locally
// localVideo.srcObject = arStream
    // Call `setBeautify`, `setEffect`, or `setFilter` in the `ready` callback
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 // In v0.1.18 and later, you can use this parameter to set the filter strength of a special effect. If you do not pass this parameter, the strength specified for the effect will be used.
});
sdk.setFilter(filterList[0].EffectId, 0.5)
})

APIs

type BeautifyOptions = {
  whiten?: number, // The brightening effect. Value range: 0-1.
  dermabrasion?: number // The smooth skin effect. Value range: 0-1.
  lift?: number // The slim face effect. Value range: 0-1.
  shave?: number // The face width. Value range: 0-1.
  eye?: number // The big eyes effect. Value range: 0-1.
  chin?: number // The chin effect. Value range: 0-1.
}

{
    mode: 'AR' | 'VR',
    effectId?: string, // Pass through `effectId` to use a built-in model
    url?: string, // Pass through `url` to use a custom model
    backgroundUrl?: string, // The URL of the background image. This parameter is valid only in the VR mode.
}

{
    type: 'image|blur|transparent',
    src: string // This parameter is required only if `type` is `image`.
}

{
    PageNumber: number,
    PageSize: number,
    Name: '',
    Label: Array,
    Type: 'Custom|Preset'
}

type = 'AR' | 'VR'

Error Handling

The error object returned by the error callback includes the error code and error message, which facilitate troubleshooting.

sdk.on('error', (error) => {
// Handle an error in the error callback
const {code, message} = error
...
})

Handling the missing render context error

On some computers, if the SDK is in the background for a long time, the contextlost error may occur. In such cases, you can call ArSdk.prototype.resetCore(input: MediaStream) to resume rendering.

sdk.on('error', async (error) => {
if (error.code === 10000002) {
    const newInput = await navigator.mediaDevices.getUserMedia({...})
    await sdk.resetCore(newInput)
}
})