back

ExpressでWebアプリケーションを自動生成する (4/6)

■メインプログラム「app.js」について

では、作成されたWebアプリケーションを見ていきましょう。まずはマインプログラムである「app.js」からです。下のリスト欄に内容を掲載しておきました。結構な長さがありますね。ポイントをピックアップして説明していくことにしましょう。

1. ライブラリのロード
var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/users');
最初に行なっているのは、ライブラリのロードです。各種ライブラリをロードし、以下のような変数に保管しています。

express――これがExpressオブジェクトの変数です。
path――Pathオブジェクトです。
serve-favicon――favicon（Webページに付けられるアイコンデータ）に関するものです。
morgan――ログ出力に関するオブジェクトです。
cookie-parser――クッキーの利用に関するオブジェクトです。
bodyParser――ボディ部分のパース処理に関するオブジェクトです。

routes――「routes」フォルダに設置してあるindex.js内のオブジェクトです。この内容は後で説明します。
user――「routes」フォルダに設置してあるuser.js内のオブジェクトです。これも後で触れます。

最後の２つは、モジュールではなくて、アプリケーション内に用意されているスクリプトファイルをロードするものです。requireで、こんな具合に他のスクリプトをロードできるのですね。

ずいぶん、いろいろなモジュールがロードされていますが、実はロードされているのはこれだけではありません。アプリケーションを起動するためのwwwには、以下のような文が書かれています。
var app = require('../app');
var debug = require('debug')('helloexpress:server');
var http = require('http');
これで、このapp.jsスクリプトと、デバッグに関するオブジェクト、そしてhttpオブジェクトが用意されます。これらすべてが揃ってアプリケーションを構築しているのですね。

2. express関数でApplicationを作成する
var app = express();
express関数でApplicationオブジェクトを作成します。これは前回と同じですね。

3. 各種のアプリケーション設定を行う
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

その後に、app.set～とかapp.use～とかいった文がずらっと並んでいますが、これは各種のアプリケーションの設定を行なっている部分です。これらは、とりあえずユーザーがあれこれ編集することはないでしょう。間違えて書き換えたりしないように注意してください。

4. getでルート設定をする
app.use('/', routes);
app.use('/users', users);
getで、'/'と'/users'のアドレスにそれぞれroutesとusersを設定しています。このroutesとusersは、さっき出てきましたね？　「routes」フォルダ内にあるindex.jsとusers.jsをそれぞれrequireでロードしたものをおさめた変数でした。

これらの変数をuseで設定することで、指定のアドレスにスクリプトを割りつけているのです。すなわち、'/'にアクセスがあったら「routes」内のindex.jsが、'/users'にアクセスがあったらusers.jsが、それぞれ実行されるようになるわけです。

5. エラー処理の設定
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});
app.use、if文、またapp.useと続きますが、これらはエラーに関する処理を行うためのものです。これらも、特にユーザーが触る部分ではありません。とりあえず忘れていい部分ですね。

6. アプリケーションを設定する
module.exports = app;
最後に、作成したappオブジェクトを、module.exportsに代入します。これでアプリケーションが設定され動くようになります。

途中、いきなり難しそうな処理がずらっと出てきたりもしましたが、すべて理解する必要はまったくありません。全体の流れとして、ごくざっと「こんな感じで処理がされているんだ」ということが把握できれば今は十分でしょう。



(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

var express = require('express');
var path = require('path');
var favicon = require('serve-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');

var routes = require('./routes/index');
var users = require('./routes/users');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

// uncomment after placing your favicon in /public
//app.use(favicon(__dirname + '/public/favicon.ico'));
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', routes);
app.use('/users', users);

// catch 404 and forward to error handler
app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

// error handlers

// development error handler
// will print stacktrace
if (app.get('env') === 'development') {
  app.use(function(err, req, res, next) {
    res.status(err.status || 500);
    res.render('error', {
      message: err.message,
      error: err
    });
  });
}

// production error handler
// no stacktraces leaked to user
app.use(function(err, req, res, next) {
  res.status(err.status || 500);
  res.render('error', {
    message: err.message,
    error: {}
  });
});

module.exports = app;



　 　

記事のリストに戻る



PC Site G+ mail
copyright 2009. SYODA-tuyano.