第3章 使用mongodb实现首页的动态显示

请关注我的小站：http://oideas.herokuapp.com/

1.mongodb的配置

首先在你觉得合适的地方建立一个bat，内容如下：

@echo off  
d:  
cd D:\other\mongodb-win32-i386-2.4.9\bin  
mongod -dbpath D:\other\mongodb-win32-i386-2.4.9\ominds  

由于我是在e盘建的，所以要切换到d盘，D:\other\mongodb-win32-i386-2.4.9\bin是你的mongodb安装位置，在mongodb目录下新建文件夹ominds作为我们的项目db，mongod -dbpath D:\other\mongodb-win32-i386-2.4.9\ominds表示我们使用这个目录作为db。好，db的server启动配置好了，下面 让我们在项目中使用它。 打开项目下的package.json文件，修改后的最终代码如下：

{  
  "name": "OMinds",  
  "version": "0.0.1",  
  "private": true,  
  "scripts": {  
    "start": "node app.js"  
  },  
  "dependencies": {  
    "express": "3.2.6",  
    "ejs": "*",  
    "mongodb": "*",  
    "connect-mongo": "*",  
    "connect-flash": "*"  
  }  
}

在项目的根目录下（本章最后有一张项目的结构图，你可以对比一下），新建db-set.js文件：

module.exports = {   
	cookieSecret: 'ominds',   
	db: 'ominds',   
	host: 'localhost'  
};

在项目的根目录下，新建目录models，新建db.js文件：

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

打开app.js：文件，最终修改结果：

/**  
 * Module dependencies.  
 */  
  
  
var express = require('express')  
  , routes = require('./routes')  
  , http = require('http')  
  , path = require('path');  
var MongoStore = require('connect-mongo')(express);  
var settings = require('./db-set');  
var flash = require('connect-flash');  
var app = express();  
// all environments  
app.set('port', process.env.PORT || 3000);  
app.set('views', __dirname + '/views');  
app.set('view engine', 'ejs');  
app.use(flash());  
app.use(express.favicon());  
app.use(express.logger('dev'));  
app.use(express.bodyParser());  
app.use(express.methodOverride());  
app.use(express.cookieParser());  
app.use(express.session({  
  secret: settings.cookieSecret,  
  key: settings.db,//cookie name  
  cookie: {maxAge: 1000 * 60 * 60 * 24 * 30},//30 days  
  store: new MongoStore({  
    db: settings.db  
  })  
}));  
app.use(app.router);  
app.use(express.static(path.join(__dirname, 'public')));  
if ('development' == app.get('env')) {  
  app.use(express.errorHandler());  
}  
routes(app);  
  
  
http.createServer(app).listen(app.get('port'), function(){  
  console.log('Express server listening on port ' + app.get('port'));  
});  

打开cmd，切换到项目目录下，输入npm install 等待安装，效果如下图：

在目录models下新建mind.js文件：

var mongodb = require('./db');  
var ObjectID = require('mongodb').ObjectID;  
  
  
function Mind(mind) {  
    this.content = mind.content;  
    this.ups = mind.ups;  
    this.downs = mind.downs;  
    this.cdate = mind.cdate;  
    this.user =mind.user;  
    this.comments = mind.comments;  
    this.flag = mind.flag;  
    this._id =mind._id;  
};   
module.exports = Mind;  
//save 方法（增）  
Mind.prototype.save = function(callback) {  
    var date = new Date();  
    var time = date.getFullYear()+ "-"+ (date.getMonth() + 1)+ "-"+ date.getDate()+ " "+ date.getHours()+ ":"+ (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())+ ":"+ (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());  
    var mind = {  
        content : this.content,  
        ups : 0,  
        downs : 0,  
        cdate : time,  
        user :this.user,  
        comments : 0,  
        flag : this.flag  
    };  
    // 打开数据库  
    mongodb.open(function(err, db) {  
        if (err) {  
            return callback(err);// 错误，返回 err 信息  
        }  
        // 读取 minds 集合  
        db.collection('minds', function(err, collection) {  
            if (err) {  
                db.close();  
                return callback(err);  
            }  
            // insert  
            collection.insert(mind, {  
                safe : true  
            }, function(err, mind) {  
                db.close();  
                if (err) {  
                    return callback(err);  
                }  
                callback(null, mind[0]);// 成功！err 为 null，并返回存储后的用户文档  
            });  
        });  
    });  
};  
// 查詢 （查）  
Mind.getAll = function(callback) {  
    mongodb.open(function(err, db) {  
        if (err) {  
            return callback(err);  
        }  
        db.collection('minds', function(err, collection) {  
            if (err) {  
                db.close();  
                return callback(err);  
            }  
            // 查詢 所有的minds，以cdate降序排序，最后转换为数组。  
            collection.find().sort({cdate: -1}).toArray(function(err, minds) {  
                db.close();  
                if (err) {  
                    return callback(err);  
                }  
                callback(null, minds);  
            });  
        });  
    });  
};  
  
  
//update 更改（改）  
Mind.update = function(id,ups,downs,comments,callback) {  
    mongodb.open(function(err, db) {  
        if (err) {  
            return callback(err);//错误，返回 err 信息  
        }  
        db.collection('minds', function(err, collection) {  
            if (err) {  
                db.close();  
                return callback(err);  
            }  
            collection.update({  
                _id :new  ObjectID(id)  
            }, {  
                $set: {ups: ups,downs:downs,comments:comments}  
            },function(err, mind) {  
                db.close();  
                if (err) {  
                    return callback(err);  
                }  
                callback(null, mind);  
            });  
        });  
    });  
};  
//delete 删除（删）  
Mind.removeById = function(id,callback) {  
    mongodb.open(function(err, db) {  
        if (err) {  
            return callback(err);  
        }  
        db.collection('minds', function(err, collection) {  
            if (err) {  
                db.close();  
                return callback(err);  
            }  
            collection.remove({  
                _id :new  ObjectID(id)  
            },function(err) {  
                db.close();  
                if (err) {  
                    return callback(err);// 失败！返回 err 信息  
                }  
                callback(null);  
            });  
        });  
    });  
};  

