CN105245959A - 一种多设备联动服务中的连接通道维护系统及方法 - Google Patents

Abstract

本发明提出了一种多设备联动服务中的连接通道维护系统及方法，所述系统包含：多屏通道控制客户端模块和多屏通道控制服务端模块；所述多屏通道控制客户端模块，该模块位于各个终端设备上，用于获取设备终端的标识，并向多屏通道控制服务端上报本终端与多屏通道的绑定关系；所述多屏通道控制服务端模块，用于记录终端与多屏通道的绑定关系，并向绑定终端的一方推送服务，该多屏通道控制服务端模块位于提供数据业务的服务端上。本发明的优点在于：不需要影响原有服务业务，在新增的Websocket层上进行绑定关系维护及UI同步，实现业务稳定升级；且在客户端Websocket通道实现中，通过嵌套iframe的形式，实现Websocket通道在页面间的复用，降低通道维护复杂度。

Description

一种多设备联动服务中的连接通道维护系统及方法

技术领域

本发明涉及WEB技术领域，特别涉及一种多设备联动服务中的连接通道维护装置及方法；特别涉及WEB服务与多个设备进行数据交互的应用场景。

背景技术

目前，WEB服务已经可以支持多种类型的终端，比如PC、电视机、不同分辨率的手机等，人们享受多终端访问服务的同时，不再满足于使用不同终端单独访问同一服务系统，而是要求利用多个终端进行联动服务，从而方便用户操作，提升观看体验。

申请号为“201310590251.5”的专利申请公开了一种“多屏互动系统及其处理方法”，该系统中首先电视系统启动多屏互动服务，然后电视系统搜索到同一局域网内的该开启了多屏互动的其他设备，与其建立通讯，该其他设备再将其多媒体资源推送到电视系统进行呈现，然后用户通过电视系统输入对该多媒体资源的控制指令，则电视系统将该控制指令转换为数字信号并发送给该其他设备，最后该其他设备将接收到的数字信号转换为本设备能够识别的操作指令，根据该操作指令对该多媒体资源进行相应操作。中国申请号为“201210460776.2”的专利申请公开了“一种多屏互动系统及方法”，该系统包括移动电子设备和显示终端，通过移动电子设备采集当前界面上显示的网页、图片或音视频的地址，并将所述地址传输至显示终端，由所述显示终端进行解析，并根据解析结果显示与所述地址相对应的网页、图片或音视频，实现了多屏互动。在这个过程中，由于所述移动电子设备只需传输地址信息，无需占用较大的带宽资源，且传输速度快，有利于实现多屏互动的实时性。

上述两个专利都涉及了不同类型终端之间UI同步及联动操作的实现，但是在第一个专利中，需要将多媒体资源在两个终端之间进行推送，这就对终端之间的连接带宽有较高的要求，而且其中的多媒体资源也仅限于终端设备上已有的资源，不能对资源进行选择；在第二个专利中，终端之间不再传输资源内容，而只是传输地址信息，这就减小了传输带宽压力，但是其中图片匹配和适配等操作都在终端完成，对终端的处理能力提出很高的要求，而且源信息分为图片、网页、视频三种类型，对三种类型数据都要区分处理，业务逻辑复杂。

发明内容

本发明的目的在于，为克服上述问题，本发明提供一种多设备联动服务中的连接通道维护系统及方法。

为实现上述目的，本发明提供一种多设备联动服务中的连接通道维护系统，包含：用于提供数据业务的服务端和终端设备，其特征在于，所述系统包含：位于终端设备上的多屏通道控制客户端模块和位于服务端上的多屏通道控制服务端模块；

所述多屏通道控制客户端模块，用于获取设备终端的标识，并向多屏通道控制服务端上报本终端与多屏通道的绑定关系；

所述多屏通道控制服务端模块，用于记录终端与多屏通道的绑定关系，并向绑定终端的一方推送服务。

可选的，上述多屏通道控制服务端模块包含：

通道维护单元，用于建立并维护多屏通道控制客户端和多屏通道控制服务端之间的Websocket通道；

终端绑定单元，用于记录客户端之间的绑定关系；

