深追い Fukaoi.org

動画アップロードシステムをNode.js、MongoDB、Expressで作ってみた

2012-02-01T12:23:02+00:00

Node.jsの勉強の為にNode.js、MongoDB、Expressで作った「動画アップロードシステム」のソースを晒してみます。もともとは、このサイトVideo Upload With Node.js, Express And Mongodb step-by-stepでソースが公開されていたので、写経のつもりで書き始めたんだけど、写経した段階ではBugってたりして動かなかった。いろいろと修正をして、せっかくので日本語版に置き換え、ちょっとした機能追加をしたのが下記ソースになる。

動画環境

次の環境で確認しています

Node.js：v0.4.12、 v0.6.8

MongoDB：v1.4.4

修正箇所

原文ではcssのテンプレートエンジンstylusを使うようになっていたが、通常のCSSでコーディングした

テンプレートエンジンをejsにするための指定

style.cssのデザイン変更

日本語へのローカライズ

RegProviderのrequire方式の変更

app.post('/videos')でのネスト構造が深かったので、リファクタリング

app.post('/videos')でそもそもPOSTデータを受け取れなかったので、正しい形式に修正

動画アップロード時のプログレス状況を、req.form.on('progress')で取得できるようにした

その他細かいBug修正など

動画アップロードシステムのソースコード

app.js(Webのエントリポイント)

    /**
     * Module dependencies.
     */
    var express = require('express'),
        form = require('connect-form'),
        mongoose = require('mongoose'),
        util = require('util'),
        sys = require('sys'),
        fs = require('fs'),
        routes = require('./routes'),
        ejs = require('ejs'),
        Post;

    var app = module.exports = express.createServer(
            form({keepExtensions: true}));

    //====== Configuration =======//
    app.configure(function() {
        app.set('views', __dirname + '/views');
        app.set('view engine', 'ejs');
        app.use(express.bodyParser());
        app.use(express.logger());
        app.use(express.methodOverride());
        app.use(app.router);
        app.use(express.static(__dirname + '/public'));
        app.use(express.errorHandler({
            dumpExceptions: true,
            showStack: true
        }));
    });

    app.configure('development', function() {
        app.use(express.logger());
        app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
    });

    app.configure('production', function() {
        app.use(express.errorHandler());
    });

    //====== Mongoose object =======//
    var RegProvider = require('./regprovider').RegProvider;

    //====== Index page =======//
    app.get('/', function(req, res) {
        RegProvider.findAll(function(req, posts) {
            res.render('index',
                {locals: {title: 'Mongo Node.js 動画アップロード',
                    posts: posts}});
        })
    });

    //====== Create video file =======//
    app.get('/videos/new', function(req, res) {
        res.render('reg_new',
            {locals: {title: '新規アップロード'}}
        );
    });

    //====== Update video =======//
    app.post('/videos', function(req, res, next) {
        req.form.complete(function(err, fields, files) {
            console.log('here i go');
            if (err) return next(err);

            ins = fs.createReadStream(files.file.path);
            console.log('filename:' + files.file.filename);
            ous = fs.createWriteStream(__dirname + '/public/uploads/videos/' + files.file.filename);
            util.pump(ins, ous, function(err) {
                if (err) return next(new Error(err));

                RegProvider.save({
                    filename: fields.filetitle,
                    file: files.file.filename
                }, function(error, docs) {
                    res.redirect('/')
                });
            });
        });

        req.form.on('progress', function(bytesReceived, bytesExpected) {
            var percent = (bytesReceived / bytesExpected * 100) | 0;
            console.log('Uploading: ' + percent + '%');
        });
    });



    //====== Show uploaded video =======//
    app.get('/posts/:id', function(req, res) {
        RegProvider.findById(req.param('id'), function(error, post) {
            res.render('reg_show', {
                locals: {
                    title: '詳細ページ',
                    post:post
                }
            });
        });
    });

    app.listen(3000);
    console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env);

regprovider.js(Mongooseモジュールを使ってMongoDBにアクセス)

var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost/test');

var Schema = mongoose.Schema,
    ObjectId = Schema.Objectid;

var Post = new Schema({
    filename: String,
    file: String,
    create_at: Date
});

mongoose.model('Post', Post);
var Post = mongoose.model('Post');

RegProvider = function(){};

RegProvider.prototype.findAll = function(callback) {
  Post.find({}, function(err, posts) {
          callback(null, posts)
      });
};

RegProvider.prototype.findById = function(id, callback) {
  Post.findById(id, function(err, posts) {
          callback(null, posts)
      });
};

RegProvider.prototype.save = function(params, callback) {
    var post = new Post(
        {filename: params['filename'],
         file: params['file'],
         create_at: new Date().toLocaleString().toString()});
        post.save(function(err) {
           callback();
        });
};
exports.RegProvider = new RegProvider();

views/layout.ejs(レイアウト)

    <html>
     <head>
      <link href="/stylesheets/style.css" media="screen" rel="stylesheet" type="text/css" />
     </head>
     <body>
      <h1><%= title %> ページ </h1>
      <h2 class="navi"><a href="/">Home</a></h2>
      <h2 class="navi"><a href="/videos/new">新規アップロード</a></h2>
     <%- body %>
     </body>
    </html>

views/index.ejs(TOPページデザイン)

        <div id="articles">
         <%- partial('reg', posts) %>
        </div>

TOPページイメージ図

views/reg.ejs(TOPページ用ループ表示デザイン)

    <div class="post">
        <div class="columHead">■<%=reg.filename %></div>
        <div class="colum"><a href="/posts/<%=reg.id %>"><%=reg.file %></a></div>
        <div class="colum"><%=reg.create_at %></div>
    </div>

TOPページ用ループイメージ図

views/reg_new.ejs(動画登録ページデザイン)

    <form method="post" action="/videos"  enctype="multipart/form-data">
        <div class="post">
            <p>
                <span>ファイル名: </span>
                <input type="filename" name="filetitle" />
            </p>
            <p>
            <span>アップロードファイル: </span>
            <input type="file" name="file"/>
            </p>
            <p>
                <input type="submit" value="Upload" />
            </p>
    </div>
    </form>

動画登録ページイメージ図

views/reg_show.ejs(動画再生ページデザイン)

    <div class="post">
        <div class="columHead">■<%=reg.filename %></div>
        <div class="colum"><a href="/posts/<%=reg.id %>"><%=reg.file %></a></div>
        <div class="colum"><%=reg.create_at %></div>
    </div>

動画再生ページイメージ図

