Web

import {ArSdk, isWebGLSupported} from 'tencentcloud-webar'

if(isWebGLSupported()) {
    const sdk = new ArSdk({
    ...
})
} else {
    // 屏蔽逻辑
}

import { ArSdk } from 'tencentcloud-webar'
// 初始化SDK
const sdk = new ArSdk({
...
})

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，SDK内部已处理
    const arStream = await ar.getOutput();
    // 本地播放
    // localVideo.srcObject = arStream

})
sdk.on('ready', () => {
    // 在 ready 回调中获取输出画面，此时初始化传入的美颜参数已生效
    // 区别上述cameraReady中获取output，适用于画面一展示就要有美颜的场景，但不要求尽早地展示画面
    // 根据自身业务需求选择一种处理方式即可
    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 // 0.1.18及以上版本支持单独设置effect中滤镜的强度，不传则默认与特效的intensity保持一致
    });
    sdk.setFilter(filterList[0].EffectId, 0.5)
})


sdk.on('error', (error) => {
    // 在 error 回调中处理错误
    const {code, message} = error
    ...
})

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