终端适配单元，用于识别客户端所在终端的设备类型，并按照设备类型下发匹配的页面地址。

此外，本发明提供一种多设备联动服务中的连接通道维护方法，上述记载的连接通道维护系统，所述方法包含：

步骤101)维持终端的业务通道，并在终端设备加入多屏联动服务的控制通道；

通过所述控制通道实现多终端设备之间的绑定、UI同步和状态控制，进而实现了业务和多设备联动控制的分离；

步骤102)采用控制通道的复用实现多页面应用程序中的页面跳转。

可选的，终端设备在业务页面加载完成后，自动加载多屏通道控制的客户端模块。

可选的，上述的控制通道位于多屏通道控制的客户端模块和多屏通道控制的服务端模块之间，且所述多屏通道控制的客户端模块位于终端设备上；

所述多屏通道控制客户端模块建立与多屏通道控制的服务端模块之间的Websocket连接，即控制通道，并向多屏通道控制的服务端模块上报客户端的终端标识；

所述多屏通道控制服务端模块还用于保存终端设备的标识和Websocket通道的对应关系。

可选的，上述多屏通道控制客户端模块定期通过Websocket通道向多屏通道控制服务端模块发送心跳报文，用以维护两者之间的连接通道。

可选的，一个多屏通道控制客户端模块通过扫描二维码的方式携带另一个多屏通道客户端模块所在终端设备的标识向多屏通道控制服务端模块请求绑定，多屏通道控制服务端模块保存两个终端设备之间的绑定关系；其中，绑定报文通过Websocket通道传输。

可选的，上述的UI同步方法具体包含：

当终端设备跳转到新页面之后，位于该终端设备上的多屏通道控制客户端模块通过Websocket通道向位于服务端上的多屏通道控制服务端模块上报终端设备当前所在页面信息，多屏通道控制服务端模块接收终端设备的当前所在页面信息，并保存终端设备与当前所在页面信息的对应关系；

当多屏通道控制服务端模块收到多屏通道控制客户端模块上报的当前所在页面的信息后，根据终端设备浏览器能力和浏览器类型，从终端适配知识库中匹配出发送请求的终端类型并查找是否有与该终端绑定的其他终端，以及其他终端是否处于与该终端所在页面对应的页面上，如果没有绑定终端，不做处理；如果其他终端已经处于该终端所在页面对应的页面上，不作处理；否则，根据请求中的目标类型参数和配置的同步关系，获取目标类型终端的同步页面地址，向目标终端推送同步页面地址。

可选的，上述的状态控制方法包含：

当终端设备为手机类型的终端时：当手机类型终端点击进入播放页面时：终端适配模块向手机类型终端对应的绑定电视类型终端推送视频播放页面，而向手机类型终端推送播放控制及推荐页面，所述推荐页面中包括视频播放的控制按钮以及该视频对应的推荐节目列表，其中，

当手机类型终端点击视频播放控制按钮时，多屏通道控制客户端将对应控制命令通过Websocket通道发送到多屏通道控制服务端；终端绑定模块查找该终端绑定的电视类型终端并通过Websocket通道向该终端上的多屏通道控制客户端推送对应控制命令；电视类型终端上的多屏通道控制客户端收到控制命令并执行动作，控制视频播放；

当手机类型终端浏览播放控制及推荐页面中的推荐节目，点击进入一个推荐节目的详情页时，会通过UI同步机制，控制该手机类型终端绑定的终端跳转到对应节目详情页面。

可选的，上述步骤102)具体为：将多屏通道控制客户端的页面的dom结构中设置一个iframe，将原有服务页面嵌入iframe中，且在iframe外层创建和维护与多屏通道控制服务端的Websocket通道，通过对iframe刷新实现业务页面的跳转。

本发明的优点在于：不需要影响原有服务业务，在新增的Websocket层上进行绑定关系维护及UI同步，实现业务稳定升级；且在客户端Websocket通道实现中，通过嵌套iframe的形式，实现Websocket通道在页面间的复用，降低通道维护复杂度。

附图说明

图1是本发明的多设备联动服务中连接通道维护装置和方法组成框图；

