Live Share SDK


Live Share は、専用のバックエンド コードを記述することなく、Teams アプリをコラボレーション マルチユーザー エクスペリエンスに変換するように設計された SDK です。 Live Share を使用すると、ユーザーは会議中に共同watch、共同作成、共同編集を行うことができます。

画面共有だけでは不十分な場合があります。そのため、Microsoft は PowerPoint Live や Whiteboard などのツールを Teams に直接構築しました。 Web アプリケーションを会議インターフェイスのセンター ステージに直接移動することで、ユーザーは会議や通話中にシームレスに共同作業を行うことができます。

機能の概要

Live Share には、無限のコラボレーション シナリオをサポートする 3 つの主要なパッケージがあります。 これらのパッケージは、プリミティブ構成要素やターンキー シナリオなど、一連の分散データ構造 (DDS) を公開します。

Live Share は、 会議と Fluid Framework をシームレスに統合します。 流動フレームワークは、共有状態を分散および同期するためのクライアント ライブラリの集合体です。 Live Share は、セキュリティとグローバル規模の Teams に支えられた Azure Fluid Relay を無料かつフル マネージドですぐに使用できます。

Live Share Core

Live Share を使用すると、数行のコードで各会議に関連付けられている特別な Fluid Container に接続できます。 Live Share では、Fluid Framework によって提供されるデータ構造に加えて、会議でのアプリの状態の同期を簡略化するために、新しい DDS クラスのセットもサポートされています。

Live Share コア パッケージでサポートされる機能は次のとおりです。

  • を使用して会議の Live Share セッションに LiveShareClient参加します。
  • 会議のプレゼンスを追跡し、ユーザー メタデータを と LivePresence同期します。
  • ユーザーが でセッションを終了すると消えるアプリの状態を LiveState調整します。
  • カウントダウン タイマーを と LiveTimer同期します。
  • を使用してセッション内の他のクライアントにリアルタイム イベントを LiveEvent送信します。
  • を使用して他のユーザー LiveFollowModeに提示してフォローします。
  • SharedStringなどSharedMap、Fluid Framework の機能を利用します。

このパッケージの詳細については、「 コア機能」ページを参照してください。

Live Share メディア

ライブ共有ビデオ共有エクスペリエンスの例を示すスクリーンショット。

ビデオとオーディオは、現代の世界と職場の重要な部分です。 Live Share メディアを使用すると、わずか数行のコードを使用して、任意のメディア プレーヤーのメディア 同期 が可能になります。 プレーヤーの状態とトランスポートコントロールレイヤーでメディアを同期することで、ビューを個別に属性付けし、アプリを通じて可能な限り最高の品質を提供できます。 Microsoft はメディア コンテンツを再キャストしていないため、ライセンスとアクセスの要件はそのまま保持されます。

Live Share メディアでサポートされる機能は次のとおりです。

  • メディア プレーヤーの状態を同期し、 を使用して MediaPlayerSynchronizer追跡します。
  • ユーザーが会議中に話す際に、メディアボリュームをインテリジェントに調整します。
  • プレイヤーの状態を変更できるユーザーを制限します。
  • メディアの同期を一時停止し、その場で、またはスケジュールされた待機ポイントで再開します。

このパッケージの詳細については、「 Live Share メディア」ページを参照してください。

注:

Live Share はメディア コンテンツを再放送しません。 HTML5 <video> や Azure Media Player などの埋め込み Web プレーヤーで使用するように設計されています。

Live Share キャンバス

複数のユーザーが会議中にキャンバスに描画する例を示すスクリーンショット。

会議で共同作業を行うときは、ユーザーが画面上のコンテンツを指摘して強調できることが不可欠です。 Live Share キャンバスを使用すると、シームレスなコラボレーションのために、アプリに手描き入力、レーザー ポインター、カーソルを簡単に追加できます。

Live Share キャンバスでサポートされる機能は次のとおりです。

  • を使用して、アプリにコラボレーション <canvas>LiveCanvas追加します。
  • ペン、蛍光ペン、線、矢印ツールを使用してアイデアを伝えます。
  • レーザー ポインターを使用して効果的に提示します。
  • リアルタイムマウスカーソルと一緒に従います。
  • 可変デバイスとビューステートの設定を構成します。
  • 完全にサポートされているマウス、タッチ、スタイラスの入力を使用します。

このパッケージの詳細については、 Live Share キャンバス ページを参照してください。

Live Share を使用してアプリをビルドする理由

コラボレーション アプリの構築は、困難で、時間とコストがかかり、複雑なコンプライアンス要件が含まれるため、規模が大きくなると大変です。 Teams ユーザーは、画面共有を通してチームメイトと作業を確認したり、一緒にビデオを見たり、新しいアイデアを出し合ったりして、多くの時間を過ごしています。 Live Share SDK を使用すると、最小限の投資でアプリをより協調的なものに変換できます。

