6、页面发布消费方和生产方的-白红宇

6、页面发布消费方和生产方的

阅读量：335 次

发布时间：2019-03-04

本文共 4706 字，大约阅读时间需要 15 分钟。

发布一个页面，需发布到该页面所属的每个站点服务器，其它站点服务器不发布

比如：发布一个门户的页面，需要发布到每个门户服务器上，而用户中心服务器则不需要发布

所以本项目采用routing模式，用站点id作为routingKey，这样就可以匹配页面只发布到所属的站点服务器上

页面发布流程：

1、前端请求cms执行页面发布
2、cms执行静态化程序生成html文件
3、cms将html文件存储到GridFS中
4、cms向MQ发送页面发布消息
5、MQ将页面发布消息通知给Cms Client
6、Cms Client从GridFS中下载html文件
7、Cms Client将html保存到所在服务器指定目录

创建Cms Client工程作为页面发布消费方，将Cms Client部署在多个服务器上，它负责接收到页面发布的消息后从GridFS中下载文件在本地保存

页面发布消费方：

需求：

1、将cms Client部署在服务器，配置队列名称和站点ID
2、cms Client连接RabbitMQ并监听各自的“页面发布队列”
3、cms Client接收页面发布队列的消息
4、根据消息中的页面id从mongodb数据库下载页面到本地

调用dao查询页面信息，获取到页面的物理路径，调用dao查询站点信息，得到站点的物理路径

页面物理路径=站点物理路径+页面物理路径+页面名称

从GridFS查询静态文件内容，将静态文件内容保存到页面物理路径下

创建Cms Client工程：

1、pom中添加amqp、mongodb、io、fastjson依赖

2、yml文件中配置MongoDB、rabbitmq服务

3、编写RabbitmqConfig配置类

创建交换机

每个队列与交换机绑定

配置队列名称和routingKey，将站点ID作为routingKey

最重要还是这个配置类

定义消息格式：消息内容采用json格式存储数据

PageService：

保存html页面到服务器物理路径：

根据pageId查询cmsPage表获取：FileId、SiteId、PageName、PagePhysicalPath；

拼接页面的物理路径；

将页面的物理路径保存到服务器物理路径上；

ConsumerPostPage：

作为发布页面的消费客户端，监听页面发布队列的消息，收到消息后从mongodb下载文件，保存在本地。

页面发布生产方：

CMS系统作为页面发布的生产方，管理员通过 cms系统发布“页面发布”的消费。

1、yml中配置Rabbitmq的连接参数

2、pom中配置amqp

3、RabbitMQConfig配置

由于cms作为页面发布方要面对很多不同站点的服务器，面对很多页面发布队列，所以这里不再配置队列，只需要配置交换机即可。

4、在PageService类中定义页面发布方法postPage、发送页面发布消息sendPostPage、保存静态页面内容saveHtml。

代码执行流程：

在page_list.vue页面


   
    发布

点击发布调用postPage方法：

postPage: function (pageId) {
           this.$confirm('确认发布该页面吗?', '提示', {
   }).then(() => {
             cmsApi.page_postPage(pageId).then((res) => {
               if (res.success) {
                 console.log('发布页面id=' + pageId);              this.$message.success('发布成功，请稍后查看结果');            } else {
                 this.$message.error('发布失败');            }          });        }).catch(() => {
           });      }

调用page_postPage请求后端接口：

/*发布页面*/export const page_postPage= id => {
     return http.requestPost(apiUrl+'/cms/page/postPage/'+id)}

执行CmsPageController中方法：

该方法执行完成调用rabbitTemplate.convertAndSend方法发送消息：

Client监听到mq消息时会调用PageService中的savePageToServerPath方法进行消费

思考：

1、如果发布到服务器的页面内容不正确怎么办？

2、一个页面需要发布很多服务器，点击“发布”后如何知道详细的发布结果？

3、一个页面发布到多个服务器，其中有一个服务器发布失败时怎么办？

用户的操作流程：

1、进入我的课程
2、点击“添加课程”，进入添加课程界面
3、输入课程基本信息，点击提交
4、课程基本信息提交成功，自动进入“管理课程”界面，点击“管理课程”也可以进入“管理课程”界面
5、编辑图片上传课程图片
6、编辑课程营销信息营销信息主要是设置课程的收费方式及价格
7、编辑课程计划添加课程计划

课程计划：定义了课程的章节内容，课程计划包括两级，第一级是课程的大章节、第二级是大章节下属的小章节，每个小章节通常是一段视频，学生点击小章节在线学习

代码实现：

前端使用element-ui 的tree组件来完成，在course_plan.vue文件中添加tree组件的代码

数据对象：

data() {
         return {
           mediaFormVisible:false,        teachplayFormVisible:false,//控制添加窗口是否显示        teachplanList : [{
             id: 1,          pname: '一级 1',          children: [{
               id: 4,            pname: '二级 1-1',            children: [{
                 id: 9,              pname: '三级 1-1-1'            }, {
                 id: 10,              pname: '三级 1-1-2'            }]          }]        }],        defaultProps:{
             children: 'children',          label: 'pname'        },        teachplanRules: {
             pname: [            {
   required: true, message: '请输入课程计划名称', trigger: 'blur'}          ],          status: [            {
   required: true, message: '请选择状态', trigger: 'blur'}          ]        },        teachplanActive:{
   },        teachplanId:''      }    }

后端采用表的自连接方式进行查询，mapper.xml文件的SQL语句如下：

说明：针对输入参数为简单类型#{}中可以是任意类型，判断参数是否为空要用 _parameter（它属于mybatis的内置参数）

添加课程计划：

上级结点说明：

不选择上级结点表示当前课程计划为该课程的一级结点。

当添加该课程在课程计划中还没有节点时要自动添加课程的根结点

添加课程计划采用弹出窗口组件Dialog

1、在course_plan.vue页面添加添加课程计划的弹出窗口代码：

2、在数据模型中添加如下变量：

teachplayFormVisible:false,//控制添加窗口是否显示

3、后台CourseController中编写addTeachplan方法

测试流程：

1、新建一个课程

2、向新建课程中添加课程计划

添加一级结点

添加二级结点

转载地址：http://trie.baihongyu.com/

你可能感兴趣的文章