CN112800738A - 一种Web智能交互节目在线制作和更新的方法和系统 - Google Patents

Abstract

一种Web智能交互节目在线制作和更新的方法，包括应用系统、资源服务器、终端设备；在资源服务器中存储引用资源，应用系统能够获取资源服务器上的引用资源；将线下制作好的互动模板上传至应用系统，在上传后应用系统对互动模板进行解析，持久化迁移到数据库及将互动模板保存到资源服务器；在应用系统上，根据上传的互动模板，生成智能交互节目，并在互动模板允许的区域进行内容的更新；资源服务器和终端设备进行资源同步。本方法可以解决现有技术中智能交互节目制作更新效率低下和制作困难的技术问题，做到智能交互节目和普通节目均可以在线制作，在线节目替换或更新。

Description

一种Web智能交互节目在线制作和更新的方法和系统

技术领域

本发明属于信息发布领域，尤其涉及一种Web智能交互节目在线制作和更新的方法和系统。

背景技术

信息发布系统由服务器、网络和终端显示设备等组成，服务器将用户制作的节目(用于在终端展示的界面，界面内容可包含：图片、视频、文本和组件等元素)通过网络(广域网、局域网和专用网都适用，包括无线网络)下发给终端显示设备，终端显示设备对接收到的节目包处理后进行节目内容的展示。

现有技术仅能对普通广告类界面进行素材上传、节目编排、节目资源下发、终端处理播放等操作，以实现信息发布的目的。但是普通节目只能把信息单方面传播，无法实现交互式体验，无法直接吸引到用户。随着物联网硬件的发展，终端显示设备已经不局限于展示广告，而是趋向于智能交互新传播渠道发展。

市面上现有的终端显示设备虽然可以支持智能交互节目的播放和交互，但是智能交互节目和普通制作方法一致，均采用线下专人制作、专人更新或者节目替换，制作节目、更新节目繁琐且人力物力耗费极大；智能交互节目制作较为复杂，需要节目制作者非常熟悉节目流程，并且对制作人员有比较高的技术要求；且由于智能交互节目包太大，严重影响节目更新的效率。需要人员制作好相关节目和资源，再进行人工替换到设备上，不支持在线节目制作和更新，极大影响效率，节目素材资源文件需要和节目包一起下载到终端设备，节目资源包内容过大，且下发节目时极大占用服务器资源和带宽。

发明内容

针对上述技术问题，本发明一种Web智能交互节目在线制作和更新的方法和系统，提高智能交互节目制作更新效率，降低制作难度。

本发明公开一种Web智能交互节目在线制作和更新的方法，在资源服务器中存储引用资源，应用系统能够获取资源服务器上的引用资源；将线下制作好的互动模板上传至应用系统，在上传后对互动模板进行解析，持久化迁移到数据库及将互动模板本身文件保存到资源服务器；在应用系统上，根据上传的互动模板，生成智能交互节目，并在互动模板允许的区域进行内容的更新，快速实现互动内容的制作。其中，上传是指将线下制作好的互动模板压缩包上传至应用系统。资源服务器和终端设备进行资源同步，保证终端设备上需要的资源可以更新下载。

进一步的，获取资源索引的目的在于，用户在线制作节目时可以浏览添加所需要的素材，本身系统不会占用资源服务器上的资源和带宽，解决资源文件对系统的占用。通过引用的形式获取资源服务器相关资源的引用具体包括：资源服务器在进行资源上传时，同步生成资源的引用信息到数据库，应用系统在制作、预览、更新、下发互动节目时，资源服务器传给应用系统对应资源的引用信息。

进一步的，应用系统将生成的智能交互节目打包为交互内容包，根据对资源服务器相关资源的引用生成资源清单，然后通知终端设备下载交互内容包；生成节目预览位置信息和资源清单信息，以供智能交互节目下载后进行智能交互节目位置加载和资源同步；

交互内容包中包括资源列表，资源列表包括对应资源的引用信息；终端设备从资源服务器上下载交互内容包后解析，对比资源列表与终端设备的本地资源库，到资源服务器同步本地资源库中不存在的资源；

将交互内容包及引用的资源下载完成之后，终端设备展示智能交互节目。

进一步的，对资源列表的对比具体包括：对比资源列表和本地资源库中的文件名和文件的MD5值，同一文件名MD5值不一致、资源列表中文件在本地资源库中不存在，则与资源服务器进行同步。