以上是对表minds的增、删、改、查方法，还没有验证是否正确，minds的几个属性也无需详细说明，其中flag是作为之后投稿审核功能的一个字段，暂时先放着，接下来继续。

2.首页数据的读取于插入

那么，打开routes/index.js文件，最终修改为：

var crypto = require('crypto');  
var Mind = require('../models/mind.js');  
  
//trim方法  
function trimStr(str){  
    if(str){  
        return str.replace(/(^\s*)|(\s*$)/g,"");  
    }  
}  
  
module.exports = function(app) {  
  app.get('/', function (req, res) {  
      Mind.getAll(function(err, minds) {  
          if(err){  
              minds = [];  
          }  
          res.render('index', {  
                title : 'OMinds - 最新',  
                minds : minds });  
      });  
  });  
  app.get('/upminds', function (req, res) {  
        res.render('upminds', { title: 'OMinds - 投稿' ,  
            error : req.flash('error').toString(),  
            ocontent:req.flash('ocontent').toString()  
        });  
  });  
  app.post('/putup',function (req, res) {  
        var user = req.session.user;  
        var cont = trimStr(req.body.mind_text);  
        if(cont==null||cont.length<40||cont.length>700){  
            req.flash('error', "您的投稿不符合条件，请修改后提交。");  
            req.flash('ocontent', cont);  
            return res.redirect('/upminds');  
        }  
        var mind;  
        var flag = true;  
        //no login  
        if (!user) {  
            mind = new Mind({  
                content : cont,  
                user : null,  
                flag : flag  
            });  
            mind.save(function(err, mind) {  
                if (err) {  
                    req.flash('error', err);  
                    return res.redirect('/upminds');  
                }  
                res.redirect('/');  
            });  
        }   
        // login  
        else {  
            //暂时不做处理  
        }  
    });  
};  

其中app.get('/')里面读取了所有的minds，传到前端显示，app.get('/upminds')中加了两个参数，是用于错误跳转的。app.post('/putup')是投稿页面，表单提交后的处理。 打开views/index.ejs，将cell的div复制一份（作为参考用的，没什么别的意思），最终代码如下：

