サイトアイコン 上尾市のWEBプログラマーによるブログ

「JavaScriptエンジニアのためのNode.js入門」の感想・備忘録

Kindle本「JavaScriptエンジニアのためのNode.js入門」のまとめ。

点数

77

感想

Node.js超入門と似たような内容だが、こちらはページ数が少ないこともあり大雑把な説明だった。
cookie-parserなど、こちらにしか書かれていないなこともあった。
2つの書籍を読んだことで、理解度をアップすることができたと思う。

静的ファイルの供給

Node.jsだけ(Expressを使わない)でcss、js、画像などを返却する場合、ストリームを使う。

var http = require('http');
var url = require('url');
var fs = require('fs');

var server = http.createServer(function(req, res){
    var urlParts = url .parse(req.url);
    var path = __dirname + '/' + urlParts.pathname;
    var stream = fs.createReadStream(path);
    stream.on('data', function(data){
        res.write(data);
    });
    stream.on('end', function(data){
        res.end();
    });
    stream.on('error',function(err) {
        console.log("something wrong");
    });
});
server.listen(1234);
// http://localhost:1234/xxx.txtでxxx.txtを表示

__dirnameはソースコードが格納されているディレクトリパスが格納されている組み込み変数

静的ファイルの供給その2

ストリームオブジェクトのpipeメソッドは、引数で渡されたオブジェクトに読み込んだデータを流し込んでくれる。
pipeメソッドの詳しい解説は割愛するが「静的ファイルの返却にはストリームのpipeメソッドを使うべき」と覚えておくとよい。
完了時には内部でレスポンスオブジェクトのendメソッドを呼んでくれる

var http = require('http');
var url = require('url');
var fs = require('fs');

var server = http.createServer(function(req, res){
    var urlParts = url .parse(req.url);
    var path = __dirname + '/' + urlParts.pathname;
    var stream = fs.createReadStream(path);
    stream.pipe(res);
});
server.listen(1234);

cookie-parser

cookie-parserライブラリを使うとクッキーの扱いが楽になる。

Expressバージョン3まではexpress.cookieParserとして組み込まれていたが、バージョン4から独立した

var express = require('express');
var ejs = require("ejs");
var app = express();
var cookieParser = require('cookie-parser');

app.engine('ejs',ejs.renderFile);
app.use(cookieParser());
app.get('/', function(req, res){
    var cnt = req.cookies.cnt == undefined ? 0 : req.cookies.cnt;
    cnt++;
    res.cookie('cnt', cnt, {maxAge: 5000});
    res.render('app.ejs', {cnt: cnt});
});
var server = app.listen(1234, function(){
    console.log('サーバを起動しました');
});
<html lang="ja">
<head>
  <meta charset="utf-8">
  <link type="text/css" href="./style.css" rel="stylesheet">
</head>
<body>
<p>テストページ</p>
<p>cnt:<%=cnt %></p>
</body>
</html>
モバイルバージョンを終了