Quick Start

This page matches SDK 2.0.0. Auth: Auth & License. Makeup / reshape enums: Parameter enums.

Requirements

Browser: Chrome 57+, Firefox 52+, Safari 11+, Edge 16+
Language: JavaScript (ES6+) or TypeScript
Context: HTTPS or localhost (required for camera)

Install SDK

npm install facebetter

import {
  BeautyEffectEngine,
  EngineConfig,
  FrameType,
  MirrorMode,
  Reshape,
} from 'facebetter';

Get the example

Clone the GitHub repository and open demo/web/react:

git clone https://github.com/pixpark/facebetter-sdk.git
cd demo/web/react

The demo is a Vite + React app. It depends on the in-repo SDK via file: during development.

Bind domain and get credentials

In the Dashboard, bind your Web domain (for example example.com). See Subscription.
Copy appId / appKey from the Dashboard. Do not put them on EngineConfig. On Web they belong on your server.

Web has no offline .lic. Details: Auth & License.

Configure the demo

The demo does not put keys in the page. The page calls your proxy at /api/facebetter/auth (src/fetchLicenseToken.js) and passes the response into the engine. The production proxy lives in api/facebetter/auth.js; during local vite that path is forwarded to the deployed demo proxy.

const licenseToken = await fetch('/api/facebetter/auth', { method: 'POST' }).then((r) => r.text());
const engine = new BeautyEffectEngine(new EngineConfig({ licenseToken }));
await engine.init();

In production, implement the same proxy on your server. Full steps and a Node example: Auth & License. The SDK loads runtime files during init(). You do not need to copy resource.fbd into public/. Optional: init({ onProgress }) reports download percent. 3D stickers need resource_3d.fbd; body reshape needs resource_body.fbd — see Optional resource packs.

Run

npm install
npm run dev

Open the URL Vite prints (usually http://localhost:5175).

Verify

Open DevTools (F12) and watch the console.
Allow camera if prompted.
Drag beauty sliders — you should see skin smoothing / reshape on the preview.

Minimal production init

import { BeautyEffectEngine, EngineConfig } from 'facebetter';

const licenseToken = await fetch('/api/facebetter/auth', { method: 'POST' }).then((r) => r.text());
const engine = new BeautyEffectEngine(new EngineConfig({ licenseToken }));
await engine.init();

Your server holds app_id / app_key and returns a token. Example server code is on Auth & License.

Introduction

Android

iOS

macOS

Windows

Linux

Web

Requirements

Install SDK

Get the example

Bind domain and get credentials

Configure the demo

Run

Verify

Minimal production init

​Requirements

​Install SDK

​Get the example

​Bind domain and get credentials

​Configure the demo

​Run

​Verify

​Minimal production init

Requirements

Install SDK

Get the example

Bind domain and get credentials

Configure the demo

Run

Verify

Minimal production init