public/stylesheets/style.css(CSS)

 body {
    padding: 50px;
    font: 14px "Lucida Grande", Helvetica, Arial, sans-serif;
}

a {
    color: #00b7ff;
}

.post {
    float: left;
    width: 800px;
    margin: 20px;
    border-top: dashed 2px;
}

.navi {
    margin: 1em 1em 1em 3em;
    float: left;
}

.navi a {
    color: #808080;
}

.columHead {
    font-size: 17px;
    padding: 5px;
}

.colum {
    padding: 5px;
}

プログレス状況とはこんな感じの出力がコンソールに出力される

Uploading: 0%
Uploading: 0%
Uploading: 1%
　　.
　　.
　　.
Uploading: 99%
Uploading: 99%
Uploading: 99%
Uploading: 100%
here i go
filename:animal.mp4

ソースを追いながら、書き写して動作させるだけなら、3時間ほどでできる、、、と思う。ソースコード一式をGitHubにUPしてあるので、Node.js、MongoDBがインストールされている環境ならすぐに動作すると思うので、ご自由にどうぞ

サーバーサイドJavaScriptで簡単Webアプリ開発　- バッチ処理開発編

2011-06-17T16:46:34+00:00

「Webフロント開発編(3)」に続き、最後の開発工程になるGoogle Calendar APIをたたいてmemberテーブルとマッチする検索キーワードが存在した場合にメール通知を行うバッチ処理プログラムを開発します

バッチ処理の作成

Google Calendarに接続するための各種jarファイルの取得

ダウンロード＆解答して以下のjarファイルを$RINGO_HOME/libにおきます

gdata-calendar-2.0.jar

gdata-client-1.0.jar

gdata-core-1.0.jar

guava-r09.jar

http://code.google.com/p/gdata-java-client/downloads/からgdata-src.java-1.45.0.zip 
http://code.google.com/p/guava-libraries/downloads/listからguava-r09.zip 
よりダウンロードして解凍する

バックコマンドプログラムの雛型

バッチ処理を行うbatch.jsの雛型を作成します。RingoJSのルール的にコマンドで動作させるバッチ用のプログラムは、if (require.main === module) {　でくくるようです。

[batch.js]

/**
 * メイン処理
 */
var main = function() {
  //ここにメイン処理を記述する
};

/**
 * mainファンクションを呼び出す
 */
if (require.main === module) {
  try {
      main();      
    }
  } catch (error) {
    print(error);
  }
}

MemberオブジェクトにgetBatchInfo()メソッドを作成

status=activeの対象データーをオブジェクトで返します。これも前に実装したようにO/Rマッパを使って実装します

[model.js]

  /**
   * バッチで使用する対象データーをDBから取得する
   */
  getBatchInfo: function() {
    var result = this.loadObject.query()
        .equals('status', 'active').select();
    return result;
  }

mainファンクションの処理フロー

memberテーブルより登録されている勉強会キーワードをgetBatchInfo()を使用して、取得してループ毎に処理したいと思います。mainファンクションに必要なデーターとして、「メールアドレス」、「ユニークID」、「勉強会キーワード」を渡したいと思います

[batch.js]

/**
 * mainファンクションを呼び出す
 */
if (require.main === module) {
  try {
    var results = Member.getBatchInfo();
    for each(var result in results) {
      main(result.email, result.uid, result.keyword);      
    }
  } catch (error) {
    print(error);
  }
}

config.jsに対象となるカレンダーのURLを追記する

IT勉強会のURLをconfig.jsで定義しておきます

[config.js]

exports.calendarUrl = 'http://www.google.com/calendar/feeds/fvijvohm91uifvd9hratehf65k%40group.calendar.google.com/public/basic';

必要なファイルのrequireとインスタンスの生成

GDATA関連のクラスはファイル先頭でインスタンスを生成してしまいます。mainファンクション内で生成しても問題ないと思います

[batch.js]

var {Response} = require('ringo/webapp/response');
var {Member} = require('./model.js'); 
var config = require('./config.js');
var {Service} = require('./service.js');

//// {}くくって、DateTimeオブジェクトをセット
var {DateTime} = com.google.gdata.data;

//// カレンダー検索クエリオブジェクトをセット
var cservice = com.google.gdata.client.calendar.CalendarService("");

//// config.jsに定義されたIT勉強会のURLを取得して、URLオブジェクトでラップ
var eventFeedUrl = java.net.URL(config.calendarUrl);
var query = com.google.gdata.client.calendar.CalendarQuery(eventFeedUrl);
var events = com.google.gdata.data.calendar.CalendarEventFeed().class;

検索対象期間を定義する

とりあえず、現在～3か月後を対象にするため、60日間を定義したいと思います

[config.js]

exports.durationDays = 60;

検索期間をコンバートするメソッドの追加

JavaのSimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss'Z'")クラスを使って、gdataのフォーマットに指定します。いったんミリ秒にしてからフォーマットかけています

[service.js]

var simpleFormat = java.text.SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss'Z'");

/**
 * 検索対象期間のDateTimeを取得する
 */
exports.Service.searchTerm = {
  sd: simpleFormat, 
  start: function() {
    return this.sd.format(new Date());
  },
  end: function() {
    var duration = config.durationDays * 24 * 60 * 60 * 1000;
    var now = new Date().getTime();
    return this.sd.format(new Date(now + duration));
  }
};

カレンダーへ検索ワードを投げて、結果取得

ここは特に説明のしようがなくて、GDATAのAPI仕様どおりにパラメーターをセットするだけです

[batch.js]

/**
 * メイン処理
 */
