どうもこんばんは。
さてさて今回はログイン認証周りのお話をしたいと思います。
予定としてはこんな感じです
url: /account
ログインフォームページ
url: /account/login
ログイン認証
エラーだった場合は/accountに戻ってきます。
ということで順を追って説明します。
1. まずはログインん周りのroutesファイルを用意しよう
場所:routes/account.js
まずは処理を記述する為のaccount.jsを用意しいましょう
中身は以下のようになっています。
// ログインフォーム
exports.index = function(req, res){
if (req.session.isLogin) res.redirect('/');
res.render('account/index', { title: 'Express' });
};
とりあえずはこれで大丈夫です。
2. viewファイルを用意しよう
場所:views/account/index.jade
extends ../layouts/base.jade
block content
form(method="post",action="/account/login")
fieldset
legend login
div.form-group
label(for="exampleInputEmail") email
input.form-control#exampleInputEmail(type="text",placeholder="your email address...")
div.form-group
label(for="exampleInputPassword") password
input.form-control#exampleInputPassword(type="password", placeholder="passowrd..")
button.btn.btn-default(type="submit") login
3. 最後にapp.jsに追記するよ！
先ほど、用意したroutes/account.jsを読み込ませる処理をまずは記述しましょう。
var express = require('express')
, routes = require('./routes')
, user = require('./routes/user')
, account = require('./routes/account')
....
こんな感じに記載してあげましょう。
次にroutesの設定をします。
app.get('/', routes.index);
app.get('/account',account.index);
全体を通してみるとこんな感じです。
app.js
/**
* Module dependencies.
*/
var express = require('express')
, routes = require('./routes')
, user = require('./routes/user')
, account = require('./routes/account')
, http = require('http')
, path = require('path');
var app = express();
app.configure(function(){
app.set('port', process.env.PORT || 3000);
app.set('views', __dirname + '/views');
app.set('view engine', 'jade');
app.use(express.favicon());
app.use(express.logger('dev'));
app.use(express.bodyParser());
app.use(express.methodOverride());
app.use(express.cookieParser('your secret here'));
app.use(express.session());
app.use(app.router);
app.use(express.static(path.join(__dirname, 'public')));
});
app.configure('development', function(){
app.use(express.errorHandler());
app.locals.pretty = true;
});
app.get('/', routes.index);
app.get('/account',account.index);
http.createServer(app).listen(app.get('port'), function(){
console.log("Express server listening on port " + app.get('port'));
});
これで準備おk、あとはブラウザでアクセスしてみましょう。
あ、ちなみにnode-devを使ってない人はnodeを再起動させましょう。
http://localhost:3000/account
これでログインページが表示できたと思います。
さて、ここでログインボタンを押すと
Cannot POST /account/login
って表示されるかと思います。これはある意味正常処理です。
4. ログイン処理を書いてみよう
routes/account.jsを修正していきましょう。
ここからはmongodbを使いますので起動しておくのを忘れないように注意してください。
var mongoose = require('mongoose');
mongoose.connect('mongodb://localhost:27017/memo');
// ユーザースキーマの作成
var UserSchema = mongoose.Schema({
name: String,
email: String,
password: String
});
// ユーザーモデルの作成
var User = mongoose.model('User',UserSchema);
// ログイン画面を表示
exports.index = function(req, res){
if (req.session.isLogin) res.redirect('/');
res.render('account/index', { title: 'Express' });
};
// ログイン処理
exports.login = function(req, res) {
if (req.session.isLogin) res.redirect('/');
User.findOne({email:req.body.email,password:req.body.password},function(err,doc){
if (doc) {
req.session.isLogin = true;
req.session.user = doc;
res.redirect('/');
} else {
res.render('account/index', { title: 'Express' });
}
});
}
まず最初にmongooseを使っていますよね。
流れとしてはスキーマを定義して、モデルを生成するって処理の流れです。
まあここにmongoose周りの処理を記述するのはぶっちゃけ微妙だとは思っていますが、とりあえずサンプルなので、あとでリファクタリングしていきますw
で、ログイン処理ですが、フォームからpostされたデータがreq.bodyの中にはいっているので、そいつを使ってmongoから参照しているだけです。
ちなみにmongooseのモデルもfindとかfindOneとかfindByIdとかつかえますよー！
mongo側にはmemoというデータベースとusersというコレクションをあらかじめ用意しておいてくださいw
これで基本的なログインの処理は書けたかと思います。
次回はログインに関しての表示周りを細かく作ろうと思います！