进一步的，获取引用资源到应用系统中，具体为：应用系统主动获取资源服务器的引用资源，此处的引用资源包括媒体资源，还包括互动模板、节目列表、交互内容包节目资源等，对于相同的资源，如背景图片素材组件等，只需要引用一次，避免重复引用占用系统资源。更重要的，应用系统不是资源复制，而是通过引用的形式获取资源服务器相关资源的引用，用户在线制作节目时所看到的资源，是资源服务器上对应资源的引用，从而解决制作节目时对应用系统的占用。

进一步的，互动模板为线下定制的、可直接在浏览器上访问的页面，互动模板中设定可编辑区域。通过在智能交互节目编辑页面添加或者编辑内容，即可完成节目的制作或更新。

进一步的，使用HTML5制作互动模板，可编辑区域包括info.json、static目录、index.html、data.js等目录文件，规定了页面中可编辑区域，可增加的内容。其中，info.json文件确定了智能交互节目的类型及相关参数；index.html文件为智能交互节目的编辑页面；data.js文件存放了智能交互节目所需要的资源文件列表。

进一步的，解析是指解析压缩包中info.json文件，将互动模板压缩包转成模板表数据；data.js文件，将里面引用的默认资源，转换成模板资源表数据。迁移是指将解压后的互动模板包，迁移到资源服务器模板目录中，更新互动模板存储的引用位置。

生成智能交互节目的步骤进一步包括，数据复制：将模板表数据和模板资源表数据复制到应用系统中的智能交互节目表和互动资源表中，生成智能交互节目数据；文件复制：将资源服务器中，互动模板解包文件，复制一份到资源服务器中的智能交互节目预览位置，准备预加载节目框架；内容制作：浏览器访问智能交互节目预览位置的index.html的页面，进行智能交互节目的编辑，将引用的资源服务器资源实时写入到data.js中，同步更新资源服务器的资源库中。

具体智能交互节目的制作便利性主要体现在，节目制作区域会同时显示预览画面，用户在可编辑的组件中可以自定义内容，并且用户在编辑时，预览信息和编辑信息是双向绑定的，任何一方的信息发生改变，另一方的编辑或者预览会同步变化。在用户点击保存或者撤销操作时会同步更新data.js文件，保证用户操作均可以形成记录，方便用户在后续继续编辑或者修改。界面样式采用element组件，可以最大限度的丰富用户编辑样式效果，预览界面同步更新显示效果，所见即所得。界面用了swiper插件，可自动播放动态效果，如图片切换、视频预览等，并在切换中增加动画效果。在编辑界面中使用element组件中的vuedraggable拖拽组件增加了拖拽功能，让用户制作节目更加便利。

本发明还公开一种Web智能交互节目在线制作和更新的系统，包括：资源服务器、应用系统、终端设备；应用系统、终端设备均与资源服务器通信连接，应用系统与终端设备控制连接；

应用系统包括资源管理模块、互动模板管理模块、互动节目制作模块、发布模块及数据库；资源管理模块连接资源服务器与互动模板管理模块，互动模板管理模块使用资源服务器的引用资源定制交互节目模板；互动节目制作模块根据交互节目模板，生成相应的智能交互节目，快速实现互动内容的制作；发布系统将交互节目模板转换成数据信息存储在数据库中；应用系统将制作完成的智能交互节目打包为交互内容包，把引用的资源服务器资源替换成资源清单，降低交互内容包的大小，然后通知终端设备下载交互内容包；

终端设备根据交互内容包的资源清单对比本地资源，对于本地资源中不存在的资源，向资源服务器下载和同步，交互内容包及引用的资源加载完成之后，终端设备自动播放智能交互节目；

资源服务器包括交互节目模板存储模块、智能交互节目存储模块、交互内容包结构存储、引用资源存储。可以根据交互内容包的结构，确定互动节目的目录结构，进而确定互动内容的类型。

与现有技术相比，本方法可以解决现有技术中智能交互节目制作更新效率低下和制作困难的技术问题，做到智能交互节目和普通节目均可以在线制作，在线节目替换或更新；极大降低技术门槛，让非专业人员也可以在线制作节目，制作流程和普通节目无异，同时，智能交互节目的在线制作和普通节目流程一致，且同一个节目中智能交互节目和普通节目可以共存，对于制作人员来说没有区别。

通过资源列表的形式，代替资源文件，可以精简节目包大小，资源下载直接通过终端向资源服务器同步的形式处理，减小发布系统的资源负载。

解决智能交互节目编辑难的问题：通过使用HTML5定制化开发互动模板的方式，将智能交互节目中动态部分制作为可编辑区域，由客户根据自身需求进行修改，增加智能交互节目的可编辑性，提高智能交互节目制作的效率。

