专为以下场景打造:WEB

Web Beauty AR SDK

使用 Web Beauty AR SDK,为浏览器相机添加实时美颜、人脸特效和虚拟背景。

开发者资源

Web Beauty AR SDK 文档与示例

从容出镜的对话体验

在用户加入通话前,为浏览器预览添加背景模糊。

在浏览器中试妆

让用户通过相机预览唇色和妆容特效。

WEB BEAUTY AR 功能

构建应用所需的相机体验

相机输入

  • 内置相机采集
  • 自定义流与图片

实时外观

  • 可调节肤质修饰
  • 滤镜与妆容特效

背景控制

  • 背景模糊
  • 图片与视频背景

探索 Web Beauty AR SDK

将 API 接入你的相机、控制项和特效素材。

相机输入

从浏览器预览开始

使用 Web Beauty AR SDK 采集相机输入并预览处理后的流。

阅读文档
preview.js
sdk.on('ready', async () => {
  const player = await sdk.initLocalPlayer('preview');
  await player.play();
});

个性化定制

你的界面,你的风格。

让体验与你的应用保持一致。

打造自己的相机体验

围绕 Web Beauty AR SDK 构建侧栏或底部工具栏。控制界面由你的应用负责。

阅读文档

开始使用

开始接入 Web Beauty AR SDK

  1. 01

    准备许可证

    使许可证与 网站域名 匹配。

    打开 Beauty AR 控制台
  2. 02

    添加 Web Beauty AR SDK

    按照平台指南连接您的项目。

    按照集成指南操作
  3. 03

    处理第一帧画面

    初始化 Web Beauty AR SDK,等待 ready,然后预览处理后的相机流。

    配置许可证
Web Beauty AR SDK
终端
npm install tencentcloud-webar
camera-preview.js
import { ArSdk } from 'tencentcloud-webar';

// Start after the user chooses to enable the camera.
const sdk = new ArSdk({
  auth: { appId, licenseKey, authFunc },
  module: { beautify: true, segmentation: true },
  camera: { width: 1280, height: 720 },
});
sdk.on('ready', async () => {
  const player = await sdk.initLocalPlayer('preview');
  await player.play();
});

Web Beauty AR SDK 常见问题

Web Beauty AR SDK 是否包含完整的视频通话应用?

不包含。它处理相机媒体并提供预览 API。需自行添加应用界面,并使用独立的 RTC 或直播 SDK 发布输出。

如何为 Web Beauty AR SDK 授权?

将 Web 许可证绑定到正确域名。提供 App ID、license key 和由服务端支持的签名回调;将 license token 保存在服务器上。

Web Beauty AR SDK 能否使用现有相机流?

可以。现有流可选择自定义输入模式,也可以使用内置相机采集。应用需负责相机权限与资源清理。

应该测试哪些浏览器?

查看当前兼容性指南,并测试目标设备。受支持的浏览器可以在本地显示透明背景,但 WebRTC 发布不会保留其 alpha 通道。

Web Beauty AR SDK 如何授权收费?

选择包含应用所需特效的 Web 许可证。生产启用前,请核对当前试用条件与套餐覆盖范围。

如何在浏览器应用中接入 Web Beauty AR SDK?

按指南配置浏览器并满足受支持环境要求。在计划支持的实际浏览器中测试所用权限、导航和清理。

发布应用前如何测试 Web Beauty AR SDK?

测试许可证授权范围内的输入与特效处理,包括使用相机时的权限和退出预览后的清理。

如何定制 Web Beauty AR SDK 的界面?

将受支持特效连接到自有预览和选择器。素材、功能支持与许可证范围必须匹配目标平台。

Web Beauty AR 集成支持

让相机体验开始运行

使用 Web Beauty AR SDK 和适合应用的许可证开始构建。