一个简单的blog系统（一）基本功能的实现

---恢复内容开始---

Node.js+Express+MongoDB+Bootstrap开发微博网站的过程如下：

1.建立微博网站基本网站结构

　　1.1 为了学习简便，采用和html结构相似的ejs作为模板引擎。

express -e myBlog

　　1.2 进入项目目录，执行npm install 命令，安装项目所需要的依赖。

　　1.3 运行npm start 命令，打开所需浏览器访问localhost:3000，可以看到如下结果，说明项目目录初始化成功。

2.搭建多人博客

　　2.1 功能分析

　　　　本实例实现的是微博的基本功能，包括用户注册、登陆、发表微博、显示全部（个人）微博和退出微博几个功能。

　　2.2 设计路由规划　　　

/: 主页
/login: 登录页
/reg: 注册页
/post: 发表文章
/logout： 登出

　　注意：登陆和注册只能在用户未登录状态下使用，发表微博和退出只能在用户登录状态下使用，首页和用户首页在登陆和未登录状态下显示不同的内容。通过会话（session）管理用户登录状态。用户登录、注册、发表成功以及登出后都会回到主页。

　　2.3 修改 index.js 如下：

　　　　

var express = require('express');
var router = express.Router();    //创建模块化安装路径的处理程序。

//主页路由
router.get('/', function(req, res) {
  res.render('index', { title: '主页' });
});


//注册页路由
router.get('/reg', function(req, res) {
    res.render('reg', { title: '注册'});
});

router.post('/reg', function(req, res) {

});

//登录页路由
router.get('/login', function(req, res) {
    res.render('login', { title: '登录'});
})；

router.post('/login', function(req, res) {

});

//发表文章也路由
router.get('/post', function(req, res) {
    res.render('post', { title: '发表'});
});

router.post('/post', function(req, res) {

});

//登出的路由
router.get('/logout', function(req, res) {

})
module.exports = router;

　　2.4 界面设计，使用Bootstrap前端框架布局，根据功能以及路由规划，相应的界面和对应的模板引擎为：　　　

          首页：index.ejs

　　　　用户首页：user.ejs

　　　　登陆页面：login.ejs

　　　　注册页面：reg.ejs

　　　　公用页面：header.ejs(顶部导航条)、alert.ejs(顶部下方错误信息显示)、foote.ejsr(底部显示)、say.ejs（发布微博）、posts.ejs(按行按列显示已发布的微博)    

　　　　2.4.1 使用bower安装Bootstrap、jQuery框架

bower install bootstrap jquery

3.微博功能的实现

　　3.1 访问mongodb数据库

　　　　3.1.1 通过淘宝镜像安装一下模块　　　　　

npm install mongodb --save -d --registry=https://registry.npm.taobao.org
npm install express-session --save -d --registry=https://registry.npm.taobao.org
npm install connect-mongo --save -d --registry=https://registry.npm.taobao.org
npm install connect-flash --save -d --registry=https://registry.npm.taobao.org

　　　　3.1.2 在项目根目录下建立settings.js文件，用于保存该项目的配置信息，比如数据库的连接信息。其中，db是数据库的名称，host是数据库的地址，cookieSecret是用来对cookie进行加密，port为数据库的端口号。　　　　　

module.exports = {
    cookieSecret: 'myblog',
    db: 'blog',
    host: 'localhost',
    port: 27017
}

　　　　3.1.3  然后在项目的根目录下新建models文件夹，并且在model文件夹下新建db.js，用于创建数据库连接信息。

var settings = require('../settings'),
    Db = require('mongodb').Db,
    Connection = require('mongodb').Connection,
    Server = require('mongodb').Server;
module.exports = new Db(settings.db, new Server(settings.host, settings.port), {
    safe: true
});

　　3.2 会话支持（session）　　　

var settings = require('./settings');
var session = require('express-session');
var MongoStore = require('connect-mongo')(session);

