Node.js 博客实例(六)留言功能
原教程 https://github.com/nswbmw/N-blog/wiki/_pages的第五章,由于版本等的原因,在原教程基础上稍加改动即可实现。
实现用户给文章留言的功能,留言保存在数据库中。
post.js ,修改 Post.prototype.save 中要存入的文档为:
//要存入数据库的文档 var post = { name: this.name, time: time, title: this.title, post: this.post, comments:[] };我们在文档里增加了 comments 键(数组),用来存储此文章上的留言(一个个对象)。为了也让留言支持 markdown 语法,我们将 Post.getOne 函数里的:
doc.post = markdown.toHTML(doc.post); 修改为:
//解析 markdown 为 html
if (doc) { <span style="white-space:pre"> </span>console.log("444"); doc.comments.forEach(function (comment) { comment.content = markdown.toHTML(comment.content); }); }blog/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); }); }); }); };修改 index.js ,在 Post = require(‘../models/post.js‘) 后添加一行代码:
Post=require('../models/post.js'), Comment=require('../models/comment.js');创建 comment 的视图文件,在 blog/views/ 文件夹下新建 comment.ejs ,添加如下代码:
<br /> <% post.comments.forEach(function (comment, index) { %> <p><a href="<%= comment.website %>"><%= comment.name %></a> <span class="info"> 回复于 <%= comment.time %></span></p> <p><%- comment.content %></p> <% }) %> <form method="post"> <% if (user) { %> 姓名:<input type="text" name="name" value="<%= user.name %>" /><br /> 邮箱:<input type="text" name="email" value="<%= user.email %>" /><br /> 网址:<input type="text" name="website" value="/u/<%= user.name %>" /><br /> <% } else { %> 姓名:<input type="text" name="name" /><br /> 邮箱:<input type="text" name="email" /><br /> 网址:<input type="text" name="website" value="http://" /><br /> <% } %> <textarea name="content" rows="5" cols="80"></textarea><br /> <input type="submit" value="留言" /> </form>注意:这里根据用户登录状态的不同,显示不同的提示信息。还需注意的一点是,未登录的用户在留言的时候, 网址 这一项需要加上 http:// 前缀,否则在生成连接的时候会基于当前 url (本地是 localhost:3000)。
打开article.ejs ,在 <%- include footer %> 前添加一行代码:
</pre><pre name="code" class="html"><%- include comment %>这样我们就在文章页面引入了留言模块。
index.js添加代码:
app.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'); }); });使用 res.redirect(‘back‘); ,即留言成功后返回到该文章页。
看看效果:
进入博客并登录,先发表一篇文章用来测试:
点击进入文章可看到留言板块,来留个言:
留言成功,再次点击进入文章查看留言:
注意:修改代码之后测试之前可以mongodb/blog文件夹下的内容清空以避免出现问题
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。