图2是本发明的多设备联动服务中的绑定流程示意图；

图3是本发明的多设备联动服务中的搜索及播放流程示意图；

图4是本发明的多设备联动服务中的播控流程示意图。

具体实施方式

下面通过具体实施例对本发明的多设备联动服务中的连接通道维护装置和方法做进一步阐述。

本发明提供一种多设备联动服务中的连接通道维护装置及方法，该装置包括：位于终端设备上的多屏通道控制客户端模块和位于服务端上的多屏通道控制服务端模块。所述多屏通道控制服务端模块包含终端适配单元、终端绑定单元和业务处理单元。本装置基本原理为：终端设备登录时建立与服务端的连接并上报自己的终端标识，服务端记录终端设备的标识和多屏通道的绑定关系；终端设备通过扫描二维码方式上报待绑定终端设备的标识，服务端记录两个终端标识的绑定关系；终端加载新页面后上报当前页面地址，服务端查找该终端的绑定终端并推送匹配地址；手机终端进行播放控制操作后，通过多屏通道上报控制命令，服务端接收命令，并向其绑定的电视终端推送该命令，实现播放进程的控制。本发明在原有业务通道(即服务端与终端设备之间的业务通道)基础之上，加入多屏联动服务控制通道，该通道通过Websocket技术建立客户端和服务器之间的连接。与此同时，针对多页面应用程序，实现了控制通道的复用，避免了页面跳转时通道重复建立的开销。

本发明提供的一种多设备联动服务中基于HTTP和Websocket双通道的连接通道维护装置和方法，其中：

图1所示的多设备联动服务中连接通道维护装置，该装置包括：

多屏通道控制服务端模块101完成Websocket通道建立和维护的功能，并对终端请求进行过滤，实现终端绑定、终端适配和UI同步等业务。

多屏通道控制客户端模块102是一个javascript客户端库，在终端请求业务页面时加入到本地浏览器运行时中。此组件库维护与多屏通道控制服务端的双向Websocket通道，支持多屏通道控制服务端实时向终端推送数据，并根据推送内容进行响应和跳转。

上述多屏通道控制服务端101进一步包含：

终端适配单元103对终端的浏览器信息进行识别，并根据已有的终端类型库，匹配出最合适的终端类型。

终端绑定单元104支持通过扫描二维码的方式进行多终端绑定，维护绑定的终端之间的关联关系。

上述多屏通道控制服务端模块101和业务处理模块105均位于服务端上，所述的服务端用于向终端设备提供数据业务；上述多屏通道控制客户端模块102位于终端设备上；业务处理单元105通过HTTP通道响应原有服务请求，保持原有业务逻辑不变。

实施例

图2是多设备联动服务中的绑定流程图，具体包括：

201)电视端启动多屏联动应用，请求初始页面，加载多屏通道控制客户端模块，建立与服务端的Websocket通道，上报自己的终端标识。服务端记录该终端标识与Websocket通道的对应关系，进入202)；

202)手机端启动多屏联动应用，请求初始页面，加载多屏通道控制客户端，建立与服务端的Websocket通道，上报自己的终端标识。服务端记录该终端标识与Websocket通道的对应关系，进入203)；

203)电视端通过HTTP通道向服务端请求二维码扫描页面，服务端返回二维码扫描页面。进入204)；

204)手机端通过扫描二维码的方式，通过Websocket通道向服务端上报将要绑定终端的标识，进入205)；

205)收到终端绑定请求后，终端绑定模块根据终端标识保存绑定关系，服务端通过Websocket通道向手机终端推送搜索页面地址，进入206)；

206)手机终端接收到推送地址，通过HTTP通道向服务端请求搜索页面，服务端返回搜索页面，进入207)；

207)手机端加载完搜索页面后，通过Websocket通道向服务端上报当前所在页面地址，进入208)；

208)服务端保存手机端的当前页面地址，并根据其终端标识查找其绑定终端为电视端，终端适配模块判断该电视端是否处于相对应页面上，如果是，则无操作；如果不是，则进入209)；

209)终端适配模块根据电视端的终端类型，得到其对应的搜索页面地址，通过Websocket通道向电视端推送该地址，进入210)；

