Django blog项目《九》：文章模块《分析》

在写完用户模块后后，接下来就是文章模块了。

对文章模块来说总的就是这几部分：

1. 数据库模型设计
2. 文章标签功能
3. 热门文章功能
4. 文章轮播图功能
5. 文章列表
   1. 文章详情
   2. 评论
   3. 评论回复
6. 文章搜索功能

一、数据库设计

从主页面的数据结构来看，对文章模块这里需要设计这么几个表：

1. 文章标签表
2. 文章表
3. 热门文章表
4. 文章轮播图表
5. 评论表

具体数据库表设计如下：

1. 文章标签表

字段名	字段类型	关联表	关联类型	关联操作
id	int
name	char
create_time	datetime
update_time	datetime
is_delete	boolean

2. 文章表

字段名	字段类型	关联表	关联类型	关联操作
id	int
title	char
digest	char
content	text
clicks	integer
image_url	url
author_id	int	users.Users	ManyTOone	SET.NULL
tag_id	int	Tags	ManyToOne	SET.NULL
create_time	datetime
update_time	datetime
is_delete

3. 热门文章表

字段名	字段类型	关联表	关联类型	关联操作
id	int
priority	int
article_id	int	Article	OneToOne	CASCADE
create_time	datetime
update_time	datetime
is_delete	boolean

4. 文章轮播图表

字段名	字段类型	关联表	关联类型	关联操作
id	int
image_url	url
priority	int
article_id	int	Article	OneToOne	CASCADE
create_time	datetime
update_time	datetime
is_delete	boolean

5. 评论表

字段名	字段类型	关联表	关联类型	关联操作
id	int
content	char
author_id	int	users.Users	ManyToOne	SET.NULL
article_id	int	Article	ManyToOne	CASCADE
parent	int	self	ManyToOne	CASCADE
create_time	datetime
update_time	datetime
is_delete	boolean

由于所有的表里面都有：create_time、update_time、is_delete这三个字段，因此将这个三个字段作为公用字段进行封装，后面的所有表进行继承这个表。

最终的数据库表格设计为：

二、文章标签功能

实现比较简单，从数据库中获取所有数据显示到index页面就行

1. 业务流程

1. 从数据库中获取到文章标签数据
2. 传递给前端
3. 前端填充到html中

2. 请求方式、地址、参数

1. 请求方式：GET
2. 请求地址：/news/index/
3. 请求参数：无

三、文章列表

1. 文章列表

1. 业务流程

1. 动态加载文章列表
2. 将tag_id和page_num传递到后端
3. 从Article数据库中获取到数据
4. 对数据进行分页
5. 对该页数据进行序列化处理
6. 将数据返回到前端

2. 请求方式、地址、参数

1. 请求方式：GET

2. 请求地址：/news/article_list/

3. 请求参数：

   参数名	类型	是否必传	备注
   tag_id	int	否
   page_num	int	否

3. 前端处理

1. 为文章标签设置点击属性，点击后变为active状态
2. 设置鼠标滚轮判断，判断是否滑到底，滑到底进行动态加载文章
3. 构建ajax参数：文章标签tag_id和页数page_num
4. 发送ajax请求：
   • 成功后将数据填充到文章列表的html代码中
   • 返回到前端

4. 后端处理

1. 从前端获取到数据tag_id和page_num，并判断是否有传，没有传给其设置默认值
2. 从数据库中Article表中获取到需要传递到前端的信息：id、title、digest、update_time、clicks、image_url、author、tag_name
3. 对获取的额数据进行分页
4. 返回分页后当前页的数据
5. 对数据进行序列化
6. 将数据传递到前端

2. 文章详情和显示评论

1. 业务流程

1. 从数据库Article中获取到数据
2. 判断article是否存在
3. 从Comments标签偶去到数据
4. 对数据进行序列化
5. 将数据返回到前端

2. 请求方式、地址、参数

1. 请求方式：GET
2. 请求地址：/news/article_detail/<int:article_id>
3. 请求参数：无

3. 前端处理

1. 设置点击文章列表a标签发送ajax请求
2. ajax请求成功后进入到

4. 后端处理

1. 从数据库中Article表中获取到数据：title、update_time、content、tag_name、author
2. 判断输入的article_id是否存在
3. 从数据库中Comments表中获取到数据：content、update_time、author__username、parent__author__username、parent__content、parent__update_time
4. 对comments数据进行徐序列化处理（评论序列化处理在models中创建一个字典来处理自身）
5. 将数据信息返回到前端

3. 文章评论

1. 业务流程

1. 判断用户是否登录
2. 前端传递article_id、content给后端
3. 判断content是否为空
4. 判断parent_id是否为空、是否为整数
5. 判断article_id和parent_id是否是同一片文章
6. 数据保存到数据库
7. 返回数据到前端

