Flutter Web + flutter_webrtc
- Video
- Web
effects_sdk プラグインは Web Video Effects SDK をラップしたものです。flutter_webrtc の MediaStream を渡すと、処理済みの MediaStream が返ります。
Android、iOS、Web の Flutter 映像アプリに背景ぼかしと置換、美肌補正、オートフレーミングを、Flutter Web に AI ノイズキャンセリングを追加。flutter_webrtc を基にした既製のプラグインで実現します。
effects_sdk プラグインは Web Video Effects SDK をラップしたものです。flutter_webrtc の MediaStream を渡すと、処理済みの MediaStream が返ります。
LiveKit Flutter SDK のフォークが LocalVideoTrack に Video Effects SDK を追加します。Android と iOS ではネイティブ SDK を、Web では Web SDK を使います。
audio_effects_sdk プラグインは flutter_webrtc の MediaStream 上で Audio Effects SDK を実行します。speed、balanced、quality のプリセットによる AI ノイズ抑制です。
プラグインは Web SDK と同じ流れです。MediaStream を渡し、onReady を待って実行し、処理済みのストリームを使います。LiveKit のフォークでは、エフェクトは LocalVideoTrack のメソッドです。
// web/index.html: <script src="https://effectssdk.ai/sdk/web/{VERSION}/tsvb-web.js"></script>
// pubspec.yaml: effects_sdk: { git: { url: https://github.com/EffectsSDK/flutter-plugin.git } }
final effectsSDK = EffectsSDK('YOUR_CUSTOMER_ID');
effectsSDK.useStream(cameraStream);
final outputStream = effectsSDK.getStream();
effectsSDK.onReady = () {
effectsSDK.run();
effectsSDK.setBlur(60);
};
// pubspec.yaml: livekit_client from github.com/EffectsSDK/livekit-client-sdk-flutter
final videoTrack = await LocalVideoTrack.createCameraTrack(
CameraCaptureOptions(effectsSdkRequired: true),
);
await videoTrack.start();
final status = await videoTrack.auth('YOUR_CUSTOMER_ID');
if (status == AuthStatus.active) {
await videoTrack.setPipelineMode(PipelineMode.blur);
await videoTrack.setBlurPower(0.6);
}
// web/index.html: <script crossorigin="anonymous" src="https://effectssdk.ai/sdk/audio/dev/{VERSION}/atsvb-web.js"></script>
// pubspec.yaml: audio_effects_sdk: { git: { url: https://github.com/EffectsSDK/audio-flutter-wrapper } }
final audioSDK = AudioEffectsSDK('YOUR_CUSTOMER_ID');
audioSDK.useStream(micStream);
audioSDK.onReady = () {
audioSDK.run();
final cleanStream = audioSDK.getStream();
};
LiveKit をお使いですか?LiveKit との連携をご覧ください。
ビデオエフェクト:LiveKit Flutter のフォークで Android、iOS、Web、flutter_webrtc プラグインで Web に対応。音声ノイズキャンセリング:audio_effects_sdk プラグインで Flutter Web に対応しています。
platform channel を通じて Android と iOS のネイティブ SDK を使ってください。LiveKit のフォークが良い参考になります。両プラットフォームでネイティブのカメラパイプラインを Flutter とつないでいます。構成をお聞かせいただければお手伝いします。
Flutter の音声プラグインは現在 Web 向けです。Android と iOS では、platform channel を通じてネイティブの Audio Effects SDK(Maven ai.effectssdk:audio、Swift Package AudioEffectsSDK)を呼び出してください。
Web プラグインでは背景のぼかしと置換、美肌補正、オートフレーミング、色補正、レイアウト、テロップ、オーバーレイ。LiveKit のフォークでは、モバイルでネイティブパイプラインのモードを利用できます。
対象プラットフォームと、映像・音声のキャプチャ方法をお知らせください。導入をサポートします。
準備はできましたか?Developer Portal を開いて無料トライアルを始めましょう。