node.jsのExpressでローカルサーバーを構築
本エントリーは「to-R JavaScript Advent Calendar 2015」5日目のエントリー、node.jsのExpressでローカルサーバーを構築する方法を解説します。
前回は、getUserMedia APIを利用してウェブカムの情報をvideo要素に表示する方法について解説しましたが、WebRTC開通までの工程として今回はnode.jsのExpressでローカルサーバーを構築する方法を解説します。
WebRTCではWebSocketによる通信を行う必要があり、WebSocketはnode.jsを利用すると非常に簡単に利用できます。
そのため、まずサーバーをnode.jsで用意しておきたいと思います。
Expressはnode.jsでサーバー構築が簡単にできるアプリケーションです。(サーバ構築というよりWebアプリケーション開発を簡単にするソフトです)
node.jsのインストールは「タスクランナーgulp入門」のnode.jsのインストールなどを参考にしてください。
Expressのインストール
適当なフォルダ(webRTCなど)を作成してターミナルで開き、npm initを用いてpackage.jsonを生成します。
npm init
「entry point: (index.js)」と聞かれたらapp.jsなど適当なファイル名を入力しましょう。
つぎにExpressをインストールしましょう。
ターミナルなどを開いて以下のコマンドを入力します。
npm install express --save
サーバー構成
今回は以下のようにサーバー構成で作成します。WebRTC内にhtdocsフォルダを作成してそこをアプリケーションのルートフォルダに設定します。
webRTC
├── app.js
├── htdocs
│ └── index.html
├── package.json
├── node_modules
app.jsの内容
app.js内には以下の様な内容を記述しておきます。
expressの設定とアプリケーションのルートフォルダのみの非常にシンプルな設定です。
var express = require('express');
var app = express();
app.use(express.static('htdocs'));
var port = 3000;
app.listen(port,function(){
console.log("Expressサーバーがポート%dで起動しました。モード:%s",port,app.settings.env)
});
アプリケーションの起動
以下のコマンドでアプリケーションを起動することができ、「Expressサーバーがポート3000で起動しました。モード:development」と表示されるはずです。
node app.js
これで、ブラウザでhttp://localhost:3000にアクセスすればindex.htmlの内容が表示されてるはずです。
次回はsocket.ioを利用した双方向チャットを作成してみたいと思います。
関連エントリー
5分でわかるWebRTCの仕組み - html5minutes vol.01
スポンサードリンク
«getUserMedia APIを利用してウェブカムの情報をvideo要素に表示する | メイン | node.jsとsocket.ioで簡易チャットを作成する»