所见即所得：客户在线制作节目时，可以不区分智能交互节目和普通节目，通过用户选择的区域是否属于交互节目区域，平台会自动进行判断，加载智能交互节目所需要的资源和脚本。用户不需要做区分。同时也可以像制作普通节目一样，在线制作智能交互节目。

提高智能交互节目发布效率：应用系统发布智能交互节目过程中，使用资源清单代替原本的资源文件，降低智能交互节目包的大小，有效减少终端下载智能交互节目包的时间。

降低网络带宽使用：信息展示终端引入本地资源库，存放历史下载的资源，当本地资源库没有智能交互节目包中资源清单的资源时，才会去资源服务器下载，减少网络带宽的使用。

平台兼容性高：互动模板采用的HTML5进行编辑和制作，对于跨平台具有很好的兼容性，能够兼容Window和Android设备进行互动内容播放。

附图说明

图1为本发明实施例的Web智能交互节目在线制作和更新的方法流程图。

图2为本发明实施例的Web智能交互节目在线制作和更新的系统架构图。

具体实施方式

为了便于本领域技术人员的理解，下面结合实施例与附图对本发明作进一步的说明。

如图2所示，本实施例的Web智能交互节目在线制作和更新的系统，包括资源服务器，用于和终端设备进行资源下载和同步；互动模板定制，根据不同用户需求，定制不同内容的智能交互节目模板；应用系统解析互动模板：模板上传到应用系统，换成数据信息存储在数据库中；平台用户制作智能交互节目，系统根据智能交互节目模板，生成相应的智能交互节目，可在模板允许的区域进行内容的制作和更新，快速实现互动内容的制作；智能交互节目下发，应用系统自动打包制作完成的智能交互节目，把引用的资源服务器资源替换成资源清单，降低交互内容包的大小，然后通知设备下载交互内容包；设备加载及资源同步，根据资源清单对比本地资源，不存在的资源会同步资源服务器，智能交互节目包及引用的资源加载完成之后，终端自动播放智能交互节目。

如图1所示的一种Web智能交互节目在线制作和更新方法，应用系统会主动获取资源服务器上的资源索引到系统中，本身系统不会占用资源服务器上的资源和带宽。获取资源索引的目的在于，用户在线制作节目时可以浏览添加所需要的素材，解决资源文件对系统的占用。资源服务器会主动和终端显示设备进行资源同步，保证终端显示设备上需要的资源可以更新下载。

采用线下定制互动模板的方式，线下使用HTML5制作好互动内容的模板，设定互动内容模板的可编辑区域，包括info.json、static目录、index.html、data.js等目录文件，规定了页面中可编辑区域，可增加的内容。其中，info.json文件确定了智能交互节目的类型及相关参数；index.html文件为智能交互节目的编辑页面；data.js文件存放了智能交互节目所需要的资源文件列表。互动模板为一个可直接在浏览器上访问的页面，方便制作人员浏览查看相关效果。制作人员只需要在智能交互节目编辑页面添加或者编辑内容，即可完成节目的制作或更新。

线下制作好的互动模板，上传至应用系统，在上传过程中对互动模板进行解析，持久化迁移到数据库及将模板本身文件保存到资源服务器。其中，上传是指将线下制作好的互动模板压缩包上传至应用系统。解析是指解析压缩包中info.json文件，将互动模板压缩包转成模板表数据；data.js文件，将里面引用的默认资源，转换成模板资源表数据。迁移是指将解压后的互动模板包，迁移到资源服务器模板目录中，更新模板记录的引用位置。

系统用户根据上传的互动模板，生成新的智能交互节目，并在模板允许的区域进行内容的更新，快速实现互动内容的制作。此步骤包括数据复制：将模板表数据和模板资源表数据复制到系统中的智能交互节目表和互动资源表中，生成智能交互节目相关数据。文件复制：将资源服务器中，互动模板解包文件，复制一份到资源服务器中节目预览位置，准备预加载节目框架。内容制作：浏览器访问智能交互节目预览位置的index.html的页面，进行智能交互节目的编辑，将引用的资源服务器资源实时写入到data.js中，同步更新应用系统中。

具体智能交互节目的制作便利性主要体现在，节目制作区域会同时显示预览画面，用户在可编辑的组件中可以自定义内容，并且用户在编辑时，预览信息和编辑信息是双向绑定的，任何一方的信息发生改变，另一方的编辑或者预览会同步变化。在用户点击保存或者撤销操作时会同步更新data.js文件，保证用户操作均可以形成记录，方便用户在后续继续编辑或者修改。界面样式采用element组件，可以最大限度的丰富用户编辑样式效果，预览界面同步更新显示效果，所见即所得。界面用了swiper插件，可自动播放动态效果，如图片切换、视频预览等，并在切换中增加动画效果。在编辑界面中使用element组件中的vuedraggable拖拽组件增加了拖拽功能，让用户制作节目更加便利。

