Node.js(express) + MongoDB(mongoose) 简单开发(二)

前面说过,做一个真正意义上的登录注册,接下来就让我们一步一步实现吧~

首先需要安装mongodb,网上有很多安装教程,这里就不再赘述。

安装完成后开始与本地数据库连接,可以参考这里:MongoDB介绍及下载与安装

最后可以安装一个可视化的操作数据库的软件:MongoVUE,配置也很简单:

最后在项目级目录下安装mongoose,安装过程自行百度~ 安装成功后可在node_modules下看见mongoose文件夹

接下来我们测试数据库是否连同:

新建一个models的文件夹,在这里我们对表进行操作(新建表,引用表)

在models下新建index.js:

var mongoose = require("mongoose");

mongoose.connect("mongodb://localhost:27017/blogData");

mongoose.connection.on("error", function (error){
    console.log("连接数据库失败"+error);
});

mongoose.connection.on("open", function (){
    console.log("数据库连接成功!!!");
});

var tschema = new mongoose.Schema({
    name  : { type:String },
    date : {type: Date, default: Date.now}
});

var tmodel = mongoose.model("tdoc", tschema);

var testEntity = new tmodel({    name: "testUser"});testEntity.save(function (error, doc){    if(error){        console.log("error: "+error);    }else{        console.log(doc);    }});

tmodel.find({}, function (error, docs){
    if(error){
        console.log("error: "+error);
    }else{
        console.log(docs);
    }
});

exports.mongoose = mongoose;

这里注意 添加过后把添加数据的地方给注释起来,否则每执行一次都会添加一条数据。

在IDE里debug就可以看到输出的结果:

同样我们在可视化的数据管理软件上也可以看见:

让我们精简一下index.js的功能:

var mongoose = require("mongoose");

mongoose.connect("mongodb://localhost:27017/blogData");

exports.mongoose = mongoose;

建立一个login.js:

var mongodb = require("./index");

/*
* 用户注册
* */

var Schema = mongodb.mongoose.Schema;

var registerSchema = new Schema({
    username: {type: String},
    password: {type: String},
    createTime: {type: Date, default: Date.new}
});

var userModel = mongodb.mongoose.model("blogUser", registerSchema);

exports.userList = userModel;

这样我们就可以在任何地方引用到userLsit了。

接下来在项目级目录下创建一个dao的文件夹,这个文件夹的作用就是专门用来处理数据的。

在dao层,新建一个userDAO.js,在userDAO里面封装一些操作数据的方法:

var userModel = require("../models/login").userList;

var userDAO = function (){};

userDAO.prototype = {
    //增
    save: function (json, callBack){
        var newUser = new userModel(json);

        newUser.save(function (err){
            callBack(err);
        });
    },
    //删
    remove: function (json, callBack){
        userModel.remove(json, function (err){
            callBack(err);
        });
    },
    //改
    update: function (json, condition, callBack){
        userModel.update(json, condition, function (err){
           callBack(err);
        });
    },
    //查
    findByName: function (name, callBack){
        userModel.findOne({username: name}, function (err, doc){
            callBack(err, doc);
        });
    }
};

exports.userMethod = new userDAO();

这样在需要操作数据的地方,我们只需引用这个文件就可以对数据库进行操作了~

接下来让我们实现注册的接口功能,接口的数据格式同样沿用之前的数据格式。现在我们已连通数据库,所以用POST的方式

在C层新建login.js,在这个文件里面写注册和登录的方法:

var userMethod = require("../dao/userDAO").userMethod;

exports.register = function (req, res){
    userMethod.findByName(req.body.username, function (err, doc){
        if(!err){
            if(!doc){
                var newUser = {username: req.body.username, password: req.body.password};
                userMethod.save(newUser, function (err){
                    if(!err){
                        res.send({
                            code: 200,
                            msg: "注册成功!(本条消息来自后台)"
                        });
                    }
                });
            }else{
                res.send({
                    code: 201,
                    msg: "次用户名已被占用!(本条消息来自后台)"
                });
            }
        }
    });
};