app.use(session({
    secret: settings.cookieSecret,
    cookie: {maxAge: 1000*60*60*24*30},
    key: settings.db,
    store: new MongoStore({
        url: 'mongodb://localhost/blog'
    })
}));

　　3.3 页面通知（connect-flash）　　

//通过淘宝镜像安装connect-flash模块
npm install connect-flash --save -d --registry=https://registry.npm.taobao.org
//然后修改app.js，添加
var flash = require('connect-flash');
//最后应用flash功能
app.use(flash())

　　3.4 响应注册

　　　　3.4.1 在models文件夹下新建user.js，添加如下代码：

var mongodb = require('./db');

//User构造函数，用于创建对象
function User(user) {
    this.name = user.name;
    this.password = user.password;
    this.email = user.email;
};

//输出User对象
module.exports = User;

//存储用户信息到mongodb数据库
User.prototype.save = function(callback) {
    //要存入数据库的文档
    var user = {    //用户信息
        name: this.name,
        password: this.password,
        email: this.email
    };

    //打开数据库
    mongodb.open(function(err, db) {
        if(err) {
            return callback(err);    //错误，返回err信息
        }
        //读取users集合
        db.collection('users', function(err, collection) {
            if(err) {
                mongodb.close();
                return callback(err);    //错误，返回err信息
            }

            // 为name属性添加索引
            // collection.ensureIndex('name', {unique: true});
            
            //将user用户数据插入users集合
            collection.insert(user, {safe: true}, function(err, user) {
                mongodb.close();
                if(err) {
                    return callback(err);    //错误，返回err信息
                }
                callback(null, user[0]);    //成功，err为null，并返回存储后的用户文档
            });
        });
    });
};

//从数据库中读取用户信息
User.get = function(name, callback) {
    //打开数据库
    mongodb.open(function(err, db) {
        if(err) {
            return callback(err);    //错误，返回err信息
        }

        //读取users集合
        db.collection('users', function(err, collection) {
            if(err) {
                mongodb.close();
                return callback(err);    //错误，返回err信息
            }
            //查找用户名（name键）值为name的一个文档
            collection.findOne({name: name}, function(err, user) {
                mongodb.close();
                if(err) {
                    return callback(err);    //失败！返回err信息
                }
                callback(null, user);    //成功，返回查询的用户信息
            })
        })
    })
}

　　　　3.4.2 然后打开index.js,在前面添加如下代码：

var crypto = require('crypto');
User = require('../models/user.js');

