14、Express框架操作cookie的方法

阅读() @2018-10-29 18:16:11

存储用户登录成功之后的状态一般是用session的,但是今天先尝试用下cookie,练习下node操作cookie的方法,node操作session在后面的笔记再详说。

今天用Node做了一个简单的注册登录功能,在用户登录成功之后要将用户名存储在cookie中,代码如下:

HTML部分:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
</head>
<body>
    <div>
        <input type="text" id="uname" placeholder="用户名" />
        <input type="text" id="upwd" placeholder="密码" />
        <input type="button" id="loginBtn" value="登录" />
    </div>
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript">
        (function(){
            var login = {
                //初始化
                init : function(){
                  document.getElementById('loginBtn').onclick = this.toLogin;
                },
                //开始登录
                toLogin : function(){
                    var unameVal = document.getElementById('uname').value;
                    var upwdVal = document.getElementById('upwd').value;
                    if(unameVal=='' || unameVal==null){
                        alert('用户名不能为空!');
                        return;
                    }
                    if(upwdVal=='' || upwdVal==null){
                        alert('密码不能为空');
                        return;
                    }
                    $.ajax({
                        url : '/login/loginForm',
                        type : 'post',
                        dataType : 'json',
                        data : {
                            uname : unameVal,
                            upwd : upwdVal
                        },
                        success : function(data){
                            console.log(data);
                        }
                    });
                }
            }
            window.login = login;
            login.init();
        })();
    </script>
</body>
</html>

后端Js部分:

/**
 * Created by www.zymseo.com on 2017/4/4.
 */

var express = require('express'),
    router = express.Router(),
    db = require('../module/db').mysql;

router.get('/', function(request, response){
    response.render('login/index');
});

router.post('/loginForm', function(request, response){
    db('select * from blog_user where uname="'+request.body.uname+'" and upwd="'+request.body.upwd+'"', function(error, data){
        //response.cookie()方法,第一个参数是cookie名,第二个参数是cookie值,第三个参数可以设置过期时间等
        response.cookie('userMessage', {uname : data[0].uname}, {maxAge : 1000*60*60});
        response.json({
            data : '1'
        });
    });
});

exports.loginRouter = router;

到目前为止,运行这段代码就可以在浏览器中查看相应的cookie值了。

但是我要在所有的前端模板中显示用户名,这就需要将数据库中查找到的用户名分配给前端模板,这里需要在package.json中安装一个cookie-parser,如图:

在package.json中安装cookie-parser

然后在命令行中执行npm install即可,这个在前面的笔记有记录。

然后在app.js中添加如下代码:

var cookieParser = require('cookie-parser');
//读取cookie
app.use(cookieParser('miyao'));
//所有的页面都是用cookie信息
app.use(function(request, response, next){
    if(request.cookies.userMessage){
        response.locals.uname = request.cookies.userMessage.uname;//向前端模板分配变量
    }
    next();
});

前端模板中调用后端分配的数据:

<% if(locals.uname){ %>
<h1>用户:<%= locals.uname %></h1>
<% } %>

本节完!

微信二维码