【ドットインストール】node.jsを学ぶ2

前回のつづき。

サーバを立てる

server.jsというファイルで作ります。

  1 var http = require('http');
  2 var server = http.createServer();
  3 //
  4 server.on('request', function(req,res){
  5   //レスポンス用のヘッダーを作る
  6   res.writeHead(200,{'Content-Type': 'text/plain'});
  7   res.write('hello world!');
  8   res.end();
  9 });
 10 server.listen(1337,'192.168.33.10');
 11 console.log("server listening...");

$node server.js

実行して、http://192.168.33.10:1337にアクセスするとページが表示される。

設定を外部ファイルから読み込む

settings.jsという名前で、以下のようなファイルを作る。

exports.port = 1337;
exports.host = '192.168.33.10';

server.jsは次のように修正

var http = require('http'),
var settings = require('./settings');//.jsはなくてもいい
var server = http.createServer();
//
server.on('request', function(req,res){
  //レスポンス用のヘッダーを作る

    res.writeHead(200,{'Content-Type': 'text/plain'});
    res.write('hello world!');
    res.end();
  });
});
//settings.変数名で利用できる
server.listen(settings.port,settings.host);
console.log("server listening...");

これで、外部ファイルから変数を読み込めた。

URLによって処理を変える

var http = require('http'),
var settings = require('./settings');
var server = http.createServer();
//
server.on('request', function(req,res){
  //レスポンス用のヘッダーを作る
  //req.urlでリクエスト側のURLを取得できる
   switch(req.url){
     case '/about':
      msg = "about this page";
      break;
     case '/profile':
      msg= "about me";
      break;
    default:
      msg = "wrong page";
      break;
   }
  res.writeHead(200,{'Content-Type': 'text/plain'});
  res.write(msg);
  res.end();
});

server.listen(settings.port,settings.host);
console.log("server listening...");

HTMLファイルを読み込む

適当にHTMLファイルを用意します。
jsファイルがあるディレクトリ内に、public_htmlというディレクトリを作成。
その中にHTMLファイルをぶち込みます。
名前はhello.html。

<html>
  <h1>hello</h1>
</html>

で、server.jsを以下のように変更。

//fs(FileStreamのこと)を読み込む
var http = require('http'),
    fs = require('fs');
var settings = require('./settings');
console.log(settings);
var server = http.createServer();
var msg;
//
server.on('request', function(req,res){
  //レスポンス用のヘッダーを作る
  //fs.readFileでファイルを読み込む。__dirnameはこのjsファイルの現在のディレクトリを指す。
  //読み込んだファイルはdataという変数に格納される。
  //コールバック関数を使って、ファイルがちゃんと存在すれば、dataをwriteメソッドに突っ込んであげることで表示が可能となる。
  fs.readFile(__dirname + '/public_html/hello.html' ,'utf-8' , function(err,data){
  if(err){
    res.writeHead(404,{'Content-Type': 'text/plain'});
    res.write('not found!');
    return res.end();
  }
  
  res.writeHead(200,{'Content-Type': 'text/html'});
  res.write(data);
  res.end();
  });
});
server.listen(settings.port,settings.host);
console.log("server listening...");

以下のようになります。まあ画像で表示するまでもないけど。

f:id:osamtimizer:20150925000139p:plain

npmでテンプレートエンジンをインストール

NodePackageManagerというシロモノで、まあ名前の通りnode.js用のパッケージマネージャです。
今回使うのはejs。

$npm install ejs

でインストール。

ちなみに、グローバル環境にインストールしたい場合は、

-g

オプションでグローバル対象。
基本は今のフォルダにインストールする感じで良い。

すると、現在のディレクトリに、node_modules/ejsというディレクトリが追加される。

テンプレートはpublic_htmlフォルダに突っ込む。

hello.ejsというファイルを作り、テンプレートを記述していく。

<html>
<!-- "="はエスケープする-->
<h1><%= title %></h1>
<!-- "-"は変数内の記号をエスケープしない-->
<p><%- content %></p>
<p><%= n %> views</p>
</html>

erbとほとんど記述一緒っすね。

server.jsでテンプレートを読み込むようにしてやる。

//ejsを追加
var http = require('http'),
    fs = require('fs'),
    ejs = require('ejs');
var settings = require('./settings');
console.log(settings);
var server = http.createServer();
//readFileSyncはブロッキング処理だが、問題はない
var template = fs.readFileSync(__dirname + '/public_html/hello.ejs','utf-8');
var n = 0;
server.on('request', function(req,res){
//nはカウント用の変数
  n++;
//ejs.renderの引数は1:テンプレート、2:テンプレートに渡す変数
  var data = ejs.render(template,{
    title : "hello",
    content : "<string>World!</strong>",
    n: n
  })
  res.writeHead(200,{'Content-Type': 'text/html'});
  res.write(data);
  res.end();
});
server.listen(settings.port,settings.host);
console.log("server listening...");

これで、リロードするたびにカウントアップするページが作れる。
(当然、サーバを一旦落とすとリセットされる)

f:id:osamtimizer:20150925001855p:plain

今回はここまで。