カスタムウィジェットの作成
Webex Contact Center Agent Desktopのウィジェットは Web コンポーネントまたは埋め込み iFrame である必要があるとわかると、開発者はテクノロジーを強制されるように感じるかもしれません。しかし、互換性のある任意のフレームワークでこれらのコンポーネントを構築できます。唯一の要件は、カスタムウィジェットを Web コンポーネントとしてエクスポートする必要があるという点です。これは、どのような機能も、Shadow DOM を有効にした状態で、JS バンドル内に定義される単一のカスタム HTML 要素としてラップする必要があるためです。
次に、いくつかの例を示します。
-
Angular JS でウィジェットを構築する場合は、ご利用の Angular バージョンが Angular Elements(バージョン 6 で追加)をサポートしていることを確認し、アプリケーションを Angular Element としてエクスポートします。
-
(エージェントデスクトップのパーツと同様に)React でアプリケーションを構築する場合は、作成する React アプリケーションをカスタム HTML 要素にラップして、Shadow DOM を手動で有効にするか、このプロセスを自動化するオープンソースソリューションを利用します。たとえば、Direflow があります。
-
Web コンポーネントの利用や Web コンポーネントとしてのエクスポートに完全に対応しているフレームワークは他にもさまざまなものがあります。参考として、広く利用されているフレームワークに対して定期的に自動テストを実行して継続的な互換性を確認している https://custom-elements-everywhere.com を利用できます。
ウィジェットとしてエクスポートする Web アプリケーションを構築するのに、フレームワークを使用する必要はありません。実際に、このマニュアルに記載しているすべての例で、通常の JavaScript を参照しています。