banuba/quickstart-web

Banuba SDK Web AR example application

Banuba SDK Web AR demo app

Requirements

• Banuba client token
• Nodejs installed
• Browser with support of WebGL 2.0

Obtaining Banuba SDK Web AR

The example uses CDN version of the @banuba/webar npm package for simplicity. Please use the npm package mentioned above for real world projects. Check out the Integration tutorials for more ways of consuming @banuba/webar package.

Obtaining Banuba Client token

Banuba Client token is required to get Banuba SDK Web AR working.

To receive a new trial client token please fill in the form on banuba.com website, or contact us via [email protected].

Environment setup and local run

Clone the repository

git clone [email protected]:Banuba/quickstart-web.git

Insert Banuba client token into BanubaClientToken.js

window.BANUBA_CLIENT_TOKEN = "PUT YOUR CLIENT TOKEN HERE";

Run the live server in the cloned folder

npx live-server

Open localhost:8080

Adding a new effect

Put effect zip file to import/ folder and add zip file name to ./import/effectsList.js file. Example:

export const importedEffectsList = ["your_effect_1.zip", "your_effect_2.zip"];

You can obtain more effects on the Demo Face Filters page.

---

Learn more about Banuba WebAR SDK on the Web section of docs.banuba.com.

quickstart-web's Issues

Webcam not opening

I have cloned quickstart-web, and changed the access client token and run on the local server but there is one dialog box comming with two options i) webcam and ii) upload photo but non of the option working.

Uncaught SyntaxError: The requested module './BanubaSDK.js' does not provide an export named 'Dom'

Uncaught SyntaxError: The requested module './BanubaSDK.js' does not provide an export named 'Dom'
Having error when after copying BanubaSDK on my project.

The effects not working. only show the webcam video

I tried with this project and use a trial license with BanubaSDK version 1.0. its shows the video from the webcam with fps details and other stuff (the record works well) but the effects do not show anything.

i follow the instruction put BanubaSDK,js , BanubaSDK.data, BanubaSDK.simd.wasm, BanubaSDK.wasm. in root folder.
used on :

• Edge Version 94.0.992.38 (Official build) (64-bit)
• Chrome Version Version 94.0.4606.81 (Official Build) (64-bit)
  OS Windows 10 but the server running on WSL. 2.0 Ubuntu 20.04

[Fix] `effectsList` is undefined

Description

• When launching the project, create and use a custom effect. There is an error effectsList is undefined. I've fixed it here but not sure how to merge it in: wlto@d6602a7