概要

このガイドでは、クライアントサイドJavaScriptアプリにClient SDKを追加する方法を学びます。

前提条件

Client SDK には以下が必要です。 Node.js そして エヌピーエム.

Client SDKをプロジェクトに追加するには

アプリに移動する

ターミナルを開く。既存のアプリがあれば、そのルートに移動する。そうでなければ、プロジェクト用に新しいディレクトリを作成する。

Client SDKをプロジェクトに追加します。

Client SDKパッケージをインストールします。

デフォルトを追加する package.json 走ることによって:

npm init -y

Client SDKをインストールするには、次のようにします。 npm:

npm install @vonage/client-sdk -s

Client SDKをコードにインポートします。

アプリケーションがES6モジュール構文を使用している場合、アプリケーション・コードの先頭付近でクライアント・モジュールをインポートできます:

アプリケーションが1つのページで実行される場合、scriptタグを使用してHTMLにモジュールをロードすることができます:

のパスを確認してください。 vonageClientSDK.min.js がプロジェクト構成に合っているかどうかを確認してください。

アプリで Client SDK を使用する

ユーザーとJWTの作成

JSONウェブトークン(JWT)はVonageアプリケーションにログインするために必要です。Client SDKはユーザーを管理したりJWTを生成することができないため、バックエンドで処理する方法を選択する必要があります:

  • オンボーディングやテスト目的の場合、バックエンドをセットアップする前に、以下の方法でクライアントサイドのアプリを動作させることができます。 コマンドラインからテストJWTを生成する クライアント側のJavaScriptにハードコーディングしてください。

  • 実際の使用では、NodeまたはPHPを使用してサーバーからJWTを配信できます。 バックエンドSDKを設定する。 jwt 変数にそのデータをフェッチする:

  • JWTの生成についてもっと読む この記事で

VonageClientをインスタンス化し、セッションを作成する。

をインスタンス化する。 VonageClient はVonage Client SDKのロード方法によって異なります。

を搭載した場合 <script> タグを付けている:

を介してロードされた場合 import:

セッションを作成するには、JWTを引数として createSession().

セッション状況

セッションが正常に作成された後にエラーが発生した場合は、そのエラーが sessionError インスタンス化された VonageClient.

結論

Client SDKをクライアントサイドJavaScriptアプリに追加し、セッションを作成しました。これで VonageClient クライアントをアプリに追加し、Client SDKの機能を使用します。

参照

  • データセンターの構成 - これは、アプリケーションにSDKを追加した後に実行できる高度なオプション設定です。