一個簡單的blog系統（六） 實現留言功能

1.一個完整的博客怎麼能沒有留言功能，咱們把留言功能保存到本身的數據庫中：

　　咱們假定，只有在文章頁面纔會顯示留言板：

 

　　1.1 首先，打開post.js,修改Post.prototype.save中藥存儲的文檔爲：

//要存入數據庫的文檔
var post = {
    name: this.name,
    time: time,
    title: this.title,
    post: this.post,
    comments: []
};

　　1.2 咱們在文檔裏面增長了comments鍵，這是一個數組集合，用來存儲該文章的留言（一個個的對象）。爲了也讓留言支持markdown格式的語法，咱們修改Post.getOne函數裏的 doc.post = markdown.toHTML(doc.post); 修改成：

if(doc) {
                    doc.post = markdown.toHTML(doc.post);
                    doc.comments.forEach(function(comment) {
                        comment.content = markdown.toHTML(comment.content);
                    });
                }

　　1.3 接下來，咱們在models文件夾下新建comment.js文件，添加以下代碼：

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

function Comment(name, day, title, comment) {
      this.name = name;
     this.day = day;
      this.title = title;
      this.comment = comment; 
}

module.exports = Comment;

//存儲一條留言信息
Comment.prototype.save = function(callback) {
      var name = this.name,
          day = this.day,
          title = this.title,
          comment = this.comment;

      //打開數據庫
      mongodb.open(function (err, db) {
        if (err) {
              return callback(err);
        }
        //讀取 posts 集合
        db.collection('posts', function (err, collection) {
              if (err) {
                mongodb.close();
                return callback(err);
              }
              //經過用戶名、時間及標題查找文檔，並把一條留言對象添加到該文檔的 comments 數組裏
              collection.update({
                "name": name,
                "time.day": day,
                "title": title
              }, {
                $push: {"comments": comment}
              } , function (err) {
                 mongodb.close();
                  if (err) {
                    return callback(err);
                  }
                  callback(null);
              });   
        });
      });
};

　　1.4 而後，咱們修改index.js，添加一行代碼：

Comment = require('../models/comment.js');

　　1.5 接下來咱們建立comment視圖文件，在views文件夾下面新建comment.ejs，添加以下代碼：

<div class="container">
    <% post.comments.forEach(function (comment, index) { %>
          <p><a href="<%= comment.website %>"><%= comment.name %></a>
          <span> 回覆於 <%= comment.time %></span></p>
          <p><%- comment.content %></p>
    <% }) %>

    <form method="post" style="padding: 20px 0px;">
        <% if (user) { %>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">姓名：</span>
                  <input type="text" name="name" class="form-control" value="<%= user.name %>" aria-describedby="basic-addon1">
            </div>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">郵箱：</span>
                  <input type="text" name="email" class="form-control" value="<%= user.email %>" aria-describedby="basic-addon1">
            </div>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">網址：</span>
                  <input type="text" name="website" class="form-control" value="/u/<%= user.name %>" aria-describedby="basic-addon1">
            </div>
            <% } else { %>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">姓名：</span>
                  <input type="text" name="name" class="form-control" aria-describedby="basic-addon1">
            </div>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">郵箱：</span>
                  <input type="text" name="email" class="form-control" aria-describedby="basic-addon1">
            </div>
            <div class="input-group">
                  <span class="input-group-addon" id="basic-addon1">網址：</span>
                  <input type="text" name="website" class="form-control" value="http://" aria-describedby="basic-addon1">
            </div>
        <% } %>
        <br/>
        <div class="form-group">
              <label for="name" class="control-label">正文:</label>
              <textarea class="form-control" name="content" rows="3" cols="3"></textarea>
        </div>
          <div class="form-group">
            <button type="submit" class="btn btn-primary">留言</button>
           </div> 
    </form>
</div>

　　1.6 而後，咱們打開article.ejs，添加一行代碼：

<%- include comment %>

　　1.7 最後，咱們修改index.js註冊相應留言的post響應，添加以下代碼：

//留言相應頁面
router.post('/u/:name/:day/:title', function (req, res) {
      var date = new Date(),
          time = date.getFullYear() + "-" + (date.getMonth() + 1) + "-" + date.getDate() + " " + 
                 date.getHours() + ":" + (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
      var comment = {
          name: req.body.name,
          email: req.body.email,
          website: req.body.website,
          time: time,
          content: req.body.content
      };
      var newComment = new Comment(req.params.name, req.params.day, req.params.title, comment);
      newComment.save(function (err) {
        if (err) {
          req.flash('error', err); 
          return res.redirect('back');
        }
        req.flash('success', '留言成功!');
        res.redirect('back');
      });
});

至此，咱們就給博客增長了留言的功能。