可以看到思路也很简单明确,用我们之前封装的查询数据库的方法,先对输入的用户名进行查询,

当查询没有错误的时候再判断,如果没有查询到这个用户名,说明该用户名还未注册,反之该用户名被占用~

现在就可以来实现前端的注册功能了:

;(function ($){
    var foo = function (options){
        var self = this;
            self.options = $.extend({
                parent: $("#myForm"),
                register: $("[node-type=register]"),
                submit: $("[node-type=submit]")
            }, options);
        self.bindEvent();
    };

    foo.prototype = {
        bindEvent: function (){
            var self = this;
            self.register();
        },
        register: function (){
            var self = this,
                parent = self.options.parent,
                register = self.options.register;

            register.on("click", function (){
                var jqXML = $.ajax({
                    url: "/register",
                    dataType: "json",
                    type: "post",
                    data: parent.serialize()
                });

                jqXML.done(function (json){
                    if(json.code == 200){
                        alert(json.msg);
                    }else{
                        alert(json.msg);
                    }
                });
            });
        }
    };

    new foo();
})(jQuery);

同样别忘了在longin.html页面引用

最后在路由层新增注册的接口:

//注册接口
router.post("/register", loginController.register);

好了,接下来让我们重启服务,看下一效果~

恭喜~ 注册成功!

我们可以通过可视化的数据管理软件看下我们刚刚注册的用户,有没有存储到数据库里面:

刚刚我们注册的用户被完整的写入到数据库里。

最后让我们按着写注册的思路,来实现一下登录的功能吧~

首先在C层login.js里面添加登录功能:

exports.login = function (req, res){
    userMethod.findByName(req.body.username, function (err, doc){
        if(!err && doc && req.body.password === doc.password){
            res.send({code:200, msg:"成功(本条消息来自后台)"});
        }else{
            res.send({"code":201, msg:"用户名或者密码错误(本条消息来自后台)"});
        }
    });
    //if(req.body.username && req.body.password){
    //    res.send({code:200, msg: "登录成功(本条消息来自后台)"});
    //}else{
    //    res.send({code: 201, msg: "帐号或密码错误(本条消息来自后台)"});
    //}
};

登录功能的思路也很简单,先查询用户名,如果查询未出错,并且查询到了输入的用户名,并且输入的密码与我们数据库存储的密码一致,

说明该用户可以正确的登录。

前端的login.js新增登录功能:

        bindEvent: function (){
            var self = this;
            self.login();
            self.register();
        },
        login: function (){
            var self = this,
                parent = self.options.parent,
                submit = self.options.submit;

            submit.on("click", function (){
                var jqXML = $.ajax({
                    url: "/userData",
                    dataType: "json",
                    type: "post",
                    data: parent.serialize()
                });

                jqXML.done(function (json){
                    if(json.code == 200){
                        location.href = "/home";
                    }else{
                        alert(json.msg);
                    }
                });
            });
        }

路由层index.js配置登录接口:

//登录接口
router.post("/userData", loginController.login);

OK~ 重启服务,让我们来测试下我们刚刚注册的帐号是否能成功登录~

如果你能看到这个界面,那么恭喜你,你的登录功能也实现了~~

不过问题也来了:翻一下我们曾写的home.html就明白了,我们写的<%= username %>没有正确被解析,仔细想下也不难理解:

我们在没有连用数据库的时候,登录是用get方式写的,当时的实现思路是登录后把用户名存在了userList对象里面,当我们访问home页时再从这个对象里面读取用户名,此时的<%= username %>完全可以被正确解析

但是问题是:现在我们用的post方式,用户名理所当然不会被存储到userList里面,当然就更没有里面的用户名了。那么我们应该把用户信息存储到哪里,当跳转到home页,可以从这个地方直接读取用户信息呢?

接下来轮到他登场:express-session

安装模块express-session并引用,安装、引用不在讲述。 express-session详解请戳这里 什么是session

在app.js里使用新模块进行访问时间限制,如下:

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

//set session
app.use(session({
  secret: "secret",
  resave: true,
  saveUninitialized: false,
  cookie: {
    maxAge: 1000 * 60 * 10 //过时时间设置(毫秒)
  }
}));

