自媒体文章发布

1)自媒体前后端搭建

1.1)后台搭建

image-20210426110728659

 

①:资料中找到heima-leadnews-wemedia.zip解压

拷贝到heima-leadnews-service工程下,并指定子模块

执行leadnews-wemedia.sql脚本

添加对应的nacos配置

 

②:资料中找到heima-leadnews-wemedia-gateway.zip解压

拷贝到heima-leadnews-gateway工程下,并指定子模块

添加对应的nacos配置

 

③:在资料中找到类文件夹

拷贝wemedia文件夹到heima-leadnews-model模块下的com.heima.model

1.2)前台搭建

image-20210426110913007

通过nginx的虚拟主机功能,使用同一个nginx访问多个项目

 

搭建步骤:

①:资料中找到wemedia-web.zip解压

②:在nginx中leadnews.conf目录中新增heima-leadnews-wemedia.conf文件

 

③:启动nginx,启动自媒体微服务和对应网关

④:联调测试登录功能

image-20210426111329136

 

 

2)自媒体素材管理

2.1)素材上传

2.2.1)需求分析

image-20210426144327206

图片上传的页面,首先是展示素材信息,可以点击图片上传,弹窗后可以上传图片

2.2.2)素材管理-图片上传-表结构

媒体图文素材信息表wm_material

image-20210426144500239

对应实体类:

 

2.2.3)实现思路

image-20210426144603541

①:前端发送上传图片请求,类型为MultipartFile

②:网关进行token解析后,把解析后的用户信息存储到header中

③:自媒体微服务使用拦截器获取到header中的的用户信息,并放入到threadlocal中

在heima-leadnews-utils中新增工具类

注意:需要从资料中找出WmUser实体类拷贝到model工程下

在heima-leadnews-wemedia中新增拦截器

配置使拦截器生效,拦截所有的请求

④:先把图片上传到minIO中,获取到图片请求的路径——(2.2.5查看具体功能实现)

⑤:把用户id和图片上的路径保存到素材表中——(2.2.5查看具体功能实现)

2.2.4)接口定义
 说明
接口路径/api/v1/material/upload_picture
请求方式POST
参数MultipartFile
响应结果ResponseResult

MultipartFile :Springmvc指定的文件接收类型

ResponseResult :

成功需要回显图片,返回素材对象

失败:

2.2.5)自媒体微服务集成heima-file-starter

①:导入heima-file-starter

②:在自媒体微服务的配置中心添加以下配置:

2.2.6)具体实现

①:创建WmMaterialController

②:mapper

③:业务层:

业务层实现类:

④:控制器

⑤:测试

启动自媒体微服务和自媒体网关,使用前端项目进行测试

2.2)素材列表查询

2.2.1)接口定义
 说明
接口路径/api/v1/material/list
请求方式POST
参数WmMaterialDto
响应结果ResponseResult

WmMaterialDto :

ResponseResult :

2.2.2)功能实现

①:在WmMaterialController类中新增方法

②:mapper已定义

③:业务层

在WmMaterialService中新增方法

实现方法:

④:控制器:

⑤:在自媒体引导类中天mybatis-plus的分页拦截器

 

3)自媒体文章管理

3.1)查询所有频道

3.1.1)需求分析

image-20210426205631708

3.1.2)表结构

wm_channel 频道信息表

image-20210426210148580

对应实体类:

3.1.3)接口定义
 说明
接口路径/api/v1/channel/channels
请求方式POST
参数
响应结果ResponseResult

ResponseResult :

3.1.4)功能实现

接口定义:

mapper

service

实现类

控制层

3.1.5)测试

 

3.2)查询自媒体文章

3.2.1)需求说明

image-20210426210402672

 

3.2.2)表结构分析

wm_news 自媒体文章表

image-20210426210434861

对应实体类:

3.2.3)接口定义
 说明
接口路径/api/v1/news/list
请求方式POST
参数WmNewsPageReqDto
响应结果ResponseResult

WmNewsPageReqDto :

ResponseResult :

3.2.4)功能实现

①:新增WmNewsController

②:新增WmNewsMapper

 

③:新增WmNewsService

实现类:

④:控制器

3.2.5)测试

启动后端自媒体微服务和自媒体网关微服务,测试文章列表查询

 

3.3)文章发布

3.3.1)需求分析

image-20210427014931255

3.3.2)表结构分析

保存文章,除了需要wm_news表以外,还需要另外两张表

wm_material 素材表

image-20210427015037964

wm_news_material 文章素材关系表

image-20210427015054428

image-20210427015114994

其中wm_material和wm_news表的实体类已经导入到了项目中,下面是wm_news_material表对应的实体类:

3.3.3)实现思路分析

image-20210427015326728

1.前端提交发布或保存为草稿

2.后台判断请求中是否包含了文章id

3.如果不包含id,则为新增

3.1 执行新增文章的操作

3.2 关联文章内容图片与素材的关系

3.3 关联文章封面图片与素材的关系

4.如果包含了id,则为修改请求

4.1 删除该文章与素材的所有关系

4.2 执行修改操作

4.3 关联文章内容图片与素材的关系

4.4 关联文章封面图片与素材的关系

3.3.4)接口定义
 说明
接口路径/api/v1/channel/submit
请求方式POST
参数WmNewsDto
响应结果ResponseResult

WmNewsDto

前端给传递过来的json数据格式为:

ResponseResult:

3.3.5)功能实现

①:在新增WmNewsController中新增方法

②:新增WmNewsMaterialMapper类,文章与素材的关联关系需要批量保存,索引需要定义mapper文件和对应的映射文件

WmNewsMaterialMapper.xml

③:常量类准备

 

④:在WmNewsService中新增方法

实现方法:

④:控制器

3.3.6)测试