Azure Cloud Services (クラシック) で Socket.IO を使用する Node.js チャットアプリケーションをビルドする

ヒント

Socket.IO は、Azure でネイティブにサポートされるようになりました。 Socket.IO アプリをスケールアウトして何千もの接続を処理するのは、多くの場合、フラストレーションがたまる作業です。 Azure で Socket.IO がネイティブにサポートされるようになったので、スケーラビリティと可用性の処理は Azure に任せることができます。 Azure で実行されている Socket.IO アプリを数行のコードで取得する方法の詳細については、こちらを参照してください。

重要

Cloud Services (クラシック) は、2024 年 9 月 1 日をもって、すべてのお客様に対して非推奨になりました。実行中の既存のデプロイはすべて Microsoft によって停止およびシャットダウンされ、2024 年 10 月以降、そのデータは永久に失われます。新しいデプロイでは、新しい Azure Resource Manager ベースのデプロイモデル、 Azure Cloud Services (延長サポート) を使用してください。

Socket.IO は、Node.js サーバーとクライアントの間のリアルタイム通信を提供します。このチュートリアルでは、Azure で socket.IO ベースのチャットアプリケーションをホストする手順を説明します。 Socket.IO の詳細については、socket.io を参照してください。

次に示すのは完成したアプリケーションのスクリーンショットです。

![Azure でホストされるサービスを表示しているブラウザーウィンドウ] [completed-app]

[前提条件]

この記事の例を正常に完了するには、次の製品とバージョンがインストールされている必要があります。

Visual Studioをインストール
Node.jsをインストールする
Python バージョン 2.7.10 をインストールする

クラウドサービスプロジェクトの作成

次の手順では、Socket.IO アプリケーションをホストするクラウドサービスプロジェクトを作成します。

[スタート] メニューまたはスタート画面で、Windows PowerShell を検索します。最後に、 [Windows PowerShell] を右クリックし、 [管理者として実行] を選択します。
c:node というディレクトリを作成します。
```
PS C:\> md node
```
ディレクトリを c:node ディレクトリに変更します。
```
PS C:\> cd node
```
次のコマンドを入力して、chatapp という名前の新しいソリューションと WorkerRole1 という名前の worker ロールを作成します。
```
PS C:\node> New-AzureServiceProject chatapp
PS C:\Node> Add-AzureNodeWorkerRole
```
次の応答が表示されます。

チャットのサンプルのダウンロード

このプロジェクトでは、[Socket.IO GitHub リポジトリ] のチャットの例を使用します。次の手順を実行して、サンプルをダウンロードし、先ほど作成したプロジェクトに追加します。

[複製] ボタンを使用して、リポジトリのローカルコピーを作成します。 [ZIP] ボタンを使用してプロジェクトをダウンロードすることもできます。
ローカルリポジトリのディレクトリ構造を、examples\chat ディレクトリまで移動します。このディレクトリの内容を、先ほど作成した C:\node\chatapp\WorkerRole1 ディレクトリにコピーします。

$アーカイブから抽出された examples\chat ディレクトリの内容を表示するエクスプローラー$

上記のスクリーンショットで強調表示されている項目は、examples\chat ディレクトリからコピーされたファイルです
C:\node\chatapp\WorkerRole1 ディレクトリで、server.js ファイルを削除して、app.js ファイルの名前を server.js に変更します。この手順により、前に Add-AzureNodeWorkerRole コマンドレットによって作成された既定の server.js ファイルが削除され、チャットの例のアプリケーションファイルに置き換えられます。

Server.js の変更とモジュールのインストール

Azure エミュレーターでアプリケーションをテストする前に、いくつかの点を変更する必要があります。次の手順で server.js ファイルを変更します。

Visual Studio または任意のテキストエディターで server.js ファイルを開きます。

server.js の先頭にある Module dependencies セクションを探して、次のように sio = require('..//..//lib//socket.io') を含む行を sio = require('socket.io') に変更します。

var express = require('express')
  , stylus = require('stylus')
  , nib = require('nib')
//, sio = require('..//..//lib//socket.io'); //Original
  , sio = require('socket.io');                //Updated
  var port = process.env.PORT || 3000;         //Updated

アプリケーションで確実に適切なポートでリッスンされるようにするには、メモ帳または任意のエディターで server.js を開き、次のように 3000 を process.env.port に変更します。
```
//app.listen(3000, function () {            //Original
app.listen(process.env.port, function () {  //Updated
  var addr = app.address();
  console.log('   app listening on http://' + addr.address + ':' + addr.port);
});
```