一定要注意书写顺序,把app.use(session({}))写在app.use(‘/‘, routes)的上面,原因是中间件必须放在HTTP动词方法之前,否则不会执行。

接下来新增中间件并设置模板变量值。这里又涉及到一个新的名词:中间件。什么是中间件? 可一看下这里 express之路由与中间件

其实我们理解的中间件,就是一个个的组件,一个个的功能,都集成到middleware里面,这样做的好处就是调理清晰,思路明确

好了,我们在项目级目录下新建一个middleware文件夹,在里面新建一个session.js,代码如下:

exports.session = function (req, res, next){
    res.locals.user = req.session.user;
    var err = req.session.error;
    res.locals.message = "";
    if(err){
        res.locals.message = "<div style=\"margin-bottom: 20px; color: #f00;\">"+err+"</div>"
    }
    next();
};

在路由层的index.js添加对session模板的使用:

var session = require("../middleware/session");

router.use(session.session);

然后对登录功能增加一些代码:

exports.login = function (req, res){
    userMethod.findByName(req.body.username, function (err, doc){
        if(!err && doc && req.body.password === doc.password){
            var user = {
                username: req.body.username,
                password: req.body.password
            };
            req.session.user = user;
            res.send({code:200, msg:"成功(本条消息来自后台)"});
        }else{
            res.send({"code":201, msg:"用户名或者密码错误(本条消息来自后台)"});
        }
    });
    //if(req.body.username && req.body.password){
    //    res.send({code:200, msg: "登录成功(本条消息来自后台)"});
    //}else{
    //    res.send({code: 201, msg: "帐号或密码错误(本条消息来自后台)"});
    //}
};

在登录成功后,我们把用户名以及密码都存储到user对象里面,并把user对象赋给session下面的一个自定义对象user

在访问home页的时候我们就可以从session里面读取用户信息了:

/* GET home page. */
router.get(‘/home‘, function (req, res){
    if(req.session.user){
        res.render("home", {
            title: "登录成功页",
            username:req.session.user["username"]
        });
    }else{
        req.session.error = "请先登录";
        res.redirect("login");
    }
  //res.render(‘home‘, {
  //    title: "登录成功页",
  //    username: getLoginController.userList().username
  //});
});

判断session下是否有user这个对象,有的话从user里面读取用户信息,否则直接跳转到登录页。

好了,到这就全部改写完了,重启服务,用注册过的用户名继续测试:

测试通过!并且可以从session里读取到用户信息,输入一个没注册过的用户:

并且当我们直接访问home页是,如果session里有用户信息,那么可以直接登录,否则就会跳转到登录页

还记不记得我们当初还写了一个登出的按钮,现在简单的写一下登出的功能:

/*GET logout page.*/
router.get(‘/logout‘, function (req, res){
    req.session.user = null;
    req.session.error = null;
    res.redirect("/login");
});

登出的时候清空session的信息,并跳转到登录页。

重启服务进行测试,点退出登录后可以看到返回到了登录页

此时我们再直接访问home页,由于session信息已被清除,所以也直接跳转到了登录页~ 大功告成!!!

至此,我们整个的登录注册的功能就算是告一段落,可以发现,其中任何一块写起来都没有难度,难的是将他们之前串联起来,难的是这个整体架构的思路思维,所以平时还是要多思考,

把整体的逻辑思路弄通了,那问题也就自然而然的解决了~

时间: 2024-11-09 22:03:12

Node.js(express) + MongoDB(mongoose) 简单开发(二)的相关文章

Node.js(express) + MongoDB(mongoose) 简单开发(一)

前言: express作为一个Node框架,很适合新学习Node的同学,加上mongoose的数据处理,堪称完美~ 闲话少说,步入正题. 我的系统环境: Win7 64bit Nodejs: v0.10.35 Npm: 1.4.28 IDE:webstorm 1. 建立项目 Node及express的安装这里就不再赘述,网上有很多安装的教程,不会的同学可以自行查找,这里我们采用express4.x版本 安装express库完成之后,我们可以使用express命令来建立一个自己的项目: expre