210)电视端收到推送地址，通过HTTP通道向服务端请求该页面，加载完搜索页面后，通过Websocket通道向服务端上报当前所在页面地址，进入211)；

211)服务端保存电视端的当前页面地址，并根据其终端标识查找其绑定终端为手机端，终端适配模块判断手机端是正处于相对应页面上。

图3是多设备联动服务中的搜索联动过程流程图，具体包括：

301)手机端输入节目简称进行搜索，服务端通过ajax返回搜索结果并在手机端显示，手机端选择节目，通过HTTP通道向服务端请求节目详情页面，服务端返回节目详情页面，进入302)；

302)手机端加载完节目详情页面后，向服务端上报当前所在页面地址，进入303)；

303)服务端保存手机端的当前页面地址，并根据其终端标识查找其绑定终端为电视端，终端适配模块判断电视端是否处于节目详情页面的对应页面上，如果是，则无操作；如果不是，则进入304)；

304)终端适配模块根据电视端的终端类型，查找其对应的节目详情页面地址，通过Websocket通道向电视端推送该地址，进入305)；

305)电视端收到推送地址，通过HTTP通道请求该页面，加载完节目详情页面后，通过Websocket通道向服务端上报当前所在页面地址，进入306)；

306)服务端保存电视端的当前页面地址，并根据其终端标识查找其绑定终端为手机端，终端适配模块判断手机端是正处于相对应页面上。

图4是多设备联动服务中的播放联动过程流程图，具体包括：

401)电视端和手机端同步显示节目详情页面时，手机端在详情页选择节目源、节目集数，点击播放，通过HTTP通道向服务端请求该节目对应的播放控制及推荐页面，服务端向手机端返回该节目对应的播放控制及推荐页面，进入402)；

402)手机端加载完播放控制及推荐页面后，通过Websocket通道向服务端上报当前所在页面地址，进入403)；

403)服务端保存手机端的当前页面地址，并根据其终端标识查找其绑定终端为电视端，终端适配模块判断其绑定电视终端的对应页面为播放页面，判断其绑定电视终端是否处于播放页面上，如果是，则无操作；如果不是，则进入404)；

404)终端适配模块根据电视端类型，查找到其对应的播放页面地址，并通过Websocket通道向电视端推送该地址，进入405)；

405)电视端接收推送地址，通过HTTP通道请求对应页面，加载完播放页面后，开始播放对应节目；

406)手机端在播放控制及推荐页面点击暂停、播放、快进、快退等操作按钮，通过Websocket通道向服务端发送对应指令，进入407)；

407)服务端收到手机端的播控指令，并查找该终端是否绑定电视终端，如果不是，则无操作；如果是，则进入408)；

408)服务端通过Websocket通道向电视端推送播控指令，控制电视终端的播放；

409)手机端在播放控制及推荐页面浏览该节目对应的推荐内容，选中某个推荐节目，通过HTTP通道向服务端请求该节目的节目详情页面，服务端返回节目详情页面，进入410)；

410)手机端加载完节目详情页面后，通过Websocket通道向服务端上报当前所在页面地址，进入411)；

411)服务端保存手机端的当前页面地址，并根据其终端标识查找其绑定终端为电视端，终端适配模块根据电视终端类型，判断其是否处于节目详情页面的对应页面上，如果是，则无操作；如果不是，则进入412)；

412)服务端查找电视端对应的节目详情页面地址，并通过Websocket通道向电视端推送该地址，进入413)；

413)电视端接收推送地址，通过HTTP通道请求对应页面，加载完节目详情页面后，向服务端上报当前所在页面地址，进入414)；

414)服务端保存电视端的当前页面地址，并根据其终端标识查找其绑定终端为手机端，终端适配模块根据手机端终端类型，判定其是正处于相对应页面上。

总之，本发明提出一种多设备联动服务中的连接通道维护系统及方法，通过该方法，可以在不影响原有业务逻辑的基础上加入多屏联动服务控制通道，通过控制通道实现多设备之间的绑定、UI同步和状态控制。

本发明的方法区别于其他通道维护方法在于：