server.jsの変更内容を保存した後、次の手順に従って必要なモジュールをインストールし、Azure エミュレーターでアプリケーションをテストします。

Azure PowerShell で、C:\node\chatapp\WorkerRole1 ディレクトリに移動し、次のコマンドを使用して、このアプリケーションで必要なモジュールをインストールします。
```
PS C:\node\chatapp\WorkerRole1> npm install
```
このコマンドによって、package.json ファイルにリストされているモジュールがインストールされます。コマンドが完了すると、次のスクリーンショットのような出力が表示されます。
この例は本来 Socket.IO GitHub リポジトリの一部であり、Socket.IO ライブラリを相対パスで直接参照しており、package.json ファイルでは Socket.IO が参照されていないため、次のコマンドを発行して Socket.IO をインストールする必要があります。
```
PS C:\node\chatapp\WorkerRole1> npm install socket.io --save
```

テストとデプロイ

次のコマンドを発行してエミュレーターを起動します。
```
PS C:\node\chatapp\WorkerRole1> Start-AzureEmulator -Launch
```
注

エミュレーターの起動時に問題が発生した場合 (例: Start-AzureEmulator : 予期しないエラーが発生しました。詳細: 予期しないエラーが発生しました。通信オブジェクト System.ServiceModel.Channels.ServiceChannel はフォールト状態にあるため、これを通信に使用することはできません。

AzureAuthoringTools v 2.7.1 と AzureComputeEmulator v 2.7 を再インストールし、そのバージョンが一致することを確認します。
ブラウザーを開き、 http://127.0.0.1 に移動します。
ブラウザーウィンドウが開いたら、ニックネームを入力して Enter キーを押します。この手順により、特定のニックネームでメッセージを投稿できます。マルチユーザー機能をテストするには、同じ URL を使用してさらに別のブラウザーウィンドウを開き、異なるニックネームを入力します。
アプリケーションのテストが終了したら、次のコマンドを発行してエミュレーターを停止します。
```
PS C:\node\chatapp\WorkerRole1> Stop-AzureEmulator
```
Azure にアプリケーションをデプロイするには、 Publish-AzureServiceProject コマンドレットを使用します。例えば次が挙げられます。
```
PS C:\node\chatapp\WorkerRole1> Publish-AzureServiceProject -ServiceName mychatapp -Location "East US" -Launch
```
重要

必ず一意の名前を使用してください。一意でない場合は発行処理が失敗します。デプロイが完了すると、ブラウザーが開き、デプロイされたサービスに移動します。

指定したサブスクリプション名がインポートされた発行プロファイルに存在しないというエラーが出力された場合は、Azure にデプロイする前に、サブスクリプションの発行プロファイルをダウンロードしてインストールする必要があります。「 Node.js アプリケーションの構築と Azure のクラウドサービスへのデプロイ 」の「 Azure へのアプリケーションのデプロイ

![Azure でホストされるサービスを表示しているブラウザーウィンドウ] [completed-app]

注

指定したサブスクリプション名がインポートされた発行プロファイルに存在しないというエラーが出力された場合は、Azure にデプロイする前に、サブスクリプションの発行プロファイルをダウンロードしてインストールする必要があります。「Node.js アプリケーションの構築と Azure のクラウドサービスへのデプロイ」の「Azure へのアプリケーションのデプロイ」セクションを参照してください。

これで、アプリケーションは Azure で実行されるようになり、Socket.IO を使用する複数のクライアント間でチャットメッセージを中継できます。

注

わかりやすくするために、このサンプルは同じインスタンスに接続したユーザー間でのチャットに制限されています。つまり、クラウドサービスによって 2 つの worker ロールインスタンスが作成された場合、ユーザーは同じ worker ロールインスタンスに接続された他のユーザーとのみチャットすることができます。複数のロールインスタンスで機能するようにこのアプリケーションを拡張するには、Service Bus などのテクノロジを使用して、インスタンス間で Socket.IO ストアの状態を共有します。たとえば、 Azure SDK for Node.js GitHub リポジトリにある Service Bus キューおよびトピックの使用例を参照してください。

次のステップ

このチュートリアルでは、Azure Cloud Services でホストされる基本的なチャットアプリケーションを作成する方法について説明しました。 Azure Web サイトでこのアプリケーションをホストする方法については、「Azure Websites で Socket.IO を使用する Node.js チャットアプリケーションを構築する」を参照してください。

詳細については、 Node.js デベロッパーセンターを参照してください。

Last updated on 2024-07-23