var main = function(email, uid, keyword) {
  var entry = "", content = "", text = "";
  query.setFullTextQuery(keyword);
  query.setMinimumStartTime(
    DateTime.parseDateTime(Service.searchTerm.start()));
  query.setMaximumStartTime(
    DateTime.parseDateTime(Service.searchTerm.end()));

  var resultFeed = cservice.query(query, events);

検索結果が空だった場合

resultFeedのエントリー数を調べて0だった場合は処理を中断します

[batch.js]

  var count = resultFeed.getEntries().size();

  if(count === 0) {return;}

バッチ用メールテンプレート作成

いままで作成してきたメールテンプレートと同じように作成するのですが、今回はループして同じテンプレートを何回もよみだしますので、batch.tplとは別にbatchPart.tplという繰り返し用のテンプレートにわけています

[skins/email/batchPart.tpl]

----------------------------------------
タイトル：<% studyTitle %>
<% plainText %>

[skins/email/batch.tpl]

バッチで使用します、メールフォーマットの全体テンプレートになります。textBodyにbatchPart.tplを使って生成されたデータが渡されてきます

IT勉強会サーチメール

このキーワードにマッチした勉強会は以下のとおりです

[<% keyword %>]

<% textBody %>


====================================================
今後、このメールが不要な方は、下記URLをクリックして下さい
<% withdrawUrl %>
====================================================

バッチ用メールフォーマットメソッド追加

skins/email/batchPart.tpl用メソッドになります

[service.js]

   batchPart : function(studyTitle, plainText) {
    return Response.skin(module.resolve
                         ('skins/email/batchPart.tpl'),
                         { studyTitle: studyTitle,
                           plainText: plainText}).body;

skins/email/batch.tpl用メソッドになります。退会用のリンクもメールに添付するため、withdrawというアクションを用意します。withdrawについては、後ほど作成します

[service.js]

  batch : function(uid, keyword, text) {
    return Response.skin(module.resolve
                         ('skins/email/batch.tpl'),
                         { keyword: keyword,
                           withdrawUrl: config.fqdn 
                           + "/withdraw?uid=" + uid,
                           textBody: text}).body;
  },

メール用整形メソッドの追加

GData calendarのSummaryデーターを人間の目でみて読みやすい形に変換します。

[service.js]

  /**
   * GData calendarのSummary的な値を読みやすい形に加工する
   */
  modifySummary : function(content) {
    var CR = "\r\n";
    return content.replace(' JST ', CR)
        .replace('予定のステータス: 確定', '')
        .replace('予定の説明", "詳細内容') + CR;       
  }
};

検索でマッチしたデータをループして、Service.modifySummary()に渡して、メールで読みやすい形式に変換します

resultFeed.getEntries().get(i)でマッチしたentryオブジェクトの中から1個取得します。entry.getTextContent().getContent().getPlainText()で取得した検索結果をテキスト形式にコンバートします。

[model.js]

  for (var i = 0; i < count; i++) {
    entry = resultFeed.getEntries().get(i);
    text += Service.textFormat.batchPart(
      entry.getTitle().getPlainText(),
      Service.modifySummary(entry.getTextContent()
                            .getContent()
                            .getPlainText())
    );
  }

メール送信

上記で作成した Service.textFormat.batch()に必要な値を渡してメールを送信します

[model.js]

  var textFormat = Service.textFormat.batch(uid, keyword, text);
  Service.sendMail(email, textFormat);

以下のようなメールが飛べば、成功です。

退会処理

退会処理メソッドの追加

uidをキーにmemberテーブルにマッチするデータがあれば、statusカラムをactiveからinactiveにupdateします。inactiveになることで次回のバッチ処理の対象外とします。

[model.js]

  /**
   * 退会処理
   */
  withdraw: function(uid) {
    var result = this.loadObject.query()
        .equals('uid', uid).select();
    result[0].status = 'inactive';
    result[0].save();  
  },

withdrawアクションの追加

Member.withdraw()をよびだしてステータスをアップデートし、メールを送信するだけのシンプルな処理になります。特に退会用のhtmlテンプレートは用意せず、登録完了時に使用した、skins/complete.htmlを再利用し、退会用メッセージを引数に渡すだけにしたいと思います。

[action.js]

/**
 * withdraw page
 */
exports.withdraw = {};
exports.withdraw.GET = function(req) {
  var uid = req.params['uid'];
  if (uid === "") {
    return Response.skin(module.resolve('skins/complete.html'), 
    { title: 'エラー',
      errorMessage: 'URLに問題があります'});
  }

 Member.withdraw(uid);
  return Response.skin(module.resolve('skins/complete.html'), {
    title: '退会が完了しました',
    headMessage: '今後、IT 勉強会サーチメールは送信されなくなります'
  });

以下のページが表示されれば、無事退会処理されたことになります

簡単Webアプリ開発完了

以上がバッチ処理機能の開発になります。簡略化された処理もありますが、「サーバーサイドJavaScriptで簡単Webアプリ開発」ひととりやりたいことは網羅できたと思いますので、完了としたいと思います。このブログで使用したソースコード一式はGitHubにUPしてありますので、もしよろしければ見てみてください。

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(3)

2011-06-16T22:30:59+00:00

「Webフロント開発編(2)」に続き、本編ではメールに添付された登録完了(complete)機能の開発を行います。メール内にリンクされたURLが登録完了処理のURLになります。リンクをクリックして、GETでuidを取得して会員ステータスを保留(waiting)から有効(active)に変更します

登録完了処理の作成(http://localhost:8080/completeの処理)

action.jsにcompleteメソッドを追加する。GETプロパティを追加する

[action.js]

/**
 * complete page
 */
exports.complete = {};
exports.complete.GET = function(req) {

  //処理を記述する

};

リクエストパラメータのチェック

リクエストオブジェクトからuidの存在の有無をチェックします。ここもチェック処理自体は最小限にとめておきます。

[action.js]

  var uid = req.params['uid'];
  if (uid === "") {
    return Response.skin(module.resolve('skins/complete.html'), {
      title: 'エラー',
      errorMessage: 'URLに問題があります'});
  }

memberテーブルのstatusをactiveに更新

GETで渡ってきたuidにマッチするuidのレコードをmemberテーブルよりselect()メソッドでひっぱってきて、'active'という文字列をセットしてsave()メソッドで保存します。selectした結果オブジェクトを使って、save()メソッドを実行すると、データーの更新が可能になります

[model.js]

  /**
   * 登録完了処理
   */
  complete: function(uid) {
    var result = this.loadObject.query()
        .equals('uid', uid).select();
    result[0].status = 'active';
    result[0].save();  
  },

登録完了HTMLテンプレート作成

messageを表示するだけのシンプルなものを用意します

[skins/email/complete.html]

<% extends ./base.html %>

<% subskin content %>
<div id="header"><h1><% title %></h1></div>
<div id="body">
<p id="message"><% errorMessage %></p>
<h3><% headMessage %></h3>
</div>

Member.complete()メソッドを呼び出す

特に目新しい処理はなく、上記で作成した、Member.complete()メソッド、complete.htmlテンプレートをセットします。

[action.js]

  Member.complete(uid);
  return Response.skin(module.resolve('skins/complete.html'), {
    title: '登録が完了しました',
    headMessage: '今後、検索ワードにマッチした勉強会をメールでお知らせ致します'
  });
};

メールに記述されたリンクをクリック

「Webフロント開発編(2)」で飛ばしたメールのリンクをクリックしてみると内部でaction.jsのcompleteメソッドが呼びだされ、memberテーブルの更新、登録完了ページの表示を行います。更新後の処理は以下の画像で確認できます


メールに記述されていた内容のピックアップ

[登録完了URL]
http://localhost:8080/complete?uid=cb18972392a103ae3903a1b70692613b

[uid]
cb18972392a103ae3903a1b70692613b




memberテーブルをselectしますと、statusがwaitingからactiveに
更新されているのが確認できました
↓↓↓

登録完了ページが表示され、メッセージが表示されています

以上が登録完了機能の開発になります。次編からバッチ処理の開発に入ります。

次のステップへ
バッチ処理開発編へ

node.JS VS RingoJS 比較サイトまとめ

2011-06-11T17:21:41+00:00

node.JSとRingoJSという2つのサーバーサイドJavaScriptが有名(node.JSの方が遥かに知名度は上)ですが、「どっちを使うべきなのか？」という話をtwitterで見かけました。実際、周りでも同じような意見を聞きます。僕自身は、RingoJSについて「サーバーサイドJavaScriptで簡単Webアプリ開発」でも書き始めたように、最近ちょくちょく触りだしているのでなじみがあります。node.JSについては、「hello world」どまりで、比較しようにも比較できない状況でした。そこでネットで調べてた所、海外のブログサイトでnode.JSとRingoJSの比較内容が書かれたブログが2つあったので、自分なりに訳してまとめてみました。

参考にしたブログ

どちらも2010年7月、9月に書かれているので、内容は若干古くとなっているところもあると思います。(特にnode.JSに関してはupdateスピードが早いので)

nodejsbot RingoJS and Node.js

ブログ名から察するにnode.JSラブな人が書いているんだと思いますが、node.JSだけに偏った意見ではなく、RingoJSについてもわりと公平に比較されていたと思います。

gmosx RingoJS vs NodeJS

こちらはブログ件名とは異なり、RingoJSの長所を中心に書かれおり、比較はあまりされていませんでした。そのせいか、コメント欄では、色々と反論されており、その投稿した人の反論からnode.JSのメリットをひっぱりあげました

まとめた比較情報の多くはnodejsbotを参考にさせてもらいました

node.JSについて

短所

C++のアドオンをコンパイルするのに管理者権限が必要になる
レンタルサーバとかで一般ユーザ権限しか貸与されてないとコンパイルできない可能性があるということだと思います

Windows上で動作させるには注意が必要である
たぶんブログが書かれた当時はnode.JSのWindows対応がいまいちだったのではないかと推測しました。LinuxとWindowsにnode.jsをインストールしてみたによると最新のnode.JSとWindows7だと、簡単にインストールできるみたいです。なので以前の話かと思います

ノンブロッキングシステム(非同期)のコードは、スレッド、同期ベースのコードを書いてきた開発者にとって、制御のフローはなじみが薄い
JavaScriptをやり始めたころ、コールバックという処理に違和感を感じとことがあります。まぁこれも慣れれば便利なものに

過去の遺産からなる、様々なモジュールが存在していない
RingoJSでいう、Javaでできたライブラリの存在をさしていると思います。当然、V8エンジンという新しいミドルゥエアであるため、専用モジュール以外は存在していないですね

バージョンUPが速いので、利用者は古いバージョンに取り残されていくかもしれない
0.0.1がリリースされてから約10カ月の間に、0.4まであがっているのですごい勢いで更新されていますね。これはまだBetaバージョンに近い位置づけだから、現状はある意味しょうがないのではないでしょうか

長所

非同期APIによってクライアントサイド開発のようにイベント駆動型の開発が可能になる
短所でもでてきた内容の反対の理由ですね。node.JSの長所中の長所かと

シングルスレッドは多くの同期問題を回避できることを意味する
当たり前ですが、マルチスレッドならではの同期問題は発生しなくなりますよね

V8エンジンは高速でAPIは綺麗(google v8.hファイルを見る事で、悩んだ際の答えがほとんどのっている)
V8エンジンのソースを見た事はないのですが、Googleのスーパーエンジニアが設計コーディングしているのだから、いけている実装なんでしょうね

C++のアドオンで、何でもやりたいことは実現できる
C++ベースのV8環境なので、足りない機能があれば、C++で自分でアドオンを作成すればOKということでしょうね

APIはJavaScriptのクロージャを使用しており、楽をすることができる
クロージャ自身はJavaScriptの言語機能だから、node.JS固有のものでもないと思うのですが・・・

ローレベルのAPIは多くのAPIと比べて、簡単に複雑な実装が可能である
ローレベルAPIがどれをさすのか曖昧なので、よくわかりませんが、、、processやstreamのあたりのことでしょうか

イベント駆動型システムはスレッド型モデル(コンテキストの変更、メモリのオーバヘッド、ロッキングがある)と比較してすばらしい
コンテキストの変更はJ2EEモデルでの開発をさしているかと思います。確かにアプリケーションで修正するたびに、コンテキストの変更が発生するようなモデルだと、発狂しそうです。ちなみに、RingoJSではコンテキストを変更したりする事は基本的に無いです

ファイルディスクリプタの入出力は素晴らしい
たぶん、プロセス間でストリーム通信を行う際のファイルディスクリプタの扱いの効率性を指摘しているんじゃないのかなと思いました。badmathさんのnode.js とは何か (2)の記事を見て頂ければnode.JSの内部アーキテクチャの概要が理解できメリットが分かると思います。

メモリの消費量が少ない
シングルスレッド万歳！

コミュティは大きく、非常に活発で、フレンドリーである
これは意外に重要だと思いました。オープンソースアプリケーションの多くは利用するユーザによって、発展している歴史があるので

RingoJSについて

短所

JVM上でJavaScriptを実行しているので、node.JSの実行環境であるC++で書かれたV8エンジンより遅い
これも当たり前の事実だと思っていましたが、RingoJSとnode.JSでベンチマークをとったブログRingoJS vs. Node.js: Runtime Valuesによると、遅いどころか、node.JSよりパフォーマンスが良い結果もありました。node.JSが2010年9月のスナップショットで比較しているので、最新版だとどういう結果になるかは不明ですね

APIでJavaScriptらしいコーディングが使われていない
node.JSのコードと比べるとコールバックなど使わなくても実装できるので、そうかもしれないです。これはアーキテクチャが非同期モデルとスレッドモデルの違いもあると思います

ハイレベルAPIのコードがクライアントJavaScriptの記述と似ていない
ハイレベルAPIがどこを指すのか分からないのですが、この理由も上記に近いのではないでしょうか

アドオンについての情報が記載されていない。
node.JSではアドオン、RingoJSではパッケージの事を指しているんだと思うのですが、確かにnode.JSみたいにアドオン(パッケージ)の作成方法やルールなどが記載されたページはなかったです。

JVMを使用しているので、メモリを大量に消費しやすい
これはVMの弁慶の泣き所ですね。

長所

Javaを使ってアドオンの開発ができる、過去のJavaのライブラリなどを再利用可能
node.JSの長所でもあったように、RingoJSではベースがJavaなので、Javaを使っての機能拡張が可能です

JavaScript1.8の機能を使うことにより、より良いスクリプトがかける
RingoJSは内部でRhinoエンジンを使用しているので、Mozilla Foundationで開発されているJavaScriptの新機能の恩恵を受ける事ができるということですね

シングルプロセスの中で、複数のインスタンスを動作させることができる(V8エンジン上でも同じ事はやろうと思えばできるば、難しいだろう)
たぶん、マルチスレッドだといいたいんだと思います。マルチスレッド全盛の時代で、いまさら長所ポイントとしては弱い気が・・・

別スレッドで動作しているJavaScriptをsync()関数を使って、ブロック(同期化)することができる
sync()関数はRhinoエンジンが提供する関数で、Javaでの同期処理より簡単に書けるみたいです

JVM上で実行されるので、Google App Engine、自宅のPC、携帯電話などで動作する
自分もRingoJSを使用しようと思った際の決め手となったポイントです。多くのデバイスで動作する可能性というのは魅力的です

データーベースはテスト、サポートされたJavaライブラリを経由して行われる
実績があるJDBCを使用できることのメリットを言いたいんだと思います

デスクトップアプリケーションを作成する場合、GUI、マルチメディア、入出力のJavaライブラリを利用できる
これも上と同じように豊富なJavaライブラリの恩恵ですね

Javaのアドオンは素晴らしく、JVM上で動作するので安全である。JNIを使う事で、C++のライブラリも使うことができる
RingoJSでもやろとう思えば、なんでもできると思います

CommonJSに限りなく準拠している
node.JSよりRingoJSのほうが、CommonJSに準拠しているそうです

じゃあ、どっちをつかえばいいの？

正直それは僕にもよくわかりません(笑)。短所と長所をまとめていく過程で思った事は、node.JS、RingoJSはサーバーサイドJavaScriptという"枠組み"は同じではありますが、比較する対象としては相違点が多いというか、2つのミドルウェアの前提となる仕様の方向性が大きく違っており、比較対象にすべきではないように思いました。なのでプログラマがnode.JS、RingoJSの好きな方のスタイルを選択すればよいと思います。それでも、もしどちらかを選択しないといけなくなった場合、主観になってしまうですが「少ないリソースで大量のトラフィック(アクセス)をさばく必要がある場合はnode.JS」、「それほどトラフィックやリソースを気にする必要がない普通のWebアプリケーション開発ではRingoJS」という位でしょうか。後は、PaaSサービスやレンタルサーバなどの実行環境の制限も基準になりますよね。今の所、判断基準はこれくらいしか思いつかないです(汗)

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(2)

2011-05-30T00:20:31+00:00

「Webフロント開発編(1)」に続き、本編では登録画面からのデーターを処理する仮登録(confirm)機能の開発を行います。この開発では、ビジネスロジック、DBのエンティティ周りを別のプログラムファイル(service.js、model.js)に記述します。action.js内にすべての処理をまとめると可読性、保守性、再利用性が悪くなったりしますので。そのため「Webフロント開発編(1)」に比べ、作成するプログラムファイル、ソースコード数も多くなります。

テーブルスキーマ作成

登録ページから渡ってきたリクエストデータを保存するための、テーブルスキーマを設計します。Webアプリに登録するデーターを管理するということで、テーブル名はmemberにします

CREATE TABLE `member` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `email` char(40) NOT NULL 
        COMMENT 'メールアドレス', 
  `status` enum('waiting','active','inactive') NOT NULL 
        COMMENT '会員ステータス',
  `keyword` text NOT NULL 
        COMMENT '勉強会検索キーワード',
  `uid` char(40) NOT NULL 
        COMMENT 'email + keywordでユニーク性を持たせるためのID',
  `timestamp` timestamp NOT NULL DEFAULT 
        CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
  PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8

※statusカラムの状態の説明

waiting・・・仮登録状態のユーザ

active・・・登録が正常完了している有効会員

inactive・・・本サービスを退会、または無効となった会員

ビジネスロジックを担当するservice.jsを作成

POSTで渡ってくるリクエストデータの中から、email(Eメールアドレス)、keyword(勉強会を探すためのキーワード)をオブジェクトのプロパティにセットするため、下記のように定義します。trim()メソッドは入力時に全角半角スペースがkeywordの前後に含まれていた場合のトリミングするためのメソッドです。commpaReplace()メソッドは入力されたkeywordが複数あった場合に、AND検索にするため、Google Calendar APIに値を投げる前にカンマ区切りにデータを変更するためのメソッドです。

[service.js]

/**
 * action.js、batch.jsのビジネスロジックの
 * 定義 
 */

var config = require('./config.js');

exports.Service = {
  email: "",
  keyword: "",

  /**
   * トリミング(全角、半角のスペース削除)
   */
  trim : function(key) {
    return key.replace(/^\s+|\s+$/g, '');
  },

  /**
   * カンマ(,)でreplace
   */
   commaReplace: function(key) {
    return key.replace(/\s+/g, ',');
  }

};

DB Entityを担当するmodel.jsを作成

model.jsではmemberテーブルを操作するDB関係のメソッドを定義していきます。コーディング前に次の依存ライブラリが必要になりますのでダウンロードしてセットアップしてください

MySQLに接続するためのJava用JDBCドライバー

Javaのjarファイルは$RINGO_HOME/libに置くことでRingoJS内で呼び出すことができます。新しくjarファイルを追加する場合は忘れずにRingoJSの再起動を行っておきます

http://www-jp.mysql.com/downloads/connector/j/ より 
mysql-connector-java-5.1.16.tar.gzをダウンロードして解凍する

$ cp mysql-connector-java-5.1.16/mysql-connector-java-5.1.16-bin.jar $RINGO_HOME/lib

RingoJS用O/Rマッパライブラリ

RingoJSのパッケージインストラーを使い、ringo-sqlstore、ringo-storableをインストールします。ringo-storableはringo-sqlstoreの依存パッケージです。インストールが完了しますと$RINGO_HOME/packages/に置かれる

$ $RINGO_HOME/bin/ringo-admin install oberhamsi/ringo-sqlstore
$ $RINGO_HOME/bin/ringo-admin install hns/ringo-storable

MAPPING_MEMBER.propertiesでテーブルカラム情報を定義しています。Member.loadObjectプロパティを実行することでO/Rマッピングが行われます

[model.js]

/*
 * Databaseを操作する
 */

var config = require('./config.js');
var Store = require("ringo/storage/sql/store").Store;

/**
 * MySQLの接続情報
 */
var store = new Store({
  "url": config.db.url,
  "driver": config.db.driver,
  "username": config.db.username,
  "password": config.db.password
});

/**
 * Member Entity defined
 */
var MAPPING_MEMBER = {
  "table": "member",
  "properties": {
    "email": {"type": "string", "column": "email", "nullable": false},
    "status": {"type": "string", "column": "status", "nullable": false},
    "keyword": {"type": "string", "column": "keyword","nullable": false},
    "uid": {"type": "string", "column": "uid", "nullable": false}
  }    
};

/**
 * Memberオブジェクトの生成、各種メソッド定義
 */
exports.Member = {
  loadObject: store.defineEntity("Member", MAPPING_MEMBER),
};

config.jsにMySQLの接続情報を追加します

[config.js]

exports.db = {
  url: 'jdbc:mysql://localhost/test',
  driver: 'com.mysql.jdbc.Driver',
  username: 'hogehoge',
  password: 'fugafuga'
};

登録確認処理の作成(http://localhost:8080/confirmの処理)

action.jsにPOSTで値を受け取れる関数を作成するために、index処理の下にconfirmという名前でスケルトンを作成します。リクエストをGETで受けるときは、exports.confirm.GETと変更します

[action.js]

/**
 * confirm page (※POST Only)
 */
exports.confirm = {};
exports.confirm.POST = function (req) {

  //処理を記述する

}

exports.confirm = {};でオブジェクトを生成しています。この初期化がないと、以下のようなエラーメッセージがでて怒られます。

TypeError: Cannot set property "POST" of undefined to 
"org.mozilla.javascript.gen.actions_js_97@252a17" (actions.js#19)

model.js、service.jsのrequire

作成した、model.jsとservice.jsをコールすために、以下のrequire文をaction.jsの先頭に追加します。{}でくくることによって、model.js、service.jsの中にある指定したオブジェクトだけを呼び出すことができます。今回のmodel.js、service.jsともに1ファイルに1オブジェクトしかないので、あまりメリットが感じませんが、1ファイルに複数のオブジェクトが存在する場合は、使用しないオブジェクトはCallされないので、メモリ消費を抑えるメリットがでてくるんだと思います。

[action.js]

var {Member} = require('./model.js'); 
var {Service} = require('./service.js');

リクエストパラメータのチェック

action.jsに次のコードを追加します。Serviceオブジェクトのプロパティ(email, keyword)にリクエストパラメーターをセットします。その下で値が空かどうかのチェックを行っています。どちらかが空であった場合は、skins/index.htmlを呼び出し、テンプレートファイルのerrorMessage変数が赤色で出力されます。

本格的にサービスを運営する場合は、このチェックだけでは不十分ですので、Validationチェックを行う必要があると思います。ここでは時間の都合で最低限の値チェックしか行わないでおきます。

[action.js]

  Service.email = req.params['email'];
  Service.keyword = req.params['keyword'];
  if (Service.email === "" || Service.keyword === "") {
    return Response.skin(module.resolve('skins/index.html'), {
      title: 'エラー',
      errorMessage: '入力した値に問題があります、再度入力してください'
    });
  }

email、keywordを空にして、subimitを行い、エラー画面を表示してみます。赤丸で囲ったtitleの個所が「エラー」という文字に切り替わっており、errorMessageも赤色で「入力した値に問題があります、再度入力してください」表示されているのが確認できました

多重登録防止

多重登録が可能になってしまいますと、悪意ある第３者に登録確認のメールを利用したSpam装置に利用される危険性もあるので、ここでは多重登録防止機能を作成します。仕様的には、memberテーブルのstatus=waitingが同じメールアドレスで存在した場合は、エラーにしたいと思います。

model.jsに次のメソッドを追加します。equals('email',service.email).select()でservice.emailと同じemailアドレスがないかどうか探しにいっています。result変数は配列で中身がかえってきますので、配列が1件以上存在していて、中にwaiting状態であれば、falseとしてエラーにしています

[model.js]

  /**
   * メールアドレスをキーにして多重登録の有無を確認する
   */
  check: function() {
    var result = 
    this.loadObject.query().
        equals('email',service.email).select();

    if (result.length !== 0) {
      for each(res in result) {
        if (res.status === 'waiting') return false;
      }
    }
    return true;
  },

action.jsにMember.check()メソッドを追加してエラー処理を記述します。

[action.js]

  if (Member.check() === false) {
    return Response.skin(module.resolve('skins/index.html'), {
      title: 'エラー',
      errorMessage: '既に申し込み済みのメールが存在しております、' +
                    'お手元のメールを確認の上そちらを先に登録完了ください'
    });    
  }

DBへの仮登録処理

model.jsに次のconfirmメソッドを追加します。new this.loadObject()でオブジェクトを呼び出して、テーブルにinsertする値を代入していきます。keywordの代入では、Service.trim()メソッドで余計な空白を取り除き、複数のキーワードに対しては、カンマ区切りをService.commaReplace()メソッドで行っています。最後にinsertを行う、sqlstoreオブジェクトのsave()メソッドを実行しています。sqlstore自身Transactionも実行可能なのですが、今回は簡略化のため実装を省いています。

[model.js]

  /**
   * 仮登録処理
   */
  confirm: function(uid) {
    var member = new this.loadObject();
    member.email = Service.email;
    member.status = 'waiting';
    member.keyword = Service.commaReplace(Service.trim(Service.keyword));
    member.uid = uid;
    member.save();
  },

service.jsにユニークIDを生成するメソッドを追加します。時間をキーにハッシュ化してユニークIDにしたいと思います。ハッシュ化関数として、RingoJSのコアモジュールにデフォルトでバンドルされているstringsモジュールを使用します。このモジュールは名前からしてわかりますように、文字列を操作するライブラリ群になっており、digest()メソッドも存在しています。内部でjava.security.MessageDigestクラスをラップしており、MessageDigestクラスで対応しているハッシュアルゴリズム(MD5、SHA-256など)が使用可能です。MD5は解読される可能性が高いのでセキュリティ的にはSHA-256などを使用すべきだと思いますが、簡略させるためMD5を使用しています。特にハッシュアルゴリズムを指定しない場合、自動的にMD5になります。

[service.js]

var strings = require('ringo/utils/strings');

  /**
   * ユニークIDの作成
   */ 
  createUniqId: function() {
    return strings.digest(new Date().toString());
  },

action.jsに作成したMember.confirm()メソッドを実装したいと思います。uidを生成して、Member.confirm()メソッドに渡します

[action.js]

  var uid = Service.createUniqId();
  Member.confirm(uid);

メール送信処理

RingoJSのパッケージインストラーを使い、ringo-mailをインストールします。内部でjavax.mailをたたいているパッケージです

$ $RINGO_HOME/bin/ringo-admin install emilis/ringo-mail

service.jsにsendMail()メソッドを追加します。値が変わる箇所としては宛先(To)とメール本文(Body)なので、それは外部から値を受けれるようにしておきます。それ以外の宛先(From)と件名(Subject)は、今回は固定値にするため、config.jsに追加したいと思います

[service.js]

var email = require('ringo/mail');

  /**
   * 確認メールを入力されたメールアドレスに送信する
   */
  sendMail: function(to, body) {
    email.send({from: config.email.from, to: to, 
                subject: config.email.subject, text: body});   
  },

メールテンプレート作成

メールテンプレートもHTMLテンプレートの作成時に使用した、Response.skin()メソッドを使って実装しています。completeUrlはメール本文に出力される、登録完了ページ(次編で開発を行います)のURLになります。ユーザーを特定するためにURLのクエリストリングにuidを付属しDBにあるmemberテーブルのuidカラムとのマッチングを行うために使用します

[action.js]

var {Response} = require('ringo/webapp/response');

/**
 * メールフォーマットの作成
 */
exports.Service.textFormat = {
  confirm: function(uid) {
    var sv = exports.Service;
    return Response.skin(module.resolve
                         ('skins/email/confirm.tpl'),
                         { keyword: sv.commaReplace(sv.trim(sv.keyword)),
                           completeUrl : config.fqdn 
                           + "/complete?uid=" + uid}).body;
  },
};

Response.skin()メソッドはhtmlテンプレートだけでなく、どのようなタイプのテンプレートでも対応できるようになっているので、オリジナルのメール専用のテンプレートを作成して変数をセットしてあげるだけでOKです


　(1)HTMLテンプレートをセットする場合
  return Response.skin(module.resolve
                         ('skins/index.html')
  ↓
　(2)メールテンプレートをセットする場合
  return Response.skin(module.resolve
                         ('skins/email/confirm.tpl')

skins/email/confirm.tplを作成します

[skins/email/confirm.tpl]

＜IT 勉強会サーチメール＞にお申し込み有り難うございます。

ご入力頂きましたメールアドレスに対して登録確認のための
メールを自動送信しています。

----------------------------------
検索キーワード：<% keyword %>
----------------------------------

ご確認がとれましたら、下記URLにアクセスして登録を
完了してください。
(※本メールをお受け取りになりましてから、3日以内に
登録を完了しませんと無効となります)

<% completeUrl %>

尚、本メールにつきまして心あたりがない方は
お手数ですが、破棄していただけますでしょうか。

config.jsには次の値を追加します

[config.js]

exports.fqdn = 'http://localhost:8080';
exports.email = {
  from: 'it_study_search@fukaoi.org',
  subject: 'IT勉強会サーチメール'
};

actions.jsにメール送信する処理を実装

action.jsにメール送信のためにメールテンプレートから本文を作成して、それをService.sendMail()メソッドの第2引数として渡しています。そして仮登録のメッセージをResponse.skin()メソッドで設定しています。

[action.js]

 Service.sendMail(Service.email, Service.textFormat.confirm(uid));

  return Response.skin(module.resolve('skins/index.html'), {
    title: '受付致しました',
    headMessage: '入力いただいたメールアドレスに登録完了のURLを送信しました'
  });

実際に送信されたメールの内容です。検索キーワードとして「JavaScript 東京」と入力しました

仮登録完了したページは以下のように、テンプレートは共通のskins/index.htmlですが、赤丸で囲んだ個所で、title、headMessageの文言が上記設定したaction.jsのResponse.skin()メソッド内容に置き換わっていることが確認できます

以上が仮登録機能の開発になります。次編から登録完了ページの開発に入ります。

次のステップへ
Webフロント開発編(3)へ

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(1)

2011-05-27T19:10:27+00:00

「スタート編」に続き、本編ではWebアプリの作成を開始します。今回作成するWebアプリのお題としては、エンジニアならよくお世話になっている、IT勉強会サイトを使わせてもらおうと思います。希望する勉強会のキーワードと通知メールアドレスを、今回作成するWebアプリに登録することによって、IT勉強会サイトに、そのキーワードにマッチする勉強会が登録された場合、登録メールアドレスに対して勉強会の内容を連絡してくれるというアプリです。勉強会に参加しようと思っても、気になる内容のものがなかったり、気がついたときには人数が多くて参加できなかったりという過去の経験から思いつきました。

概要設計

まずなんといっても、サイト名を決定しないといけません。IT勉強会をサーチするということで、「IT勉強会サーチ」、プロジェクトコードを「it_study_search」にします。登録を行う側をWebフロント側とし、RingoJSを通して、MySQLのDBにメールアドレスと検索キーワード(探したい勉強会のワード)を登録します。検索キーワードは複数条件を指定でき、AND検索とします。DBに登録されているデータを１日１回Cronでチェックして、Google Calendar APIに対して、検索キーワードを投げてマッチする勉強会が無いかどうか調べ、マッチした勉強会があれば、登録されているユーザのメールアドレスに通知を行います。このCronで行う処理側をバッチ処理側と呼ぶことにします。下記にWebフロント側の画面遷移イメージをおこしたので添付します

（画面遷移イメージ）

RingoJSのコマンドラインで雛型生成

下記コマンドで、it_study_searchプロジェクトのアプリケーション雛型を作成します。ここでは特に説明は必要ないかと思います。スタート編に書いた、公式サイト First Stepsを見てもらえばわかると思います。

$RINGO_HOMEはRingoJSを設置したディレクトリをさします。

$ $RINGO_HOME/bin/ringo-admin create it_study_search

赤色のファイルが今回中身を実装するファイルとなります。雛形を作成した初期はもっとファイル数は少くなく、今後作成していくプログラムファイルが含まれています

it_study_search/  (Webアプリ プロジェクトディレクトリ)
       | 
       |-- README.txt
       |-- actions.js  (コントローラー プログラムファイル)
       |-- batch.js　　(バッチ処理 プログラムファイル)
       |-- config
       |   |-- jetty.xml
       |   `-- log4j.properties
       |-- config.js  (設定ファイル)
       |-- main.js    (アプリケーションのエントリポイント)　    
       |-- model.js   (DB Entity プログラムファイル)　
       |-- public
       |   `-- stylesheets
       |       `-- page.css  (共通CSSファイル)
       |-- service.js        (ビジネスロジック プログラムファイル)
       `-- skins
           |-- base.html
           |-- complete.html (登録完了ページのhtmlスキン)
           |-- email
           |   |-- batch.tpl     (バッチ処理全体のmailスキン)
           |   |-- batchPart.tpl (バッチ処理の部分mailスキン)
           |   `-- confirm.tpl   (仮登録ページのmailスキン)
           |-- error.html
           |-- index.html        (申し込み、仮登録ページのhtmlスキン)
           `-- notfound.html

コーディング開始

インデント

好みの問題なので、世間のオーソドックスなルールですとJavaScriptファイルのインデントはスペース4つが主流だと思いますが、ここではスペース2つでコーディングしています。

登録ページの作成(http://localhost:8080/indexのページ)

メールアドレス、勉強会検索キーワードを入力するための、登録ページをまず作成します。action.jsのexports.indexを以下のように変更します。title、headMessageがhtmlテンプレートファイルに渡す変数と値になります。テンプレートファイル側では<% %>で値を取得します。

[action.js]

var {Response} = require('ringo/webapp/response');

/**
 * index page
 */
exports.index = function (req) {
  return Response.skin(module.resolve('skins/index.html'), {
    title: 'IT勉強会サーチ',
    headMessage: '検索したい勉強会キーワードと受け取るメールアドレスを入力してください'
  });
};

テンプレートファイルの修正

つぎに、skins/index.htmlを修正してIT勉強会サーチのためのhtmlに変更します。下記のようにhtmlファイルを修正します

[skins/index.html]

<% extends ./base.html %>

<% subskin content %>
<div id="header"><h1><% title %></h1></div>
<div id="body">
<p id="message"><% errorMessage %></p>
<h3><% headMessage %></h3>
<form action="/confirm" method="post">
<p><input type="text" name="email" value="" size="50">&nbsp;&nbsp;：&nbsp;&nbsp;<input type="text" name="keyword" value="" size="50"></p>
<p>メールアドレス&nbsp;&nbsp;：&nbsp;&nbsp;検索キーワード</p>
<input type="submit" name="submit" value="送信">
</form>
<br />
<br />
<p>検索方法：</p>
<p>
検索キーワードをスペース区切りで入力する事により、<br />
AND検索になります。今のところOR検索はできません。
</p>
</div>

public/stylesheets/page.cssにエラーメッセージを赤色強調表示させるためのCSS記述を追加します

[public/stylesheets/page.css]

#message {
    color: red;
    font-size: 18px;
    font-weight: bold;
}

とりあえず起動

それではringoコマンドを使い、IT勉強会サーチアプリを起動させてます

$ $RINGO_HOME/bin/ringo it_study_search/main.js

http://localhost:8080/にアクセスすると、以下のような登録ページが表示されます

本編は登録ページのloadしかなかったので、特にロジカルな事はありませんでした、次編より、DB接続、メール送信などを使用する仮登録処理の開発に入ります

次のステップへ
Webフロント開発編(2)へ

深追い Fukaoi.org

動画アップロードシステムをNode.js、MongoDB、Expressで作ってみた

動画環境

修正箇所

動画アップロードシステムのソースコード

app.js(Webのエントリポイント)

regprovider.js(Mongooseモジュールを使ってMongoDBにアクセス)

views/layout.ejs(レイアウト)

views/index.ejs(TOPページデザイン)

views/reg.ejs(TOPページ用ループ表示デザイン)

views/reg_new.ejs(動画登録ページデザイン)

views/reg_show.ejs(動画再生ページデザイン)

public/stylesheets/style.css(CSS)

プログレス状況とはこんな感じの出力がコンソールに出力される

サーバーサイドJavaScriptで簡単Webアプリ開発 - バッチ処理開発編

バッチ処理の作成

Google Calendarに接続するための各種jarファイルの取得

バックコマンドプログラムの雛型

MemberオブジェクトにgetBatchInfo()メソッドを作成

mainファンクションの処理フロー

config.jsに対象となるカレンダーのURLを追記する

必要なファイルのrequireとインスタンスの生成

検索対象期間を定義する

検索期間をコンバートするメソッドの追加

カレンダーへ検索ワードを投げて、結果取得

検索結果が空だった場合

バッチ用メールテンプレート作成

バッチ用メールフォーマットメソッド追加

メール用整形メソッドの追加

検索でマッチしたデータをループして、Service.modifySummary()に渡して、メールで読みやすい形式に変換します

メール送信

退会処理

退会処理メソッドの追加

withdrawアクションの追加

簡単Webアプリ開発完了

サーバーサイドJavaScriptで簡単Webアプリ開発 - Webフロント開発編(3)

登録完了処理の作成(http://localhost:8080/completeの処理)

リクエストパラメータのチェック

memberテーブルのstatusをactiveに更新

登録完了HTMLテンプレート作成

Member.complete()メソッドを呼び出す

メールに記述されたリンクをクリック

node.JS VS RingoJS 比較サイトまとめ

参考にしたブログ

node.JSについて

短所

長所

RingoJSについて

短所

長所

じゃあ、どっちをつかえばいいの？

サーバーサイドJavaScriptで簡単Webアプリ開発 - Webフロント開発編(2)

テーブルスキーマ作成

ビジネスロジックを担当するservice.jsを作成

DB Entityを担当するmodel.jsを作成

MySQLに接続するためのJava用JDBCドライバー

RingoJS用O/Rマッパライブラリ

登録確認処理の作成(http://localhost:8080/confirmの処理)

model.js、service.jsのrequire

リクエストパラメータのチェック

多重登録防止

DBへの仮登録処理

メール送信処理

メールテンプレート作成

actions.jsにメール送信する処理を実装

サーバーサイドJavaScriptで簡単Webアプリ開発 - Webフロント開発編(1)

概要設計

RingoJSのコマンドラインで雛型生成

コーディング開始

インデント

登録ページの作成(http://localhost:8080/indexのページ)

テンプレートファイルの修正

とりあえず起動

サーバーサイドJavaScriptで簡単Webアプリ開発　- バッチ処理開発編

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(3)

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(2)

サーバーサイドJavaScriptで簡単Webアプリ開発　- Webフロント開発編(1)