制作完成的智能交互节目就可以发布到网点播放设备中，对制作的互动内容进行打包，将引用资源服务器的资源替换成资源清单，降低交互内容包的大小，然后通知设备下载交互内容包。此过程会生成节目预览位置信息和资源清单信息，以供节目下载后进行智能交互节目位置加载和资源同步。

下载交互内容包，终端从资源服务器上将交互内容包下载后解析，根据交互内容包中的资源清单，对比设备本地资源库，存在的资源就不用去资源服务器下载，降低网络带宽使用。终端根据服务器发布的节目指令，访问资源服务器下载智能交互节目包。根据智能交互节目包中的资源清单下载资源服务器资源。并且会对比本地资源库，本地有就不用下载，本地没有才会去资源服务器下载。

将智能交互节目包及引用的资源下载完成之后，终端会进入播放器播放html5页面的流程，展示智能交互节目。

与现有技术相比，本方法可以解决现有技术中智能交互节目制作更新效率低下和制作困难的技术问题，做到智能交互节目和普通节目均可以在线制作，在线节目替换或更新；极大降低技术门槛，让非专业人员也可以在线制作节目，制作流程和普通节目无异，同时，智能交互节目的在线制作和普通节目流程一致，且同一个节目中智能交互节目和普通节目可以共存，对于制作人员来说没有区别。

本实施例中，引用形式获取资源引用是一大创新。这里的“引用”有两个方面的应用，一个是应用系统在制作、预览、更新、下发互动节目时，用户所看到的资源信息，均是资源服务器的引用，不会占用系统和带宽资源。更具体的，图片和视频的引用形式具体体现为缩略图，资源服务器在进行资源上传时，会同步生成资源引用信息到数据库，应用系统在制作、预览、更新、下发互动节目时，资源服务器传给应用系统的对应资源的引用信息，对于图片和视频具体体现在缩略图的形式。当应用系统制作完成节目，下发给终端时，应用系统会根据用户保存的使用的资源引用生成对应的源资源文件，生成资源清单，从而实现在应用系统制作节目时，不会对应用系统本身和资源服务器造成资源占用和网络占用。另外的，当应用系统给终端推送互动节目时，交互内容包中并未包含制作节目时的相关资源文件，而是以资源列表的形式通知终端同步资源服务器的相关资源，这同样是以“引用”的方式实现的。终端对资源列表中的文件进行对比是，会结合资源列表中文件的MD5值和本地文件进行对比，MD5值一致代表文件相同，不一致才会去资源服务器同步对应文件。终端根据文件名和文件MD5值进行校验，同一文件名MD5不一致才会同步；资源列表中文件本地不存在，才会同步。

通过资源列表的形式，代替资源文件，可以精简节目包大小，资源下载直接通过终端向资源服务器同步的形式处理，减小发布系统的资源负载。

解决智能交互节目编辑难的问题：通过使用HTML5定制化开发互动模板的方式，将智能交互节目中动态部分制作为可编辑区域，由客户根据自身需求进行修改，增加智能交互节目的可编辑性，提高智能交互节目制作的效率。

所见即所得：客户在线制作节目时，可以不区分智能交互节目和普通节目，通过用户选择的区域是否属于交互节目区域，应用系统会自动进行判断，加载智能交互节目所需要的资源和脚本。用户不需要做区分。同时也可以像制作普通节目一样，在线制作智能交互节目。

提高智能交互节目发布效率：应用系统发布智能交互节目过程中，使用资源清单代替原本的资源文件，降低智能交互节目包的大小，有效减少终端下载智能交互节目包的时间。

降低网络带宽使用：信息展示终端引入本地资源库，存放历史下载的资源，当本地资源库没有智能交互节目包中资源清单的资源时，才会去资源服务器下载，减少网络带宽的使用。

平台兼容性高：互动模板采用的HTML5进行编辑和制作，对于跨平台具有很好的兼容性，能够兼容Window和Android设备进行互动内容播放。

素材安全性：用于制作智能交互节目的素材，需要经过审核以后才能使用，确保终端播放的素材合规合法。

以上的实施例仅为说明本发明的技术思想，不能以此限定本发明的保护范围，凡是按照本发明提出的技术思想，在技术方案基础上所做的任何改动，均落入本发明保护范围之内。

Claims (10)

