多语言展示
当前在线:193今日阅读:86今日分享:14

Vue仿今日头条--服务器端

该系列是在《Express+MongoDB+Vue实现后台网站》进行扩展,基本的部署数据库、新建工程、接口调试工具和代码分析等,可自行查看,里面都有很详细的分析过程,这里不作重复的分析;  本文主要分析服务器端的修改代码,目录架构如下图。  Tips:更新于2019.11.25,增加表字段、评论列表和点赞功能等。
工具/原料

Sublime Text

配置app

配置app的代码,详细代码如下图(分析修改部分的代码):  1.代码“app.use(bodyParser.json({ limit: '100mb' }));”和“app.use(bodyParser.urlencoded({ limit: '100mb', extended: true }));”限制大小改为100mb,满足多图上传;  2.代码“app.all ****”做了以下修改,为了可以多个端口调用。

配置数据集
1

models文件夹下新增文章数据集article,代码如下图(分析重点代码):  1.定义文章集合中 文档的样式,代码如下图1,包含字段“类型”、“标题”、“作者”、“图片类型”(1-无图片、2-左右结构、3-上下结构)、“图片地址”、“视频地址”、“视频时长”、“是否播放”、“内容”、“点赞数”、“点赞记录表”、“阅读数”、“播放数”、“评论数”、“是否关注”、“是否首页推荐”和“创建日期”,可根据实际情况适当调整;  2.定义方法findArticles,用于获取全部文章数据,为了提高速度,做了分页功能(利用skip和limit,每一页只显示10条数据);为了方便查看,做了排序。

2

models文件夹下新增评论数据集comment,代码如下图(分析重点代码):  1.定义文章集合中 文档的样式,代码如下图1,包含字段“对应文字id”、“评论者”、“评论头像”、“点赞数”、“评论内容”、“是否显示”和“创建日期”,可根据实际情况适当调整;  2.定义方法findComments,用于获取全部评论数据,为了提高速度,做了分页功能(利用skip和limit,每一页只显示10条数据);为了方便查看,做了排序。

配置文章相关的接口(admin)
1

路由文件admin新增添加文章接口addArticle,代码如下图(分析重点代码):  1.前面四个if为了判断必填字段不能为空,虽然前端也会做检验,但为了安全性,后台也需要校验(视频改成不必填);  2.判断articleId是否存在,存在则为编辑保存,执行更新语句(article.update);如果不存在则为新增保存,执行保存语句(newArticle.save)。

2

路由文件admin新增删除文章接口delArticle,代码如下图(分析重点代码):  1.利用article.remove删除对应id的文章数据。

配置文章相关的接口(article)
1

新增路由文件article,存放跟文章有关且不需要验证登录状态的接口数据,代码如下图。

2

路由文件article新增获取文章信息接口getArticleInfo,代码如下图(分析重点代码):  1.利用article.findById获取对应id的文章数据。

3

路由文件article新增获取文章列表数据接口getArticlesList,代码如下图(分析重点代码):  1.分四种情况,    1)后台列表,因为列表会根据不同模块显示不同数据,所以这里根据类型+查询字段进行数据过滤显示,查询字段“标题”允许模糊查询($regex: req.body.searchTitle, $options: 'i');    2)后台首页,首页只跟“首页推荐”有关系,所以这里根据articleMainPage过滤显示;    3)前台视频显示栏目,根据类型+视频类型(data:video)进行数据过滤显示(因为后台允许视频不必填,前台只显示有视频的数据);    4)前台搜索,根据“标题”过滤显示,但允许模糊查询。  2.利用user.count获取到总页数,用于翻页使用。

4

路由文件article新增更新文章数据接口updateArticle,代码如下图(分析重点代码):  1.分“更新播放次数”、“更新阅读次数”、“更新评论次数”和“更新文章点赞列表”,后面分析前台功能会更详细说明。

5

路由文件article新增添加评论记录接口addComment,代码如下图(分析重点代码):  1.前面if为了判断必填字段不能为空,虽然前端也会做检验,但为了安全性,后台也需要校验。  Tips:评论记录属于文章的子表,所以要注意关联articleId。

6

路由文件article新增获取文章的评论记录接口getCommentRecord,代码如下图(分析重点代码):  1.分两种情况,    1)后台查询获取数据,根据文章id+评论者进行数据过滤显示,查询字段“评论者”允许模糊查询($regex: req.body.searchAuthor, $options: 'i');    2)前台数据显示,根据文章id+评论状态(是否显示)进行数据过滤显示。  Tips:前台会根据状态过滤,是考虑到出现不合适发言的时候,后台可以隐藏不显示。

7

路由文件article新增更新评论记录数据接口updateComment,代码如下图(分析重点代码):  1.分“更新评论状态”和“更新点赞次数”,后面分析相应功能会更详细说明。

推荐信息