基于 Node.js + Express + mongoDB + Bootstrap 搭建的电影网站

电影网站 ?? GitHub: https://github.com/bxm0927/movie-website 此项目是基于 Node.js + Express + mongoDB + Bootstrap 搭建的电影网站. 主要功能模块: 一期:前台电影展示页.电影详情页.后台电影管理中心(电影录入.电影修改) 二期:用户登录注册注销功能.用户识别和持久化.后台用户管理中心(用户录入.用户修改).电影评论 <!-- more --> 图片预览 技术栈 [前端] HTML/CSS/JS:亘古不

Node.js Express+Mongodb 项目实战

Node.js Express+Mongodb 项目实战 这是一个简单的商品管理系统的小项目,包含的功能还算挺全的,项目涵盖了登录.注册,图片上传以及对商品进行增.删.查.改等操作,对于新手来说是个很不错的练手项目,分享给大家. GitHub源码:https://github.com/oceanMin/cms 项目前准备 安装node.js 安装express 安装mongoDB 章节目录 快速开始 快速开始 模块 express商品管理系统介绍 框架搭建.ejs .express.static

Node.js+Express+MongoDB数据库实现网页注册登入功能

通过 Node.js + Express + MongoDB 实现网页注册账号 和 登入账号的功能 项目准备: 1: 事先准备好项目的页面 (首页页面 index.html)(登入页面 login.html) (注册页面 register.html) 2:    安装好 Node.js 需要使用的第三方模板 3:  设计路径设计 4:  理清功能需求 5:  创建 app.js  router.js   mgdb.js 三个 js 文件  和 public 和 views 文件夹 作用: app

node.js+express+mongodb

主要是想用node.js链接mongodb,用的是mongoose.用ejs引擎,扩展到.html比较容易 小例子结构简单,框架清晰. 提交方法 路径 方法 作用 get add     post add   提交记录 get del     get modify   转到修改页面 post modify   修改记录 入口:mongodb.js,数据模型:model.js,(这两个在同一级目录) 路由:mong_ro.js(引入model.js用../) 三个页面index.html,add.

【我的笔记BLOG1】配置webstorm + node.js +express + mongodb开发博客的环境

1. 安装webstorm 并破解 2. 安装node (以及express框架) 至官网下载并安装.(http://nodejs.org)v0.10.32   msi 安装后测试,打开命令行, c:\users\Iris804>  node >console.log("hello") 输出 hello undefined 安装node.js 包管理器(Express) ctrl+d, 回到初始窗口,输入  npm install -g express-gengerator

Node.js + Express + Mongodb 开发搭建个人网站(二)

二.路由 1.打开 routes/index.js ,这个意思就是  捕获到访问主页的get请求: 并通过 app.js 分配到对应的路由里: 看到这里,打开 http://127.0.0.1:3000/users/  来感受一个路由的意思: routes/index.js 文件: 如果我们请求是get,路径是 '/' 那么就是渲染index.ejs这个视图,可以省略后缀名 .ejs: 这个的意思是将数据传到index.ejs中 并输出到页面上. 2.视图 views/index.ejs 可以看

Node.js + Express + Mongodb 开发搭建个人网站(一)

一.Node + Express环境搭建 0.去Node官网下载安装node,如果安装了 npm 和 node的话 那么就 安装 全局的 express,-g全局安装 npm install express –g 1.然后使用 express 创建项目,命令:   express 项目名 初始化一个node项目 注意 这里 默认的页面模版 是jade 大部分小项目使用的是 ejs模版,所以 利用express创建ejs模版的node项目,命令为express -e 项目名 express -e

ubuntu 安装node.js + express + mongodb

转载自http://my.oschina.net/reg/blog/289536 Ctrl + Alt + T,打开终端,输入以下命令安装: sudo apt-get install nodejs 安装完成后,终端输入nodejs,就能进入node命令啦: 但是正常下应该是输入node进入命令而不是nodejs: 在Ubuntu下node是属于其他应用的,不过继续输入下面的命令安装,完成后就可以使用node进入命令啦. sudo apt-get install nodejs-legacynode