1)在不影响原有业务服务通道情况下，加入多屏联动服务控制通道，通过控制通道实现多设备之间的绑定、UI同步和状态控制，实现了原有业务和多设备联动服务的分离。

2)终端在初始页面加载完成后，自动加载多屏通道控制客户端，建立与多屏通道控制服务端的Websocket连接，并上报客户端的终端标识；多屏通道控制服务端保存终端标识和Websocket通道的对应关系。

3)多屏通道控制客户端定期通过Websocket通道向多屏通道控制服务端发送心跳报文，用以维护两者之间的连接通道。

4)多屏通道控制客户端可以通过扫描二维码的方式，携带另一个客户端的终端标识向多屏通道控制服务端请求绑定，绑定报文通过Websocket通道传输，终端绑定模块收到绑定请求后保存两个终端之间的绑定关系。

5)多屏通道控制客户端跳转到新页面之后，会通过Websocket通道向多屏通道控制服务端上报当前所在页面信息，多屏通道控制服务端接收终端的当前所在页面信息，并将终端与当前所在页面信息的对应关系存储下来。

6)多屏通道控制服务端收到终端上报的当前所在页面信息后，终端适配模块根据终端浏览器能力和浏览器类型，从终端适配知识库中匹配出发送请求的终端类型查找是否有与该终端绑定的其他终端，以及其他终端是否处于与该终端所在页面对应的页面上，如果没有绑定终端，不做处理；如果其他终端已经处于该终端所在页面对应的页面上，不作处理；否则，根据请求中的目标类型参数和配置的同步关系，获取目标类型终端的同步页面地址，向目标终端推送同步页面地址。

7)当手机类型终端点击进入播放页面时，终端适配模块向其对应的绑定电视类型终端推送视频播放页面，而向手机类型终端推送播放控制及推荐页面，该页面中包括视频播放的控制按钮以及该视频对应的相关推荐节目列表，其中

当手机类型终端点击视频播放控制按钮时，多屏通道控制客户端将对应控制命令通过Websocket通道发送到多屏通道控制服务端；绑定模块查找该客户端绑定的电视类型客户端并通过Websocket通道向该客户端推送对应控制命令；电视类型客户端收到控制命令并执行动作，控制视频播放。

当手机类型终端浏览播放控制及推荐页面中的推荐节目，点击进入某个推荐节目的详情页时，会通过5)、6)中的UI同步机制，控制其绑定终端跳转到对应节目详情页面。

8)在多屏通道控制客户端页面的dom结构中包含一个iframe，将原有服务页面嵌入iframe中，在iframe外层创建和维护与服务端的Websocket通道，通过对iframe刷新实现业务页面的跳转。

9)业务处理模块通过HTTP通道响应原有业务请求，保持原有业务逻辑不变。

最后所应说明的是，以上实施例仅用以说明本发明的技术方案而非限制。尽管参照实施例对本发明进行了详细说明，本领域的普通技术人员应当理解，对本发明的技术方案进行修改或者等同替换，都不脱离本发明技术方案的精神和范围，其均应涵盖在本发明的权利要求范围当中。

Claims (10)

1.一种多设备联动服务中的连接通道维护系统，包含：用于提供数据业务的服务端和终端设备，其特征在于，所述系统包含：位于终端设备上的多屏通道控制客户端模块和位于服务端上的多屏通道控制服务端模块；

所述多屏通道控制客户端模块，用于获取设备终端的标识，并向多屏通道控制服务端上报本终端与多屏通道的绑定关系；

所述多屏通道控制服务端模块，用于记录终端与多屏通道的绑定关系，并向绑定终端的一方推送服务。

2.根据权利要求1所述的多设备联动服务中的连接通道维护系统，其特征在于，所述多屏通道控制服务端模块包含：

通道维护单元，用于建立并维护多屏通道控制客户端和多屏通道控制服务端之间的Websocket通道；

终端绑定单元，用于记录客户端之间的绑定关系；

终端适配单元，用于识别客户端所在终端的设备类型，并按照设备类型下发匹配的页面地址。

3.一种多设备联动服务中的连接通道维护方法，该方法基于权利要求1-2中任意一条权利要求记载的连接通道维护系统，所述方法包含：

