2020·11（下）
143
作者简介：刘海，青岛市广播电视台。
刘 海
摘 要 为了能够建立一种跨平台的多媒体终端交互大屏系统，同时使用IP 网路和青岛数字广播嵌入信号，青岛台结合自身的多媒体资源研发了一款试验产品，使用国产自主研发的芯片作为数字广播嵌入信号解码核心，结合自主研发的交互程序与监测系统，做出了一款平时可交互展示、应急时可利用广播应急信号响应信息的多媒体屏幕。关键词 多媒体终端；嵌入式系统；Electron 技术；交互式大屏 中图分类号 TP3 文献标识码 A 文章编号 1674-6708（2020）271-0143-03
随着多媒体户外大屏的兴起，公共场所、地铁、广场等地都纷纷投入了众多媒体设备，这些设备不仅有效地提升了宣传内容的传播效率，一些可交互式的智能屏设备更是提供了体验良好的公共服务。本文结合青岛市广播电视台的应用开发实例，分享在嵌入式系统中开发多媒体可交互式屏幕的经验与应用。
1 开发系统产品介绍
青岛是多媒体起步较早的地区，近年更是尝试了多媒体门户平台、App 与相应网站、移动电视与同频数字广播等各种技术传播手段，于是开发一种基于IP 网络和广播网络双网结构的户外大屏系统，能集中展示青岛台多种媒体的综合大屏的研发与实践便随之展开。最终我们交付了一套跨平台的程序软体以及几种交互终端，它能将青岛数字广播、主流网站、青岛台多媒体平台、以及日常公益信息的展示融为一体。图1展示的终端高为2 300mm，宽为880mm，配以55寸3 000
尼特高亮度交互触摸屏。
图1 高亮度交互触摸屏
2 系统的功能
这款设备之所以设计成双网结构——IP 网
与数字广播接收网，目的在于通过终端内置CDR
（Convergent Digital Radio）广播接收系统解码出青岛试播的数字广播嵌入信息，该信息在灾害来临时，即使IP 网断开，仍能通过广播这种灾害中被证明最有效的传播方式，来提供紧急的应急与服务信息[1]。CDR 数字广播系统智能屏实时接收同频广播信息，通过独有芯片解码出文字与图片信息，软件设定展示权限为最高级别，接收完整信息后屏幕将强制锁定为应急展示界面（图2），同时系统声音功放将播放相应信息。当无应急事件时，系统将使用高速IP 网络进行工作，终端可进入交互式界面（图3），用以展示指定的链接内容，链接功能使用了安全技术，不可随意输入，不可下载资源或运行脚本，技术上实现了浏览内容的安全；同时界面可随时更新，用以引导众多浏览公益知识、宣教
内容。
踢踏舞鞋
图2 锁屏应急信息界面 图3 交互界面
大屏同时支持播出单播放，在指定时段展示媒
体内容，包括指定的图片、视频、以及电视广播节目，
2020·11（下）《科技传播》
144
ipanel支持实时推流直播，可由后台将各种直播信号推流到服务器，并由大屏幕展示。
3 系统的设计与实现
多媒体系统逻辑上由显示系统、CDR （Convergent Digital Radio）接收系统、状态监测系统三大部分构造而成，如图4所示，显示系统负责所有的界面交互逻辑与平时公益信息的展示；CDR 接收系统负责实时接收CDR 广播的内容，并解压提出相关的嵌入信号，解压后通过相应的串口信号发送到显示系统；状态监测系统则时刻注意着设备自身的状态，通过浸水检测器、烟火监测器、防震检测器等嵌入模块，随时监控设备的状态，并将信息发送到监控中心。这三部分各自由编写的三个程序控制，并配有进程狗，在各类Linux 系统和Windows
系统上均能良好的编译运行。
图4 多媒体系统中配备的三个子模块系统
三个系统互相独立存在，通过连线与协议互相连接。CDR 接收系统在得到报警信息后，还能直接输出蜂鸣报警声音，避免单独一个系统损坏影响其它系统功能。3.1 显示系统
显示系统是展示的核心，也是最为复杂的部分，在考虑到多平台、易于开发部署、生态丰富等要求后，最终采用了Electron 技术[2]，这让我们不仅可以方便测试，也便于在不同的系统下，读取多种连接串口的输入信号。
在实际开发中，我们运用了Vue [3]与Electron 结合的方式来进行技术实现，使用的Vue-Electron-builder [4]。之所以选择Vue 技术，他有几大优势：
1）它赋予界面开发一个MVVM（Model，View，ViewModel）的架构。
2）它将Electron 中的多网页结构变成了SPA 架构（Single Page Application），单网页架构的最大好处在与它节省了Electron 中各窗口之间的多线程通信，即再也不用使用多个ipcMain 与ipcRender 之间相互通信，降低了通信研发成本。
3）通过VUE 的router 机制，可以做出复杂的界面逻辑，并尽量保证其组件化，开发起来迅捷 快速。
4）通过Vue 搭建的VUEX，可以保持状态的统
一化以及通用功能在组件之间的复用。3.2 串口输入信号的处理
从前文阐述中可知，我们的显示系统一直在接收CDR 接收系统解码出来的串口信号。这里涉及两个问题，一是广播解码下来的串口信号并不稳定，偶有误码产生；一是我们需要在显示中锁屏，使得界面无法交互并立即显示正确信息。
解决串口信息不稳定的情况要从我们的实际测试中来寻比较合适的办法。CDR 嵌入信号目前传输的传输带宽为110Kbps，当传输文字信息时，一般不会超过500字，假设我们设定重复播发信息的周期为1S，并在信息的发端将文字分段标识并配置验证码，比如将字符串“information1information2”分成两段加上标识：“<part1>information1--md5</part1><part2>information2--md5</part2>”，这样配置后，通过几次的接收比对，我们不仅通过MD5码保证每段信息的完整性，也通过信息分段以及高频重复接收保证了排除串口乱码工作的效率。
在Vue-Electron 架构中，我们把这段串口的解析程序单独做成一个线程，按照Electron 推荐的方法[5]，我们单独创立一个不可见的子窗口，并运行这段程序，设置窗口崩溃时自动重启。通过这样的方式，我们就可以在后台运行一个一直监听串口接收信号，并在接收完整后立即锁屏切换的线程。3.3 窗口之间的切换ca1214
引线框架为了做到界面之间根据状态的切换，实际上我们使用的是Vue Router，以及VUEX。当我们有锁屏的需求时，事实上我们其实是在router 中做了一个“/locking-screen”的路径，并配置一个没有任何界面响应的“locking-screen.vue”文件，这样当我们在任何情况与条件下，只需调用this.$router.push(‘/ locking-screen’)，就能够进入到这个界面中，完成了锁屏预警信息的展示。
同时我们还需要一个退出的机制，如倒计时60秒，此时再无CDR 信息输入，那么我们就调用this.$router.push(‘/‘)，返回屏幕初始状态。而这个倒计时则返回的功能，以及一些状态我们会在全局中经常用到。比如正在浏览，人走后需要过段时间自动切回；如长时间无人互动屏幕，则播放播单等等。由于这个功能在此系统中如此常见，而且需要很多的全局状态，我们选择使用了Vuex，优点是代码条理清晰，远胜于Electron 各窗口进程的独自管理。
Actions: {
countDownFunc ({commit，state}，closeFunc) {
commit('clearInterval')
s t a t e .c d T i m e r .h a n d l e r = setInterval(()=> {
2020·11（下）
145
信息科技探索
commit('countdown')
if(state.cdTimer.value <= 0){ closeFunc() commit('clearInterval') } }，1000); } }
如上，在vuex 的actions 中设置异步函数，各个组件通过读写state 来掌控页面的状态，同时传入closeFunc 作为倒计时结束后的执行动作，达到了功能复用，状态唯一。3.4 设置与搭配
纵观本程序，由于选用了Vue-Electron 的方式，我们可以使用很多NPM 组件[6]，比如串口就可以使用SerialPort 这个组件[7]，样式则可以使用Vuetify [8]，这里需要注意的一点是，当使用SerialPort 这种组件时，需要在fig.js 中添加如下配置。
PluginOptions:{ electronBuilder:{ externals:['serialport']， nodeModulesPath:['./node_modules']
} }
3.5 环境监控系统
系统主要构成由硬件和软件组成，硬件部分采用ESP32+STM32双芯片共同服务模式。ESP32主要功能是将数据上传到MQTT 服务器（图5），同时还负责对光照，电压，空气质量，液晶显示屏的处理。STM32负责温湿度，门磁，漏水，振动开关的处理及继电器的操作，STM32通过串口与ESP32通信。采用双芯片工作模式的优点是提高系统可靠性，数据采集更准确，灵活性更高。ESP32将采集到的数据上传到MQTT 服务器，MQTT 服务器将数据转发到后台的设备GIS 监控服务器，这样我们就可以在后
端的地图监控系统中看到设备运行时的监控指标了。
图5 MQTT服务器基本通讯简图
建筑隔墙CDR 接收系统（图6）核心芯片是我国自主知
识产权的芯片，单芯片集成400MHZ、32位MIPS 指令集的龙芯处理器，芯片集成射频调谐器、CDR/FM 解调和AD/DA 电路，并具有射频信号处理专用的DSP 电路和USB
银钟花接口电路。
图6 CDR接收系统工作流程图
CDR 接收系统将数字音频信号中的嵌入信息不断解码，通过程序验正完整性后，将信息传递给显示系统，得以优先展示。
4 系统的完成与展望
多媒体大屏嵌入式系统原型试成并运行，有效的整合了青岛台平台资源，在公众展示屏这一概念下，拓展了资讯的展示渠道，添加了新的赛道与舞台。综合本系统来说，使用的硬件与软件都具有跨平台性，在自研成品能良好展示、完成目标功能的同时，与第三方合作共同开发下，也有着强大的整合与移植能力，如在Windows 系统下的公交亭系统（图7），我们可以迅速改造与融合。可以说为青岛广电的嵌入式产品开发，
打下了一个良好的开端。
图7 Windows系统公交亭展示屏产品
参考文献
[1]GDJ/079-2018 应急广播系统总体技术规范[S].
[2]Electron团队. Electron开发文档. V10.1.2[EB/OL].
[2020-9-15]./docs.
[3]Vue团队.Vue开发文档V2.x[EB/OL].[2020-9-17].
/v2/guide/.
[4]NklaymanVue. Electron Builder. V1.x[EB/OL].[2020-9-4].nklayman.github.io/vue-cli-plugin-electron-builder/guide/guide.html.
[5]Electron团队. Electron Api Demo . V4.0.1[EB/OL].
[2019-1-8].github/electron/electron-api-demos/releases .
[6]NPM组件团队.NPM组件.[EB/OL].www.npmjs/.
[2020-9-17].
[7]SerialPort.io团队.SerialPort组件V9.x.x[EB/OL].[2020-8-10].serialport.io/.
[8]Vuetify团队.Vuetify组件V2.3.10[EB/OL].[2020-9-9].
vuetifyjs/.
