大小屏智能推送平台产品系统

这是一款目标是打造一个“1个市级控制中心+各单位多个分中心”的管理架构，实现集中发布、分级分类精准推送以及应急发布等功能的项目。技

术栈汇集了业界最前沿的技术：前端分为管理端、控制端、播放端三个模块，采用了 Vue 2和 Vue 3框架进行模块化开发，后端则运用 Node.js、TypeScript、Nest.js及 typeorm 实现了稳定可靠的服务，数据层面则采用 PostSQL和 Redis 进行高性能存储，同时通过 HTTP和 Websocket(socket.io )实现了前后端的高效通信。
它成功实现了集中发布、分级分类精准推送以及应急发布等功能，大幅度提高了信息发布的效率和精准度。此项目的成功实施不仅提升了用户体验，降低了内容维护难度，而且在经济效益方面也有显著表现。在过程中，我成功地优化了代码结构，提高了系统运行效率，为公司节省了大量的开发资源，获得了领导和同事的一致好评。

在这个项目中，我负责全栈开发工作，包括设计和实现前端界面，构建并维护后端服务，以及调试与优化整个系统。
（1）在前端部分，我使用 Vue 2对后台管理端进行开发，成功实现了内容模块管理（包括内容发布、查询、内容标签、内容分类）和插播列表管理等复杂业务。该项目很好的实现了 MVC 思想，在项目中使用了 Vue 大部分的基础功能，使用 VueX 集中管理全局数据与方法，采用了不同方式实现了不同关系组件间的通信，使数据流井井有条。各个界面很好的实现了项目的组件化，模块化，封装了多款适用于项目的自定义 ElementU 组件以及方法，减轻了其他组员的工作压力。通过 VueRoute 实现项目内路由跳转，并通过对路由守卫实现对部分操作的限制以及业务的实现。通过实现数据持久化，保证用户不用刷新后重复登陆，为其提供便利。
（2）项目中，我还使用了 Vue 3框架构建了控制端。Vue 3的 Composition API 使得我能更加灵活地组织和复用代码，从而有效提高了开发效率和项目质量。
控制端主要负责对播放设备的实时管理，包括控制播放模式、切换播放内容、调整播放进度等功能。为了实现这些功能，我们需要一种可以实时反馈播放状态并且支持双向通信的技术。因此，我选择了 Websocket 作为前后端的通信方式。Websocket 是一种在单个 TCP 连接上进行全双工通信的协议，它让服务端可以主动发送数据给客户端。我采用 socket.io 库实现了基于 Websocket 的实时通信。通过在控制端与后端服务器之间建立 Websocket 连接，实时同步播放设备的状态信息，并根据用户操作发送控制指令到后端服务器，再由后端服务器将指令推送到播放设备。在这个过程中，我遇到了一些挑战，例如如何保持 Websocket 连接的稳定、如何优雅地处理网络异常等。但通过不断学习和实践，我成功地解决了这些问