2. 请求方式、地址、参数

1. 请求方式：POST

2. 请求地址：/news/<int:article_id>/comments/

3. 请求参数：

   参数名	类型	是否必传	备注
   article_id	int	必传	路径参数
   content	string	必传	ajax请求传入

3. 前端处理

1. 用户登录判断（登录才能评论，匿名不能评论）
   • 发送ajax post请求，判断是否是登录用户
   • 不是就跳转到登录页面
2. 发表评论
   • 获取到回复该文章的id，评论的id
   • 构造ajax请求参数：content
   • 发送ajax请求
   • 返回数据填充到前端
     1. 填充文章评论数变化
     2. 填充评论信息：评论人、时间、内容

4. 后端处理

1. 构建一个post请求（带路径参数article_id）
2. 判断是否该用户已经登录
3. 获取前端传来的数据、并转化为字典
4. 取出数据content、并判断是否为空
5. 取出数据parent_id、并判断是否为空
6. parent_id不为空的情况下判断传来的article_id和parent_id是否同时满足是同一篇文章
7. 保存评论信息数据到数据库
8. 返回序列化的数据到前端

4. 文章评论回复

1. 业务流程

1. 判断用户是否登录
2. 前端传递article_id、content、parent_id给后端
3. 判断content是否为空
4. 判断parent_id是否为空、是否为整数
5. 判断article_id和parent_id是否是同一片文章
6. 数据保存到数据库
7. 返回数据到前端

2. 请求方式、地址、参数

1. 请求方式：POST

2. 请求地址：/news/<int:article_id>/comments/

3. 请求参数：

   参数名	类型	是否必传	备注
   article_id	int	必传	路径参数
   content	string	必传	ajax请求传入
   parent_id	int	否	ajax请求传入3. 前端处理

3. 前端处理

1. 获取到回复该文章的id，回复的内容、回复该条评论的父评论id
2. 构造ajax请求参数：content、parent_id
3. 发送ajax请求
4. 返回数据填充到前端
   1. 填充文章评论数变化
   2. 填充评论信息：评论人、时间、内容

4. 后端处理

1. 构建一个post请求（带路径参数article_id）
2. 判断是否该用户已经登录
3. 获取前端传来的数据、并转化为字典
4. 取出数据content、并判断是否为空
5. 取出数据parent_id、并判断是否为空
6. parent_id不为空的情况下判断传来的article_id和parent_id是否同时满足是同一篇文章
7. 保存评论信息数据到数据库
8. 返回序列化的数据到前端

四、热门文章

实现方法和文章标签的实现方法一样。

1. 请求方式、地址、参数

1. 请求方式：GET
2. 请求地址：/news/index/
3. 请求参数：无

2. 实现逻辑

实现逻辑：

• 从数据库中HotArticle表中获取到热门文章的：id、image_url、tiitle
• 传递给前端

五、文章轮播图

1. 业务流程

1. 从数据库中获取到轮播图表数据
2. 在前端设置轮播图的小圆点功能
3. 设置左右点击的切换键功能
4. 设置定时切换功能

2. 请求方式、地址、参数

1. 请求方式：GET
2. 请求地址：/news/banner/
3. 请求参数：无

3. 前端处理

1. 设置轮播图的小圆点功能
2. 设置左右点击的切换键功能
3. 设置定时切换功能
4. 发送ajax请求：
   • 成功后将数据填充到前端html代码中
     • 轮播图片只有1张
     • 轮播图超过1张

4. 后端处理

后端views逻辑

1. 从数据库中Banner表中获取到轮播图需要的数据：image_url、article_id、article_title
2. 进行序列化处理
3. 传递给前端

六、文章搜索

1. 业务流程

1. 使用elasticsearch来做搜索引擎来实现全文检索
2. 定义一个search_indexes.py来进行数据的预处理
3. 定义一个templates/search/index/news/articles_text.txt来存放作为索引关键字
4. 在view中来定义一个类视图来处理数据：
   1. 用户没有输入搜索关键字
   2. 用户输入了搜索关键字

2. 请求方式、地址、参数

1. 请求方式：GET

2. 请求地址：/news/search/

3. 请求参数：

   参数名	参数类型	是否必传	备注
   q	字符	否	用户输入的搜关键字
   page	int	否	用户点击的页数

3. 前端处理

1. 填充搜索到的内容
2. 填充分页数据

4. 后端处理

后端views逻辑

1. 接收前端传来的搜索关键字

2. 判断搜索关键字是否为空

   1. 空

      • 设置show为True
      • 显示热门文章
      • 进行分页
      • 返回数据到前端

   2. 不为空

      • 设置show为False

      • 返回数据到前端