1.一种Web智能交互节目在线制作和更新的方法，其特征在于：包括应用系统、资源服务器、终端设备；在资源服务器中存储引用资源，应用系统通过引用的形式获取资源服务器上资源的引用；将线下制作好的互动模板上传至应用系统，在上传后应用系统对互动模板进行解析，持久化迁移到数据库及将互动模板保存到资源服务器；在应用系统上，根据上传的互动模板，生成智能交互节目，并在互动模板允许的区域进行内容的更新；资源服务器和终端设备进行资源同步。

2.根据权利要求1所述的Web智能交互节目在线制作和更新的方法，其特征在于，通过引用的形式获取资源服务器相关资源的引用具体包括：资源服务器在进行资源上传时，同步生成资源的引用信息到数据库，应用系统在制作、预览、更新、下发互动节目时，资源服务器传给应用系统对应资源的引用信息。

3.根据权利要求2所述的Web智能交互节目在线制作和更新的方法，其特征在于：应用系统将生成的智能交互节目打包为交互内容包，根据对资源服务器相关资源的引用生成资源清单，然后通知终端设备下载交互内容包；生成节目预览位置信息和资源清单信息，以供智能交互节目下载后进行智能交互节目位置加载和资源同步；

交互内容包中包括资源列表，资源列表包括对应资源的引用信息；终端设备从资源服务器上下载交互内容包后解析，对比资源列表与终端设备的本地资源库，到资源服务器同步本地资源库中不存在的资源；

将交互内容包及引用的资源下载完成之后，终端设备展示智能交互节目。

4.根据权利要求3所述的Web智能交互节目在线制作和更新的方法，其特征在于，对资源列表的对比具体包括：对比资源列表和本地资源库中的文件名和文件的MD5值，同一文件名MD5值不一致、资源列表中文件在本地资源库中不存在，则与资源服务器进行同步。

5.根据权利要求1至4中任一所述的Web智能交互节目在线制作和更新的方法，其特征在于：应用系统获取资源服务器相关资源的引用时，对于相同的资源，只需引用一次，避免重复引用占用系统资源；引用资源包括：媒体资源、互动模板、节目列表、交互内容包节目资源。

6.根据权利要求1所述的Web智能交互节目在线制作和更新的方法，其特征在于：互动模板为线下定制的、可直接在浏览器上访问的页面，互动模板中设定可编辑区域。

7.根据权利要求6所述的Web智能交互节目在线制作和更新的方法，其特征在于：使用HTML5制作互动模板，可编辑区域包括info.json、static目录、index.html、data.js目录文件；info.json文件确定智能交互节目的类型及相关参数；index.html文件为智能交互节目的编辑页面；data.js文件存放智能交互节目所需要的资源文件列表。

8.根据权利要求7所述的Web智能交互节目在线制作和更新的方法，其特征在于：对互动模板进行解析为解析压缩包中info.json文件，将互动模板压缩包转成模板表数据；data.js文件，将里面引用的默认资源，转换成模板资源表数据；迁移是指将解压后的互动模板包，迁移到资源服务器模板目录中，更新互动模板存储的引用位置。

9.根据权利要求6至8中任一所述的Web智能交互节目在线制作和更新的方法，其特征在于，生成智能交互节目的步骤进一步包括，数据复制：将模板表数据和模板资源表数据复制到应用系统中的智能交互节目表和互动资源表中，生成智能交互节目数据；文件复制：将资源服务器中，互动模板解包文件，复制一份到资源服务器中的智能交互节目预览位置，准备预加载节目框架；内容制作：浏览器访问智能交互节目预览位置的index.html的页面，进行智能交互节目的编辑，将引用的资源服务器资源实时写入到data.js中，同步更新到资源服务器的资源库中。

10.一种Web智能交互节目在线制作和更新系统，其特征在于：包括资源服务器、应用系统、终端设备；应用系统、终端设备均与资源服务器通信连接，应用系统与终端设备控制连接；

应用系统包括资源管理模块、互动模板管理模块、互动节目制作模块、发布模块及数据库；资源管理模块连接资源服务器与互动模板管理模块，互动模板管理模块使用资源服务器的引用资源定制交互节目模板；互动节目制作模块根据交互节目模板，生成相应的智能交互节目，快速实现互动内容的制作；发布系统将交互节目模板转换成数据信息存储在数据库中；应用系统将制作完成的智能交互节目打包为交互内容包，把引用的资源服务器资源替换成资源清单，然后通知终端设备下载交互内容包；

终端设备根据交互内容包的资源清单对比本地资源，对于本地资源中不存在的资源，向资源服务器下载和同步，交互内容包及引用的资源加载完成之后，终端设备自动播放智能交互节目；

资源服务器包括交互节目模板存储模块、智能交互节目存储模块、交互内容包结构存储、引用资源存储。

Images