步骤101)维持终端的业务通道，并在终端设备加入多屏联动服务的控制通道；

通过所述控制通道实现多终端设备之间的绑定、用户界面UI同步和状态控制，进而实现了业务和多设备联动控制的分离；

步骤102)采用控制通道的复用实现多页面应用程序中的页面跳转。

4.根据权利要求3所述的多设备联动服务中的连接通道维护方法，其特征在于，终端设备在业务页面加载完成后，自动加载多屏通道控制的客户端模块。

5.根据权利要求4所述的多设备联动服务中的连接通道维护方法，其特征在于，所述的控制通道位于多屏通道控制的客户端模块和多屏通道控制的服务端模块之间，且所述多屏通道控制的客户端模块位于终端设备上；

所述多屏通道控制客户端模块建立与多屏通道控制的服务端模块之间的Websocket连接，即控制通道，并向多屏通道控制的服务端模块上报客户端的终端标识；

所述多屏通道控制服务端模块还用于保存终端设备的标识和Websocket通道的对应关系。

6.根据权利要求5所述的多设备联动服务中的连接通道维护方法，其特征在于，所述多屏通道控制客户端模块定期通过Websocket通道向多屏通道控制服务端模块发送心跳报文，用以维护两者之间的连接通道。

7.根据权利要求5所述的多设备联动服务中的连接通道维护方法，其特征在于，一个多屏通道控制客户端模块通过扫描二维码的方式携带另一个多屏通道客户端模块所在终端设备的标识向多屏通道控制服务端模块请求绑定，多屏通道控制服务端模块保存两个终端设备之间的绑定关系；

其中，绑定报文通过Websocket通道传输。

8.根据权利要求5所述的多设备联动服务中的连接通道维护方法，其特征在于，所述的用户界面UI同步方法具体包含：

当终端设备跳转到新页面之后，位于该终端设备上的多屏通道控制客户端模块通过Websocket通道向位于服务端上的多屏通道控制服务端模块上报终端设备当前所在页面信息，多屏通道控制服务端模块接收终端设备的当前所在页面信息，并保存终端设备与当前所在页面信息的对应关系；

当多屏通道控制服务端模块收到多屏通道控制客户端模块上报的当前所在页面的信息后，根据终端设备浏览器能力和浏览器类型，从终端适配知识库中匹配出发送请求的终端类型并查找是否有与该终端绑定的其他终端，以及其他终端是否处于与该终端所在页面对应的页面上，如果没有绑定终端，不做处理；如果其他终端已经处于该终端所在页面对应的页面上，不作处理；否则，根据请求中的目标类型参数和配置的同步关系，获取目标类型终端的同步页面地址，向目标终端推送同步页面地址。

9.根据权利要求3所述的多设备联动服务中的连接通道维护方法，其特征在于，所述的状态控制方法包含：

当终端设备为手机类型的终端时：当手机类型终端点击进入播放页面时：终端适配模块向手机类型终端对应的绑定电视类型终端推送视频播放页面，而向手机类型终端推送播放控制及推荐页面，所述推荐页面中包括视频播放的控制按钮以及该视频对应的推荐节目列表，其中，

当手机类型终端点击视频播放控制按钮时，多屏通道控制客户端将对应控制命令通过Websocket通道发送到多屏通道控制服务端；终端绑定模块查找该终端绑定的电视类型终端并通过Websocket通道向该终端上的多屏通道控制客户端推送对应控制命令；电视类型终端上的多屏通道控制客户端收到控制命令并执行动作，控制视频播放；

当手机类型终端浏览播放控制及推荐页面中的推荐节目，点击进入一个推荐节目的详情页时，会通过UI同步机制，控制该手机类型终端绑定的终端跳转到对应节目详情页面。

10.根据权利要求3所述的多设备联动服务中的连接通道维护方法，其特征在于，所述步骤102)具体为：将多屏通道控制客户端的页面的dom结构中设置一个iframe，将原有服务页面嵌入iframe中，且在iframe外层创建和维护与多屏通道控制服务端的Websocket通道，通过对iframe刷新实现业务页面的跳转。