<%- include header%>  
    <div class="content">  
        <div class="cell">  
            <div class="cell_author" >  
                <img src="/images/tem.jpg" title="OMinds">  
                <a href="/">OMinds</a>  
                <span class="cell_loc" title="1楼">1#</span>  
            </div>  
            <div class="cell_text" title='' >  
                OMinds，发表你的心事，你可以不用登录，不用在乎是否会被别人嘲笑，因为在这里大家都是一样的没有谁会嘲笑你。                   
            </div>  
            <div class="cell_bar">  
                <ul style="padding:0">  
                    <li><a id="putgoods" name="putgoods" href="#" title="10个赞" >赞[10]</a></li>  
                    <li><a id="putbads" name="putbads" href="j#" title="10个踩">踩[10]</a></li>  
                </ul>  
                <ul class="cell_bar_comm">  
                    <li><a href="#" title="10条评论" >评[10]</a></li>  
                    <div class="bshare-custom" style="float:right;height:28px;margin-top: 4px;"><a title="分享到QQ空间" class="bshare-qzone"></a>  
                    <a title="分享到新浪微博" class="bshare-sinaminiblog"></a>  
                    <a title="分享到人人网" class="bshare-renren"></a>  
                    <a title="分享到腾讯微博" class="bshare-qqmb"></a>  
                    <a title="分享到网易微博" class="bshare-neteasemb"></a>  
                    <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&uuid=;pophcol=2&lang=zh"></script>  
                    <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>  
                    <script type="text/javascript" charset="utf-8">  
                        bShare.addEntry({  
                            title:"OMinds分享",  
                            summary:'分享你的心事。' ,  
                            vTag:'OMinds'});  
                    </script>  
                </ul>  
            </div>  
        </div>  
        <% minds.forEach(function (mind, index) { %>  
        <div class="cell">  
            <div class="cell_author" >  
                <img src="/images/tem.jpg" title="OMinds">  
                <a href="/">OMinds</a>  
                <span class="cell_loc" title="<%=(index+1)%>楼"><%=(index+1)%>#</span>  
            </div>  
            <div class="cell_text" title='<%=mind.cdate%>' >  
                <%=mind.content%>                   
            </div>  
            <div class="cell_bar">  
                <ul style="padding:0">  
                    <li><a id="putgoods" name="putgoods" href="#" title="<%=mind.ups%>个赞" >赞[<%=mind.ups%>]</a></li>  
                    <li><a id="putbads" name="putbads" href="j#" title="<%=mind.downs%>个踩">踩[<%=mind.downs%>]</a></li>  
                </ul>  
                <ul class="cell_bar_comm">  
                    <li><a href="#" title="<%=mind.comments%>条评论" >评[<%=mind.comments%>]</a></li>  
                    <div class="bshare-custom" style="float:right;height:28px;margin-top: 4px;"><a title="分享到QQ空间" class="bshare-qzone"></a>  
                    <a title="分享到新浪微博" class="bshare-sinaminiblog"></a>  
                    <a title="分享到人人网" class="bshare-renren"></a>  
                    <a title="分享到腾讯微博" class="bshare-qqmb"></a>  
                    <a title="分享到网易微博" class="bshare-neteasemb"></a>  
                    <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/buttonLite.js#style=-1&uuid=;pophcol=2&lang=zh"></script>  
                    <script type="text/javascript" charset="utf-8" src="http://static.bshare.cn/b/bshareC0.js"></script>  
                    <script type="text/javascript" charset="utf-8">  
                        bShare.addEntry({  
                            title:"OMinds分享",  
                            summary:'分享你的心事。' ,  
                            vTag:'OMinds'});  
                    </script>  
                </ul>  
            </div>  
        </div>  
        <%})%>  
    </div>  
<%- include footer%>  

打开upminds.ejs，修改后：

<%- include header%>  
    <div class="main">  
        <div class="upideas_content clear_fix">  
            <div class="up_content clear_fix">  
                <div class="up_bar">  
                <h3>投稿须知</h3>  
                <ol style="padding:0;">  
                    <li>分享自己或朋友的Minds（心事），不浮夸、有意义，不含政治、色情、广告、诽谤、歧视等内容。</li>  
                    <li>分享的Minds（心事），将在审核之后发布。</li>  
                    <li>转载请注明出处，任何由Minds引发的法律等纠纷，本站概不负责。</li>  
                    <li>不得盗用站内其他会员的Minds。</li>  
                </ol>  
                </div>  
                <div class="up_content_text">  
                    <form method="post" action="putup" >  
                        <textarea id="mind_text" name="mind_text" class="up_idea_text" rows="23" required placeholder="分享你的Minds（心事）..." ><%if(ocontent!=null&&ocontent!=''){%><%=ocontent%><%}%></textarea>  
                        <span class="up_idea_err"><%= error %></span><button type="submit" class="up_idea_btn" id="idea_btn" >投递</button>  
                    </form>  
                </div>  
            </div>  
        </div>  
    </div>  
<%- include footer%>  

ok，将mongdb的bat跑起来，再启动项目的server的bat，用浏览器看一下效果吧，可以使用投稿功能，投稿后在首页显示了。

OK，动态显示已经做出来了，下一章~~~~doing。

工程结构图：

ideas-ominds交流群：158325682，有想要一起做的，或者有什么不懂的都可以找我哦。