1 Import SDK

Import NvEffectSdk.js

<script src="https://alieasset.meishesdk.com/NvWasm/domain/21/NvEffectSdk.js"></script>

Install meishewasmloader Reference

npm i meishewasmloader --save

Use WASMLoader to load wasm files

import { WASMLoader }  from 'meishewasmloader';
const wasmLoader = WASMLoader({
    // State changed callback       
    showLoader: function (state) {},
    // Error callback
    showError(errorText: string) {},
    // Finish callback
    loadingFinished() {},
});
wasmLoader.loadEmscriptenModule("https://alieasset.meishesdk.com/NvWasm/domain/21/", { effectSdk:true });

Note: https://alieasset.meishesdk.com/NvWasm/domain/21/ is the test address provided by Meishe. You need to contact business people to get SDK related files, and replace this address with your address when deploying product;
For improving loading speed, we recommend that compress wasm-related files by brotli or gzip configuration of cdn or nginx;
The addresses in steps 1 and 2 need to be consistent, otherwise unpredictable results will occur;

2 Verify License

Meishe web EffectSDK support non-license mode on localhost, so you can preview all effects on localhost quickly. Otherwise, you need to contact business people to get license files, then verify license as following: Use verifySdkLicenseFileUrl() to verify sdk license in loadingFinished callback of WASMLoader:

if(nveGetEffectContextInstance().verifySdkLicenseFileUrl('/static/effectsdk.lic')) {
    // Success
} else {
    // Fail
}

All SDK effects cannot be used if authentication failed.

3 Init ARScene Renderer

const arSceneRenderer = new NveARSceneRenderer();
await arSceneRenderer.init({
    faceModelUrl:"https://alieasset.meishesdk.com/model/ms_face240_v2.0.8.model",
});

Note: Beauty effect added by default after initialization.

4 Startup Camera

await arSceneRenderer.startupCamera({
    audio: false,
    video: {width: 1280, height: 720, frameRate: {ideal: 30, max: 60}}
});

5 Get Output Stream

const outputStream = arSceneRenderer.getOutputStream();