以下の用途向け:WEB

Web 向け Beauty AR SDK

Web 向け Beauty AR SDK でブラウザのカメラにリアルタイムのレタッチ、フェイスエフェクト、バーチャル背景を追加できます。

開発者向けリソース

Web 向け Beauty AR SDKのドキュメントとサンプル

カメラの準備が整った会話

通話に参加する前のブラウザプレビューに背景ぼかしを追加します。

ブラウザでメイクを試す

カメラを通してリップカラーやメイクエフェクトをプレビューできます。

WEB BEAUTY AR の機能

アプリに必要なカメラ体験を構築

カメラ入力

  • 内蔵カメラキャプチャ
  • カスタムストリームと画像

リアルタイムの外観調整

  • 調整できる肌のレタッチ
  • フィルターとメイクエフェクト

背景の調整

  • 背景ぼかし
  • 画像・動画の背景

Web 向け Beauty AR SDK を見る

API をカメラ、操作 UI、エフェクト素材に接続します。

カメラ入力

ブラウザプレビューから始める

Web 向け Beauty AR SDK でカメラ入力を取得し、処理済みストリームをプレビューします。

ドキュメントを読む
preview.js
sdk.on('ready', async () => {
  const player = await sdk.initLocalPlayer('preview');
  await player.play();
});

カスタマイズ

あなたの画面、あなたのルック。

アプリに統一感のある体験を保ちます。

あなたらしいカメラ体験に

Web 向け Beauty AR SDK にサイドバーや下部ツールバーを組み合わせます。操作 UI はアプリ側で管理します。

ドキュメントを読む

始める

Web 向け Beauty AR SDK を導入する

  1. 01

    ライセンスを準備する

    ライセンスを Web ドメイン に合わせます。

    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 配信ではアルファチャンネルは保持されません。

Web 向け Beauty AR SDK のライセンス体系は?

アプリに必要なエフェクトを含む Web ライセンスを選択してください。本番利用の前に、最新のトライアル条件とパッケージの対象範囲を確認します。

ブラウザアプリに Web 向け Beauty AR SDK を統合するには?

ブラウザ設定と対応環境の要件に従ってください。対象とする実際のブラウザで、必要な権限、ナビゲーション、リソース解放をテストします。

アプリ公開前に Web 向け Beauty AR SDK をテストするには?

ライセンス対象の入力とエフェクト処理をテストします。カメラ使用時の権限とプレビュー終了後の解放も確認してください。

Web 向け Beauty AR SDK の画面をカスタマイズするには?

対応するエフェクトを独自のプレビューと選択 UI に接続します。素材、機能対応、ライセンス範囲は対象プラットフォームに一致させてください。

Web Beauty AR の導入サポート

アプリケーションについて相談

製品、想定利用量、統合要件についてご相談ください。

営業担当者への連絡

カメラ体験を動かす

アプリに適したライセンスと Web 向け Beauty AR SDK で開発を始めましょう。