Node.js 入门笔记(4) - session

给登录用户建立会话，没有登录的用户，重定向到登录页面。

1. 检查express-session是否安装

E:\MyProject\nodejs\HelloNodejs>npm list |findstr "session"
+-- [email protected]

如没有安装，则安装

npm install express-session --save

2. 修改app.js文件

增加

var session = require('express-session');

在app.use(express.static(path.join(__dirname, 'public')));下方增加以下代码。上半部分设置session，下半部分设置拦截。

关于express的middleware，详细可参考http://expressjs.com/en/guide/using-middleware.html

关于express-session，详细可参考https://www.npmjs.com/package/express-session

var identityKey = 'skey';
app.use(session({
  name: identityKey,
  secret: 'HellojsjsolleH',
  cookie:{
    maxAge: 5*60*1000
  }
}));

app.use(function (req, res, next) {
  var url = req.originalUrl;
  
  if(req.session.loginUser){
    next();
  }else if ( url == '/users/login' || url == '/users/loginAction' || url == '/users/new'){
    next();
  }else{
    return res.redirect("/users/login");
  }
  
});

3. 修改users.js文件，将用户登录、注册有关的功能放到这个文件实现。

isValidUser是一个辅助函数，内置3个用户。/login返回登录页面，/loginAction处理登录提交，区分ajax和传统提交两种情况，登录成功则设置会话，并通知浏览器重定向。

var express = require('express');
var router = express.Router();

function isValidUser(username, password) {
    var users = {
        'zhangsan': '123456',
        'lisi': '12345678',
        'wanger': 'waner'
    };
    return users[username] == password;
}

/* GET users listing. */
router.get('/', function (req, res, next) {
    res.send('respond with a resource');
});

router.get('/login', function (req, res, next) {
    res.render('login', {
        title: 'login'
    });
});

router.get('/logout', function (req, res, next) {
    req.session.destroy();
    return res.redirect("/users/login");
});

router.post('/loginAction', function (req, res, next) {
    var sess = req.session;
    var OK = isValidUser(req.body.username, req.body.password);

    if (OK) {
        req.session.regenerate(function (err) {
            if (req.headers['x-requested-with'] && req.headers['x-requested-with'].toLowerCase() == 'xmlhttprequest') {
                if (err) { //ajax请求
                    return res.json({
                        retCode: 2,
                        retMsg: '登录失败'
                    });
                }
                req.session.loginUser = req.body.username;
                return res.json({
                    retCode: 0,
                    retMsg: '/'
                });
            } else { //传统请求
                if (err) { //ajax请求
                    return res.json({
                        retCode: 2,
                        retMsg: '登录失败'
                    });
                }
                req.session.loginUser = req.body.username;
                return res.redirect("/");
            }
        });
    } else {
        res.json({
            retCode: 1,
            retMsg: '账号或密码错误'
        });
    }
});

module.exports = router;

2. 修改layout.html

在script部分增加个 consumerJS的block

<script>
            $(function(){
                function footerPosition(){
                    $("footer").removeClass("fixed-bottom");
                    var contentHeight = document.body.scrollHeight,
                        winHeight = window.innerHeight;
                    if(!(contentHeight > winHeight)){
                        $("footer").addClass("fixed-bottom");
                    } else {
                        $("footer").removeClass("fixed-bottom");
                    }
                    var hh = $("#mainNav").height() +  $("#breadNav").height() +  $("#navFooter").height();
                    $("#divMain").height(winHeight - hh - 5);
                }

                {% block consumerJS %}{% endblock %}

                footerPosition();
                $(window).resize(footerPosition);
            });
        </script>

将登录的连接用变量表示，如没有登录则显示登录，以登录则显示为注销。

<ul class="nav navbar-nav navbar-right">
    <li><a id="linkLogin" href="{{ loginOutLink }}">{{ loginOutName }}</a></li>
    <li><a href="/users/new">注册</a></li>

</ul>

3. 修改login.html

在consumerJS的block增加以下内容

{% block consumerJS %}
    $('#commit').click(function(evt){
        evt.preventDefault();

        $.ajax({
            url: '/users/loginAction',
            type: 'POST',
            data: {
                username: $('#username').val(),
                password: $('#password').val()
            },
            success: function(data){
                if(data.retCode === 0){
                    //redirect
                    window.location.href="/"; 
                }else{
                    alert(data.retCode + " : " + data.retMsg);
                }   
            }
        });
    });
{% endblock %}

用ajax方式提交登录数据，验证通过，则跳转，否则弹出告警框。

Node.js 入门笔记(4) - session

猜你喜欢