　　　　3.4.3 其次，修改index.js中的app.post('/reg/)如下所示：

router.post('/reg', function(req, res) {
    var name = req.body.name,
        password = req.body.password,
        password_re = req.body['password-repeat'];

    //检测用户两次输入的密码是否一致
    if(password != password_re) {
        req.flash('error', '两次输入的密码不一致！');
        return res.redirect('/reg');    //返回注册页
    }

    //生成密码的md5值
    var md5 = crypto.createHash('md5'),
        password = md5.update(req.body.password).digest('hex');
    //用新注册用户信息对象实例化User对象，用于存储新注册用户和判断注册用户是否存在
    var newUser = new User({
        name: req.body.name,
        password: password,
        email: req.body.email
    });
    //检查用户名是否已经存在
    User.get(newUser.name, function(err, user) {
        if(user) {
            req.flash('error', '用户名已存在！');
            return res.redirect('/reg');    //返回注册页面
        }
        //如果不存在则新增用户
        newUser.save(function(err, user) {
            if(err) {
                req.flash('error', err);    //保存错误信息，用于界面显示
                return res.redirect('/reg');    //注册失败返回注册页面
            }
            req.session.user = user;    //将用户信息存入session
            req.flash('success',  '恭喜你，注册成功！');
            res.redirect('/');    //注册成功后返回主页
        });
    });
});

 　　　　3.4.4  修改header.ejs,让导航条在已登录和未登录状态下显示不同的内容:

<% if(user) { %>
<li><a href="/post" title='发表'>发表</a></li>
<li><a href="/logout" title='登出'>登出</a></li>
<% } else { %>
<li><a href="/login" title='登录'>登录</a></li>
<li><a href="/reg" title='注册'>注册</a></li>
<% } %>

　　　　3.4.5 为了在页面显示注册（或登陆）成功或失败信息,添加如下代码：

<!--显示成功或错误信息-->
<% if(success){ %>
<div class="alert alert-success">
    <%= success %>
</div>
<% } %>
<% if(error){ %>
<div class="alert alert-error">
    <%= error %>
</div>
<% } %>

 　　3.5 登录与登出响应

　　　　3.5.1实现用户登录功能

router.post('/login', function(req, res) {
    //生成密码的md5值
    var md5 = crypto.createHash('md5'),
        password = md5.update(req.body.password).digest('hex');
    //检查用户是否存在
    User.get(req.body.name, function(err, user) {
        if(!user) {
            req.flash('error', '用户名不存在！');
            return res.redirect('/login');    //用户不存在则跳转到登录页
        }
        //检查密码是否一致
        if(user.password != password) {
            req.flash('error', '密码错误！');
            return res.redirect('/login');    //密码错误则跳转到登录页
        }
        //用户名密码均匹配后，将用户信息存入session
        req.session.user = user;
        req.flash('success', '登录成功！');
        res.redirect('/');    //登录成功后跳转到主页
    });
});

　　　　3.5.2 实现用户登出响应

router.get('/logout', function(req, res) {
    //通过复制为null，丢掉session中的用户信息，实现用户的退出。
    req.session.user = null;
    req.flash('success', '登出成功！');
    res.redirect('/');    //登出成功后跳转到主页
});

　　3.6 页面权限控制

　　为了实现登陆和注册功能只对未登录的用户有效；发布和退出功能只对已登录的用户有效。如何实现页面权限控制呢？我们可以把用户登录状态检查放到路由中间件 中，在每个路径前增加路由中间件，通过调用next()函数转移控制权，即可实现页面权限控制。因此在index.js中添加checkNotLogin 和checkLogin函数来检测是否登陆，并通过next()转移控制权，检测到未登录则跳转到登录页，检测到已登录则跳转到前一个页。　

function checkLogin(req, res, next) {
    if(!req.session.user) {
        req.flash('error', '您还没有登录！');
        res.redirect('/login');
    }
    next();    //控制权转移：当不同路由规则向同一路径提交请求时，在通常情况下，请求总是被第一条路由规则捕获，
    　　　　　　// 后面的路由规则将会被忽略，为了可以访问同一路径的多个路由规则，使用next()实现控制权转移。
}

function checkNotLogin(req, res, next) {
    if(req.session.user) {
        req.flash('error', '您已登录！');
        res.redirect('back');    //返回之前的页面
    }
    next();
}

　　　3.7 为了维护用户状态和flash的通知功能，给每一个ejs模板传入了以下三个值：

user: req.session.user
success: req.flash('success').toString()
error: req.flash('error').toString()

 　　3.8 发表文章功能实现

　　　　3.8.1 发表页的页面设计

<div class="container">
    <form role="form" method="post">
        <h2>发表</h2>
        <hr/>
        <div class="form-group">
              <label for="title" class="control-label">标题:</label>
             <input type="text" class="form-control" name="title" placeholder="请输入标题名称" required>
           </div>
        <div class="form-group">
            <label for="name" class="control-label">正文:</label>
            <textarea class="form-control" name="post" rows="10" cols="10" required></textarea>
          </div>
          <div class="form-group">
            <button type="submit" class="btn btn-primary">发表</button>
           </div>
    </form>
</div>

　　　　3.8.2 文章模型

　　为了实现发布文章功能，首先创建Post对象，在models文件夹下创建post.js文件，该文件功能与user.js功能类似，用于存储新发布的文章及查询全部或指定用户的文章，post.js代码如下：

var mongodb = require('./db');

function Post(name, title, post) {
    this.name = name;
    this.title = title;
    this.post = post;
}

module.exports = Post;

//存储一篇文章及其相关信息
Post.prototype.save = function(callback) {
    var date = new Date();
    //存储各种时间格式，方便以后扩展
    var time = {
        date : date,
        year: date.getFullYear(),
        month: date.getFullYear() + "-" + (date.getMonth() + 1),
        day: date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate(),
        minute: date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + 
            date.getHours() + ":" + (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
    }
    //要存入数据库的文档
    var post = {
        name: this.name,
        time: time,
        title: this.title,
        post: this.post
    };
    //打开数据库
    mongodb.open(function(err, db) {
        if(err) {
            return callback(err);
        }
        //读取posts集合
        db.collection('posts', function(err, collection) {
            if(err) {
                mongodb.close();
                return callback(err);
            }

            //为user属性添加索引
            //collection.ensureIndex('user');
            
            //将文档插入到posts集合
            collection.insert(post, {safe: true}, function(err) {
                mongodb.close();
                if(err) {
                    return callback(err);    //失败，返回err数据
                }
                callback(null);    //返回err为空，即是null
            });
        });
    });
};

Post.get = function(name, callback) {
    //打开数据库
    mongodb.open(function(err, db) {
        if(err) {
            return callback(err);
        }
        //读取posts集合
        db.collection("posts", function(err, collection) {
            if(err) {
                mongodb.close();
                return callback(err);
            }
            //查找name属性为name的文章记录，如果name为null则查找全部记录
            var query = {};
            if(name) {
                query.name = name;
            }
            //根据query对象来查询文章,并按照时间排序
            collection.find(query).sort({time: -1}).toArray(function(err, docs) {
                mongodb.close();
                if(err) {
                    return callback(err);    //失败，返回err信息
                }
                callback(null, docs);    //成功，以数组的形式返回查询的结果
            });
        });
    });
};

　　　　3.8.3 发表响应

打开index.js,在User=require('../models/user.js')后添加一行代码：

Post = require('../models/post.js');

然后修改router.post('/post')的代码如下面所示：

router.post('/post', checkLogin);
router.post('/post', function(req, res) {
    var currentUser = req.session.user,
        post = new Post(currentUser.name, req.body.title, req.body.post);

    post.save(function(err) {
        if(err) {
            req.flash('error', err);
            return res.redirect('/');
        }
        req.flash('success', '发布成功！');
        res.redirect('/');    //发表成功即跳转到首页
    });
});

其次，需要修改index.ejs，让主页显示发表过的文章及其相关信息。打开index.ejs，修改如下所示：

<!-- 发表的文章内容 -->
<div class="list-group">
    <%  posts.forEach(function(post, index) { %> 
    <div class="list-group-item">
        <h4><a href="#"><%= post.title %></a></h4>
        <p class="list-group-item-text" style="padding: 10px 0;">
            <%- post.post %>
        </p>
        <p class="info">
            <a href="#"><%= post.name %></a>&nbsp;&nbsp;发布于：&nbsp;&nbsp;<%= post.time.minute %>
            <span class='glyphicon glyphicon-comment' style="padding:0 10px;">评论(0)</span>
            <span class="glyphicon glyphicon-share-alt">阅读(0)</span>
        </p>
    </div>
<% }); %>

最后，打开index.js，修改router.get('/')代码如下所示：

router.get('/', function(req, res) {
    Post.get(null, function(err, posts) {
        if(err) {
            posts = [];
        }
        res.render('index', { 
            title: '主页',
            user: req.session.user,
            posts: posts,
            success: req.flash('success').toString(),
            error: req.flash('error').toString()
        });
    });
});

　　　　

　　　　

---恢复内容结束---