Live Share SDK の主な利点を次に示します。

  • 手間のいらないセッション管理とセキュリティ。
  • ステートフル分散データ構造とステートレス分散データ構造。
  • ビデオとオーディオを簡単に同期するためのメディア拡張機能。
  • ターン キーの手描き入力、レーザー ポインター、カーソル。
  • 役割検証を使用して会議の特権を尊重する。
  • 待ち時間が短く、無料で完全に管理されたサービス。

Live Share がコラボレーション シナリオに適しているかどうかを理解するには、Live Share と他のコラボレーション フレームワークの違いを理解しておくと役立ちます。次を含みます。

Web ソケット

Web ソケットは、Web でのリアルタイム通信のためのユビキタス テクノロジであり、一部のアプリでは独自のカスタム Web ソケット バックエンドを使用することを好む場合があります。 REST API とは異なり、Web ソケットは、セッション内のサーバーとクライアント間のオープン接続を維持します。

他のカスタム API サービスと同様に、要件には通常、認証セッション、リージョン マッピング、メンテナンス、スケーリングが含まれます。 多くのコラボレーション シナリオでは、サーバーでのセッション状態の維持も必要です。これには、ストレージ インフラストラクチャ、競合の解決などが必要です。

Live Share を使用すると、オーバーヘッドなしで Web ソケットのすべての機能を利用できます。

Azure Fluid Relay

Azure Fluid Relay は Fluid Framework のマネージド オファリングであり、開発者がリアルタイムのコラボレーション エクスペリエンスを構築し、接続された JavaScript クライアント間で状態をレプリケートするのに役立ちます。 Microsoft Whiteboard、Loop、OneNote は、現在 Fluid Framework を使用して構築されたアプリの例です。

他の Azure サービスと同様に、Azure Fluid Relay は、複雑さを最小限に抑えて、個々のプロジェクトのニーズに合わせて調整するように設計されています。 要件には、Fluid コンテナーとリージョン コンプライアンスの認証ストーリーの開発が含まれます。 構成後、開発者は高品質のコラボレーション エクスペリエンスを提供することに集中できます。

Live Share ホステッド サービス

Live Share は、Microsoft Teams 会議のセキュリティに裏打ちされたターンキーの Azure Fluid Relay サービスを提供します。 Live Share コンテナーは、会議参加者に制限され、テナント所在地の要件を維持し、数行のクライアント コードでアクセスできます。

import { LiveShareClient, LivePresence } from "@microsoft/live-share";
import { LiveShareHost } from "@microsoft/teams-js";

// Join the Fluid container
const host = LiveShareHost.create();
const liveShare = new LiveShareClient(host);
const schema = {
  initialObjects: { presence: LivePresence },
};
const { container } = await liveShare.joinContainer(schema);

// ... ready to start app sync logic

重要

Live Share SDK のホストされている Azure Fluid Relay サービスを介して送信または保存されたデータには、最大 24 時間アクセスできます。 詳細については、「MyAnalytics のよくある質問」を参照してください。

カスタム Azure Fluid Relay サービスの使用

ほとんどのユーザーは、無料のホステッド サービスを使用することをお勧めしますが、Live Share アプリに独自の Azure Fluid Relay サービスを使用すると有益な状況が残っています。

次の場合は、カスタム サービスの使用を検討してください。

  • 会議の有効期間を超えて Fluid コンテナーにデータを格納する必要があります。
  • カスタム セキュリティ ポリシーを必要とする機密データをサービス経由で送信します。
  • Teams の外部のアプリケーション用に、 SharedMapFluid Framework を使用して機能を開発します。

詳細については、カスタム Azure Fluid Relay サービスの ハウツー ガイドを参照してください。

React統合

Live Share には専用のReact統合があり、Live Share 機能を React アプリに簡単に統合できます。 コンポーネントを直接使用 LiveShareClient するのではなく、コンポーネントを最初に LiveShareProvider マウントするときに、コンポーネントを使用して Live Share セッションに参加できます。 それぞれにLiveDataObject対応するReactフックがあり、Live Share を非常に簡単に使用できるように設計されています。 詳細については、「Live Share for React GitHub」ページを参照してください。

ユーザーのシナリオ

シナリオ
マーケティング レビュー中に、ユーザーは最新のビデオ編集に関するフィードバックを収集したいと考えています。 ユーザーはビデオを会議ステージに共有し、ビデオを開始します。 必要に応じて、ユーザーはビデオを一時停止してシーンについて話し合い、参加者は画面の一部を描画して重要なポイントを強調します。
プロジェクト マネージャーは、計画中にチームとアジャイル ポーカーをプレイします。 マネージャーは、チームが合意するまで計画ゲームをプレイできるようにするアジャイル ポーカー アプリを会議ステージに共有します。
財務アドバイザーは、署名する前にクライアントと共に PDF ドキュメントを確認します。 財務アドバイザーは、PDF 契約を会議ステージに共有します。 すべての出席者は、互いのカーソルと強調表示されたテキストを PDF で確認でき、その後、両当事者が契約に署名します。

重要

Live Share は、 Microsoft Live Share SDK ライセンスの下でライセンスされます。 アプリでこれらの機能を使用するには、最初にこれらの条項を読んで同意する必要があります。

次のステップ

関連項目