CN105228080A - 多屏互动方法、系统及浏览器 - Google Patents
多屏互动方法、系统及浏览器 Download PDFInfo
- Publication number
- CN105228080A CN105228080A CN201410301998.9A CN201410301998A CN105228080A CN 105228080 A CN105228080 A CN 105228080A CN 201410301998 A CN201410301998 A CN 201410301998A CN 105228080 A CN105228080 A CN 105228080A
- Authority
- CN
- China
- Prior art keywords
- browser
- terminal
- webpage
- websocket
- address
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D30/00—Reducing energy consumption in communication networks
- Y02D30/50—Reducing energy consumption in communication networks in wire-line communication networks, e.g. low power modes or reduced link rate
Landscapes
- Information Transfer Between Computers (AREA)
Abstract
一种多屏互动方法、系统及浏览器,所述多屏互动方法通过设置于第一终端的第一浏览器和第二终端的第二浏览器实现多屏互动,包括:在所述第一浏览器与第二浏览器之间建立连接;监控所述第一浏览器上对网页的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述第一浏览器中网页的元素和地址同步传输至所述第二浏览器;所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示。所述多屏互动方法、系统及浏览器可以节省传输带宽,提高第一终端和第二终端屏幕显示内容的实时性,并且,第二终端屏幕可以采用与第一终端屏幕不同的绘画渲染方式,更加灵活。
Description
技术领域
本发明涉及人机交互技术领域,尤其涉及一种多屏互动方法、系统及浏览器。
背景技术
多屏互动指的是,基于通信协议等,通过网络如无线网络WIFI连接,在不同多媒体终端上,如基于IOS,Android等不同平台的不同智能终端设备如手机,平板,电视等之间,可进行多媒体(音频,视频,图片)内容的传输,解析,展示,控制等一系列操作,可以在不同平台的设备上同时共享展示内容,丰富用户的多媒体生活。
目前,多屏互动通过移动终端如手机、平板等对电视进行操控和内容的投放,成为目前消费电子领域的重要技术趋势。目前已有多种方式能够实现多屏互动。
例如,现有的一种双屏互动方法如下:手机对渲染后的结果进行视频压缩,之后通过手机显示屏显示渲染后的结果,并同时通过网络连接,将压缩后的视频内容传送到电视端进行解码并通过电视显示屏进行显示。
上述方案虽然能够实现双屏互动,但是视频的传送占用了大量的无线网络带宽,且电视端依赖手机端的编码功能,例如手机端应用退出,电视端也随之终止。
发明内容
本发明实施例解决的是多屏互动占用大量的无线网络带宽和其他显示终端依赖投射端编码功能的问题。
为解决上述问题,本发明实施例提供了一种多屏互动方法,所述方法通过设置于第一终端的第一浏览器和第二终端的第二浏览器实现多屏互动,包括:
在所述第一浏览器与第二浏览器之间建立连接;
监控所述第一浏览器上对网页的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述第一浏览器中网页的元素和地址同步传输至所述第二浏览器;
所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示。
可选的,所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示,包括:根据所述第二终端屏幕的形状和尺寸,将所述网页对应的内容在第二终端屏幕全屏显示。
可选的,所述在所述第一浏览器与第二浏览器之间建立连接,包括:
通过IP广播发现或者基于IP组播的DNS发现在所述第一浏览器和第二浏览器之间建立NativeSocket连接;
通过所建立的NativeSocket连接,传递所述第一浏览器或者所述第二浏览器的IP地址和机器名,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
可选的,所述方法还包括:
通过所述NativeSocket连接监控所述WebSocket连接,当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接。
可选的,所述当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接,包括:
所述第一浏览器的网络管理单元检测到所述第一浏览器和第二浏览器之间的WebSocket连接出现异常时,通知所述第一浏览器的JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
可选的,所述方法还包括:
通过所述NativeSocket连接将所述第一浏览器和第二浏览器的状态同步。
可选的,所述第一浏览器和第二浏览器的状态同步包括:所述第一浏览器和第二浏览器的Cookie状态同步。
可选的,所述第一终端为手机或平板,所述第二终端为电视或PC。
为解决上述问题,本发明实施例还提供了一种多屏互动系统,所述系统包括:第一终端和第二终端,所述第一终端设置有第一浏览器,所述第二终端设置有第二浏览器,其中:
所述第一浏览器,用于与所述第二浏览器建立连接,监控对第一浏览器的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述网页的元素和地址同步传输至第二浏览器;
所述第二浏览器,用于与所述第一浏览器建立连接,根据所述第一浏览器中网页的元素和地址,以及所述第二浏览器的设置,将所述网页对应的内容进行渲染并显示。
可选的,所述第一浏览器和第二浏览器通过IP广播发现或者基于IP组播的DNS发现建立NativeSocket连接,并通过所建立的NativeSocket连接,传递所述第一浏览器或者所述第二浏览器的IP地址和物理地址,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
可选的,所述第一浏览器和所述第二浏览器还用于通过所述NativeSocket连接监控所述WebSocket连接,所述第一浏览器在检测到所述WebSocket连接出现异常时,与所述第二浏览器重建WebSocket连接。
可选的,所述第一浏览器包括网络管理单元,所述网络管理单元检测到所述第一浏览器和第二浏览器之间的WebSocket连接出现异常时,通知所述第一浏览器的JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
可选的,所述第一浏览器和第二浏览器还用于通过所述NativeSocket连接进行状态同步。
可选的,所述第一浏览器和第二浏览器用于通过所述NativeSocket连接进行Cookie状态同步。
可选的,所述第一终端为手机或平板,所述第二终端为电视或PC。
为解决上述问题,本发明实施例还提供了一种浏览器,所述浏览器适于与设置于其它终端的浏览器进行交互,所述浏览器包括:
第一连接建立单元,用于与所述其它终端的浏览器建立连接;
监控单元,用于监控网页的输入操作,确定是否需要将所述网页的内容投放至所述其它终端的浏览器;
传输单元,用于在需要将所述网页的内容投放至所述其它终端的浏览器时,将所述网页的元素和地址同步传输至所述其它终端的浏览器,使得所述其它终端的浏览器根据所述网页的元素和地址,以及所述其它终端的浏览器的设置,将所述网页对应的内容进行渲染并显示。
可选的,所述第一连接建立单元包括第一连接建立子单元和第二连接建立子单元,其中:
所述第一连接建立子单元,用于通过IP广播发现或者基于IP组播的DNS发现与所述其它终端的浏览器建立NativeSocket连接;
所述第二连接建立子单元,用于通过所述第一连接建立子单元已建立的NativeSocket连接,传递所述浏览器或者所述其它终端的浏览器的IP地址或者物理地址,在网页中嵌入或者注入的JavaScript中直接建立与所述其它终端的浏览器之间的WebSocket连接。
可选的,所述浏览器还包括:网络管理单元,用于通过所述NativeSocket连接监控所述WebSocket连接,当监测到所述WebSocket连接出现异常时,触发所述第二连接建立子单元重新建立与所述其它终端的浏览器之间的WebSocket连接。
可选的,所述网络管理单元检测到与所述其它终端的浏览器之间的WebSocket连接出现异常时,通知JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
可选的,所述网络管理单元还用于通过所述NativeSocket连接与所述其它终端的浏览器进行状态同步。
可选的,所述网络管理单元用于实现与所述其它终端的浏览器Cookie的状态同步。
为解决上述问题,本发明实施例还提供了另一种浏览器,所述浏览器适于与设置于其它终端的浏览器进行交互,所述浏览器包括:
第二连接建立单元,用于与所述其它终端的浏览器建立连接;
接收单元,用于采用所述第二连接建立单元所建立的连接,接收所述其它终端的浏览器传输的网页的元素和地址;
渲染单元,用于根据所述接收单元接收到的网页的元素和地址,以及所述浏览器的设置,将所述网页对应的内容进行渲染;
显示单元,用于将所述渲染单元渲染后的网页的内容进行显示。
与现有技术相比,本发明实施例的技术方案具有以下优点:
在需要将第一浏览器的内容在位于第二终端的第二浏览器同步显示时,在第二浏览器端,不是将第一浏览器渲染后的内容进行解码并显示,而是将第一浏览器中的网页的元素和地址在渲染前同步至第二浏览器,在第二浏览器端进行渲染并显示,因此可以节省传输带宽,尤其是对于视频等大数据量的数据传送时,可以节省大量传输带宽。并且,可以在第一终端的网页页面尚未完全渲染结束之前,第二终端就可以开始获得需要显示的原数据(如图片,视频等),进行显示渲染,因此可以节约处理时间,降低延迟,提高第一终端和第二终端屏幕显示内容的实时性。而且,第二终端屏幕可以采用与第一终端屏幕不同的绘画渲染方式,更加灵活,在第一终端浏览器的网页中无须添加相应的显示逻辑。此外,本发明实施例直接通过第一浏览器和第二浏览器对网页的内容进行传输和投放,属于应用级别的多屏互动,无须依赖具体的操作系统和底层传输协议,因此可以适于采用不同操作系统和底层传输协议的终端间的多屏互动。
而通过安全IP广播发现所广播的信息完全加密,可以增强第一终端与第二终端通信的安全性。
此外,通过所述NativeSocket连接监控所述WebSocket连接,当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接,可以提高WebSocket连接的稳定性。
附图说明
图1是本发明实施例中一种多屏互动方法流程图;
图2是本发明实施例中一种多屏互动系统结构示意图;
图3是本发明实施例中一种浏览器结构示意图;
图4是本发明实施例中另一种浏览器结构示意图。
具体实施方式
在现有技术中,例如苹果电视(APPLETV)或谷歌电视棒(GoogleChromecast)等是将渲染后的内容压缩成流,传输至第二浏览器,第二浏览器端有一个解码器进行解码,其中,AppleTV是操作系统级别的,GoogleChromecast是浏览器级别的。
经研究发现,上述方案虽然能够实现双屏互动,但是视频的传送占用了大量的无线网络带宽,且电视端依赖手机端的编码方式,例如手机端应用退出,电视端也随之终止。
为解决上述问题,本发明实施例在第一终端侧将渲染前的数据,包括网页元素和网页地址传输至第二浏览器,由第二浏览器根据网页元素、地址,以及第二浏览器的设置,将所述网页对应的内容进行渲染并显示,以节约传输带宽,且第二终端不依赖第一终端的编码方式,不需要解码,因此可以减少传输时延,使得第一浏览器显示的内容可以通过第二浏览器灵活显示。
为使本发明的上述目的、特征和优点能够更为明显易懂,下面结合附图对本发明的具体实施例做详细的说明。
参照图1所示的本发明实施例中的多屏互动方法流程图,通过设置于第一终端的第一浏览器和第二终端的第二浏览器实现多屏互动,其中第一终端可以为手机或平板,第二终端可以为电视或个人电脑(PersonalComputer,PC),以下通过具体步骤进行详细说明。
步骤S11,在所述第一浏览器与第二浏览器之间建立连接。
在具体实施中,可以通过如下方式在第一浏览器和第二浏览器之间建立连接:首先通过IP广播发现或者基于IP组播的域名服务器(DomainNameServer,DNS)发现在所述第一浏览器和第二浏览器之间建立NativeSocket连接。之后,通过所建立的NativeSocket连接,传递所述第一浏览器或者所述第二浏览器的IP地址和物理地址,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
其中,Native:是Java方法的关键字,是指本地方法,当在方法中调用一些不是由Java语言写的代码或者在方法中用Java语言,直接操纵计算机硬件时要声明为Native方法。
NativeSocket:中文解释为本地套接字。
WebSocket:中文解释为网络套接字,是超文本标记语言(HypertextMarkupLanguage,HTML)5协议中一个非常重要的特性。采用WebSocket连接可以实现双向通信。Websocket能够保证实时性,提供类似NativeSocket的功能,但是不稳定。
为提高WebSocket连接的稳定性,可以通过所述NativeSocket连接监控所述WebSocket连接,当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接。例如,在第一浏览器和第二浏览器中可以设置网络管理单元,在所述第一浏览器的网络管理单元检测到所述第一浏览器和第二浏览器之间的WebSocket连接出现异常时,通知所述第一浏览器的JSRuntime通过JavaScript引擎的扩展应用程序接口(ApplicationProgramInterface,API)重新建立WebSocket连接。
其中,JavaScript,指Java脚本,是一种基于对象和事件驱动的客户端脚本语言。
步骤S12,监控所述第一浏览器上对网页的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述第一浏览器中网页的元素和地址同步传输至所述第二浏览器。
例如,可以监控所述第一浏览器上用户通过键盘、鼠标、手势等方式对网页进行的输入操作。在接收到用户输入的网页地址时,可以获取互联网端的网页的内容并进行检查,在需要将网页的内容投送到所述第二浏览器时,将需要投送的网页的元素和地址传递至所述第二浏览器。
在具体实施中,网页的元素可以有多种类型。例如,对于HTML5网页,有视频、音频、图像、三维画布(3DCanvas)、二维画布(2DCanvas)、文本等多种类型的元素。
在本发明一实施例中,可以通过所述NativeSocket连接将所述第一浏览器和第二浏览器的状态同步,包括将所述第一浏览器和第二浏览器的Cookie状态同步。其中,第一浏览器的Cookie是指所述第一浏览器存储在第一终端的数据,第二浏览器的Cookie是指第二浏览器存储在第二终端的数据。
在具体实施中,可以通过所建立的NativeSocket连接实现第一浏览器11和第二浏览器21状态(包括Cookie状态)的同步和管理,并提供对WebSocket的监控。在本发明一实施例中,可以由第二浏览器21中的本地HTTP服务器(LocalHTTPServer)将websocket连接的异常信息,传递至第一浏览器11。
而通过所建立的WebSocket连接,则可以实现第一浏览器11和第二浏览器21网页内事件处理的同步。
S13,所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示。
在具体实施中,用户可以设置第二浏览器的网页在第二终端显示的方式,从而可以使得第二终端采用与第一终端屏幕不同的绘画渲染方式,例如,可以根据所述第二终端屏幕的形状和尺寸,将所述网页对应的内容如图片或视频等,在第二终端屏幕全屏显示。在这一过程中,无须在第一终端网页进行设置在第二终端的显示逻辑,第一终端仅需要将需要在第二终端显示的网页的元素和地址传输至第二终端即可。例如第一终端接收到来电时,可以自动切换至来电显示界面而不影响第二终端继续播放浏览器网页中的视频,除非用户主动在第一终端输入相应的控制操作控制第二终端浏览器的播放中止或退出。
采用上述方案,在需要将第一浏览器的内容在位于第二终端的第二浏览器同步显示时,在第二浏览器端,不是将第一浏览器渲染后的内容进行解码并显示,而是将第一浏览器中的网页的元素和地址在渲染前同步至第二浏览器,在第二浏览器端进行渲染并显示,因此可以节省传输带宽,尤其是对于视频等大数据量的数据传送时。
并且,可以在第一终端的网页页面尚未完全渲染结束之前,第二终端就可以开始获得需要显示的原数据(图片,视频等),进行显示渲染,因此可以节约处理时间,降低延迟,提高第一终端和第二终端屏幕显示内容的实时性。
而且,第二终端屏幕可以采用与第一终端屏幕不同的绘画渲染方式,例如,可以根据第二终端屏幕的形状和尺寸,进行全屏显示,或者当第一终端切换至其它界面不影响第二终端的显示操作。更加灵活。
此外,本发明实施例直接通过第一浏览器和第二浏览器对网页的内容进行传输和投放,属于应用级别的多屏互动,无须依赖具体的操作系统和底层传输协议,因此可以适于采用不同操作系统和底层传输协议的终端间的多屏互动。
而通过所述NativeSocket连接监控所述WebSocket连接,当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接,可以提高WebSocket连接的稳定性。
本发明实施例还提供了所述方法对应的多屏互动系统,参照图2所示的多屏互动系统结构示意图,所述多屏互动系统包括第一终端1和第二终端2,所述第一终端1包括第一浏览器11,所述第二终端2的第二浏览器21,其中:
第一浏览器11,可以用于与所述第二浏览器21建立连接,监控对第一浏览器的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述网页的元素和地址同步传输至第二浏览器21。
第二浏览器21,可以用于与所述第一浏览器11建立连接,根据所述第一浏览器11中网页的元素和地址,以及所述第二浏览器21的设置,将所述网页对应的内容进行渲染并显示。
第一浏览器11和第二浏览器21可以通过IP广播发现或者基于IP组播的DNS发现建立NativeSocket连接,并通过所建立的NativeSocket连接,传递所述第一浏览器11或者所述第二浏览器21的IP地址和物理地址,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
用户可以通过键盘、鼠标、手势等方式对网页进行的输入操作,在接收到用户输入的网页地址时,通过所建立的WebSocket连接,第一浏览器11可以获取互联网端的网页的内容并进行检查,在需要将网页的内容投送到所述第二浏览器21时,将需要投送的网页的内容传递至所述第二浏览器21。
在本发明一实施例中,所述第一终端1为手机或平板,所述第二终端2为电视或PC。在本发明另一实施例中,所述第一终端1为电视或PC,所述第二终端2为手机或平板。在本发明其他实施例中,所述第一终端1及第二终端2可以为同种终端设备。
以下以所述第一终端1为手机,所述第二终端2为电视为例进行详细说明。
在具体实施中,位于手机端的第一浏览器11与位于电视端的第二浏览器21可以通过安全IP广播发现或者基于IP组播的DNS发现建立NativeSocket连接。其中,通过安全IP广播发现所广播的信息完全加密,可以增强手机与电视通信的安全性。
在第一浏览器11和第二浏览器21之间建立NativeSocket连接和WebSocket连接后,第一浏览器11在接收到用户输入的网页地址时,从互联网端获取所述网页地址对应的网页的内容并进行检查,在需要将网页的内容投送到第二浏览器21时,通过所建立的WebSocket连接,将需要投送的网页的元素和地址同步传递至所述第二浏览器21,从而实现第一终端和第二终端屏幕显示内容的互动,用户可以在第一终端输入需要显示的网页的地址,而在第二终端上进行同步显示。并且,由于仅需要向第二终端的第二浏览器传递需要投送的网页的地址,因此可以节约网络传输资源。
此外,通过第一浏览器11和第二浏览器21之间建立的NativeSocket连接,还可以提供对WebSocket连接的监控,这样,所述第一浏览器还可用于当监测到所述WebSocket连接出现异常时,与所述第二浏览器重新建立WebSocket连接。
在具体实施中,可以通过所建立的NativeSocket连接实现第一浏览器11和第二浏览器21状态(包括Cookie状态)的同步和管理,并提供对WebSocket的监控。在本发明一实施例中,可以由第二浏览器21中的本地HTTP服务器(LocalHTTPServer)将WebSocket连接的异常信息,传递至第一浏览器11。
而通过所建立的WebSocket连接,则可以实现第一浏览器11和第二浏览器21网页内事件处理的同步。例如,用户通过键盘,鼠标,手势等输入操作作用于第一浏览器11中的网页时,第一浏览器11通过对所述用户的输入操作进行监控,并和第二浏览器21通过WebSocket进行通信和协调,从而可以将第一浏览器11的网页的内容变化同步反映到第二浏览器21中。比如第一浏览器中点击图片,第一浏览器11发生了变化,有了新的图片,第二浏览器21会收到相应的变化图片,从而达到屏幕投送的效果。
在数据传送的过程中,第一浏览器11和第二浏览器21提供了底层的支持,例如,在第一浏览器11下载的原图片数据,传送到第二浏览器21时,第二浏览器可以根据预设设置对图片进行渲染(绘画),根据第二终端屏幕的形状和尺寸对图片尺寸进行优化,由于在传输过程中传输的是渲染前的图片数据,从而可以节省传输带宽,提高传输速度,并且由于在第一浏览器11的图片渲染过程中,原始图片数据(即网页元素和地址)传输至第二浏览器21,并由第二浏览器21渲染,因此还可以提高第二终端2和第一终端1显示的同步性。
本发明实施例还提供了一种浏览器30,适于与设置于其它终端的浏览器进行交互,参照图3所示的浏览器结构示意图,浏览器11可以包括:第一连接建立单元31、监控单元32、传输单元33,其中:
第一连接建立单元31,用于与所述其它终端的浏览器建立连接;
监控单元32,用于监控网页的输入操作,确定是否需要将所述网页的内容投放至所述其它终端的浏览器;
传输单元33,用于在需要将所述网页的内容投放至所述其它终端的浏览器时,将所述网页的元素和地址同步传输至所述其它终端的浏览器,使得所述其它终端的浏览器根据所述网页的元素和地址,以及所述其它终端的浏览器的设置,将所述网页对应的内容进行渲染并显示。
在具体实施中,用户可以对所述其它终端的浏览器的显示方式进行设置,例如,可以设置为根据所述其它终端的浏览器40所在终端屏幕的形状和尺寸进行相应显示。例如,对于图片或视频可以设置为全屏显示。
在具体实施中,所述第一连接建立单元31可以包括第一连接建立子单元311和第二连接建立子单元312,其中:
所述第一连接建立子单元311,可以用于通过IP广播发现或者基于IP组播的DNS发现与所述其它终端的浏览器建立NativeSocket连接;
所述第二连接建立子单元312,可以用于通过所述第一连接建立子单元311已建立的NativeSocket连接,在网页中嵌入或者注入的JavaScript中直接建立与所述其它终端的浏览器之间的WebSocket连接。
在具体实施中,所述浏览器30还可包括:网络管理单元34,用于通过所述NativeSocket连接监控所述WebSocket连接,当监测到所述WebSocket连接出现异常时,触发所述第二连接建立子单元312重新建立与所述其它终端的浏览器之间的WebSocket连接。
在具体实施中,所述网络管理单元34在检测到与所述其它终端的浏览器之间的WebSocket连接出现异常时,可以通知JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
在具体实施中,所述网络管理单元34还可用于通过所述NativeSocket连接与所述其它终端的浏览器进行状态同步。例如,所述网络管理单元34可以用于实现所述浏览器30的Cookie与所述其它终端的浏览器的Cookie的状态同步。
本发明实施例还提供了另一种浏览器,所述浏览器适于与设置于其它终端的浏览器进行交互,以下参照图4,对其结构和功能进行详细说明,浏览器40包括:第二连接建立单元41、接收单元42、渲染单元43和显示单元44,其中:
第二连接建立单元41,用于与所述其它终端的浏览器建立连接;
接收单元42,用于采用所述第二连接建立单元41所建立的连接,接收所述其它终端的浏览器传输的网页的元素和地址;
渲染单元43,用于根据所述接收单元42接收到的网页的元素和地址,以及所述浏览器40的设置,将所述网页对应的内容进行渲染;
显示单元44,用于将所述渲染单元43渲染后的网页的内容进行显示。
在具体实施中,用户可以对浏览器40的显示方式进行设置,例如,可以根据浏览器40所在终端屏幕的形状和尺寸进行相应显示。例如,对于图片或视频可以设置为全屏显示。这样,当第一终端和第二终端屏幕的尺寸和显示比例不一致时,所述浏览器40可以对接收到的网页、图片、视频等数据根据所述浏览器40所在终端屏幕的形状和尺寸对数据进行渲染,得到适应于第二终端屏幕的显示页面,从而可以增强用户体验。
本领域普通技术人员可以理解上述实施例的各种方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成,该程序可以存储于一计算机可读存储介质中,存储介质可以包括:ROM、RAM、磁盘或光盘等。
虽然本发明披露如上,但本发明并非限定于此。任何本领域技术人员,在不脱离本发明的精神和范围内,均可作各种更动与修改,因此本发明的保护范围应当以权利要求所限定的范围为准。
Claims (22)
1.一种多屏互动方法,其特征在于,通过设置于第一终端的第一浏览器和第二终端的第二浏览器实现多屏互动,包括:
在所述第一浏览器与第二浏览器之间建立连接;
监控所述第一浏览器上对网页的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述第一浏览器中网页的元素和地址同步传输至所述第二浏览器;
所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示。
2.如权利要求1所述的多屏互动方法,其特征在于,所述第二浏览器根据所述第一浏览器中网页的元素和地址,以及第二终端的设置,将所述网页对应的内容进行渲染并显示,包括:
根据所述第二终端屏幕的形状和尺寸,将所述网页对应的内容在第二终端屏幕全屏显示。
3.如权利要求1所述的多屏互动方法,其特征在于,所述在所述第一浏览器与第二浏览器之间建立连接,包括:
通过IP广播发现或者基于IP组播的DNS发现在所述第一浏览器和第二浏览器之间建立NativeSocket连接;
通过所建立的NativeSocket连接,传递所述第一浏览器或者所述第二浏览器的IP地址和机器名,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
4.如权利要求3所述的多屏互动方法,其特征在于,还包括:
通过所述NativeSocket连接监控所述WebSocket连接,当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接。
5.如权利要求4所述的多屏互动方法,其特征在于,所述当检测到所述WebSocket连接出现异常时,在所述第一浏览器与所述第二浏览器之间重新建立WebSocket连接,包括:
所述第一浏览器的网络管理单元检测到所述第一浏览器和第二浏览器之间的WebSocket连接出现异常时,通知所述第一浏览器的JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
6.如权利要求3所述的多屏互动方法,其特征在于,还包括:
通过所述NativeSocket连接将所述第一浏览器和第二浏览器的状态同步。
7.如权利要求6所述的多屏互动方法,其特征在于,所述第一浏览器和第二浏览器的状态同步包括:所述第一浏览器和第二浏览器的Cookie状态同步。
8.如权利要求1至7任一项所述的多屏互动方法,其特征在于,所述第一终端为手机或平板,所述第二终端为电视或PC。
9.一种多屏互动系统,其特征在于,包括:第一终端和第二终端,所述第一终端设置有第一浏览器,所述第二终端设置有第二浏览器,其中:
所述第一浏览器,用于与所述第二浏览器建立连接,监控对第一浏览器的输入操作,在需要将所述网页的内容投放至第二浏览器时,将所述网页的元素和地址同步传输至第二浏览器;
所述第二浏览器,用于与所述第一浏览器建立连接,根据所述第一浏览器中网页的元素和地址,以及所述第二浏览器的设置,将所述网页对应的内容进行渲染并显示。
10.如权利要求9所述的多屏互动系统,其特征在于,所述第一浏览器和第二浏览器通过IP广播发现或者基于IP组播的DNS发现建立NativeSocket连接,并通过所建立的NativeSocket连接,传递所述第一浏览器或者所述第二浏览器的IP地址和物理地址,在网页嵌入或注入的JavaScript中直接建立WebSocket连接。
11.如权利要求10所述的多屏互动系统,其特征在于,所述第一浏览器和所述第二浏览器还用于通过所述NativeSocket连接监控所述WebSocket连接,所述第一浏览器在检测到所述WebSocket连接出现异常时,与所述第二浏览器重建WebSocket连接。
12.如权利要求11所述的多屏互动系统,其特征在于,所述第一浏览器包括网络管理单元,所述网络管理单元检测到所述第一浏览器和第二浏览器之间的WebSocket连接出现异常时,通知所述第一浏览器的JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
13.如权利要求10所述的多屏互动系统,其特征在于,所述第一浏览器和第二浏览器还用于通过所述NativeSocket连接进行状态同步。
14.如权利要求13所述的多屏互动系统,其特征在于,所述第一浏览器和第二浏览器用于通过所述NativeSocket连接进行Cookie状态同步。
15.如权利要求9至14任一项所述的多屏互动系统,其特征在于,所述第一终端为手机或平板,所述第二终端为电视或PC。
16.一种浏览器,其特征在于,适于与设置于其它终端的浏览器进行交互,所述浏览器包括:
第一连接建立单元,用于与所述其它终端的浏览器建立连接;
监控单元,用于监控网页的输入操作,确定是否需要将所述网页的内容投放至所述其它终端的浏览器;
传输单元,用于在需要将所述网页的内容投放至所述其它终端的浏览器时,将所述网页的元素和地址同步传输至所述其它终端的浏览器,使得所述其它终端的浏览器根据所述网页的元素和地址,以及所述其它终端的浏览器的设置,将所述网页对应的内容进行渲染并显示。
17.如权利要求16所述的浏览器,其特征在于,所述第一连接建立单元包括第一连接建立子单元和第二连接建立子单元,其中:
所述第一连接建立子单元,用于通过IP广播发现或者基于IP组播的DNS发现与所述其它终端的浏览器建立NativeSocket连接;
所述第二连接建立子单元,用于通过所述第一连接建立子单元已建立的NativeSocket连接,传递所述浏览器或者所述其它终端的浏览器的IP地址或者物理地址,在网页中嵌入或者注入的JavaScript中直接建立与所述其它终端的浏览器之间的WebSocket连接。
18.如权利要求17所述的浏览器,其特征在于,还包括:网络管理单元,用于通过所述NativeSocket连接监控所述WebSocket连接,当监测到所述WebSocket连接出现异常时,触发所述第二连接建立子单元重新建立与所述其它终端的浏览器之间的WebSocket连接。
19.如权利要求18所述的浏览器,其特征在于,所述网络管理单元检测到与所述其它终端的浏览器之间的WebSocket连接出现异常时,通知JSRuntime通过JavaScript引擎的扩展API重新建立WebSocket连接。
20.如权利要求18所述的浏览器,其特征在于,所述网络管理单元还用于通过所述NativeSocket连接与所述其它终端的浏览器进行状态同步。
21.如权利要求20所述的浏览器,其特征在于,所述网络管理单元用于实现与所述其它终端的浏览器Cookie的状态同步。
22.一种浏览器,其特征在于,适于与设置于其它终端的浏览器进行交互,所述浏览器包括:
第二连接建立单元,用于与所述其它终端的浏览器建立连接;
接收单元,用于采用所述第二连接建立单元所建立的连接,接收所述其它终端的浏览器传输的网页的元素和地址;
渲染单元,用于根据所述接收单元接收到的网页的元素和地址,以及所述浏览器的设置,将所述网页对应的内容进行渲染;
显示单元,用于将所述渲染单元渲染后的网页的内容进行显示。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410301998.9A CN105228080B (zh) | 2014-06-27 | 2014-06-27 | 多屏互动方法、系统及浏览器 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201410301998.9A CN105228080B (zh) | 2014-06-27 | 2014-06-27 | 多屏互动方法、系统及浏览器 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN105228080A true CN105228080A (zh) | 2016-01-06 |
CN105228080B CN105228080B (zh) | 2018-12-07 |
Family
ID=54996704
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201410301998.9A Active CN105228080B (zh) | 2014-06-27 | 2014-06-27 | 多屏互动方法、系统及浏览器 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN105228080B (zh) |
Cited By (11)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105812851A (zh) * | 2016-03-21 | 2016-07-27 | 深圳市茁壮网络股份有限公司 | 一种插播数据播放方法、装置及系统 |
CN107241311A (zh) * | 2017-05-15 | 2017-10-10 | 北京微影时代科技有限公司 | 一种实时选座方法及装置 |
CN107508972A (zh) * | 2017-08-07 | 2017-12-22 | 努比亚技术有限公司 | 移动终端的投影方法、系统及计算机可读存储介质 |
CN107749843A (zh) * | 2017-10-13 | 2018-03-02 | 北京中教在线科技有限公司 | 一种电子画板共享方法 |
CN107896156A (zh) * | 2016-11-26 | 2018-04-10 | 上海壹账通金融科技有限公司 | web前端异常的监控方法、监控服务器及监控系统 |
CN109803162A (zh) * | 2019-01-22 | 2019-05-24 | 青岛海信电器股份有限公司 | 信息共享方法、装置及智能电视 |
CN110554871A (zh) * | 2018-06-04 | 2019-12-10 | 上海视九信息科技有限公司 | NinePatch图形描绘方法及装置、计算机可读存储介质 |
CN111221665A (zh) * | 2019-12-25 | 2020-06-02 | 中科曙光国际信息产业有限公司 | 基于浏览器的容器远程登陆方法和装置 |
CN112584228A (zh) * | 2020-11-25 | 2021-03-30 | 山东宁泓信息技术有限公司 | 一种基于web的低延迟投屏方法及系统 |
CN113542335A (zh) * | 2020-04-30 | 2021-10-22 | 北京字节跳动网络技术有限公司 | 一种信息共享方法、装置、电子设备及存储介质 |
CN115022708A (zh) * | 2022-05-31 | 2022-09-06 | 咪咕视讯科技有限公司 | 多屏互动方法、装置、网络设备及终端 |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20120011550A1 (en) * | 2010-07-11 | 2012-01-12 | Jerremy Holland | System and Method for Delivering Companion Content |
CN103024588A (zh) * | 2012-11-15 | 2013-04-03 | 长春指南针科技有限公司 | 一种多屏互动系统及方法 |
CN103414746A (zh) * | 2013-07-05 | 2013-11-27 | 深圳市天朗时代科技有限公司 | 一种跨平台网络交互的实现方法及其识读器和网络服务器 |
CN103533428A (zh) * | 2012-10-31 | 2014-01-22 | Tcl集团股份有限公司 | 将智能终端网页视频推送到电视播放的方法及智能终端 |
CN103607625A (zh) * | 2013-11-15 | 2014-02-26 | 四川长虹电器股份有限公司 | 基于超文本标记语言实现多屏协同的系统及方法 |
US20140068520A1 (en) * | 2012-08-29 | 2014-03-06 | Apple Inc. | Content presentation and interaction across multiple displays |
-
2014
- 2014-06-27 CN CN201410301998.9A patent/CN105228080B/zh active Active
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US20120011550A1 (en) * | 2010-07-11 | 2012-01-12 | Jerremy Holland | System and Method for Delivering Companion Content |
US20140068520A1 (en) * | 2012-08-29 | 2014-03-06 | Apple Inc. | Content presentation and interaction across multiple displays |
CN103533428A (zh) * | 2012-10-31 | 2014-01-22 | Tcl集团股份有限公司 | 将智能终端网页视频推送到电视播放的方法及智能终端 |
CN103024588A (zh) * | 2012-11-15 | 2013-04-03 | 长春指南针科技有限公司 | 一种多屏互动系统及方法 |
CN103414746A (zh) * | 2013-07-05 | 2013-11-27 | 深圳市天朗时代科技有限公司 | 一种跨平台网络交互的实现方法及其识读器和网络服务器 |
CN103607625A (zh) * | 2013-11-15 | 2014-02-26 | 四川长虹电器股份有限公司 | 基于超文本标记语言实现多屏协同的系统及方法 |
Cited By (12)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105812851A (zh) * | 2016-03-21 | 2016-07-27 | 深圳市茁壮网络股份有限公司 | 一种插播数据播放方法、装置及系统 |
CN107896156A (zh) * | 2016-11-26 | 2018-04-10 | 上海壹账通金融科技有限公司 | web前端异常的监控方法、监控服务器及监控系统 |
CN107241311A (zh) * | 2017-05-15 | 2017-10-10 | 北京微影时代科技有限公司 | 一种实时选座方法及装置 |
CN107508972A (zh) * | 2017-08-07 | 2017-12-22 | 努比亚技术有限公司 | 移动终端的投影方法、系统及计算机可读存储介质 |
CN107749843A (zh) * | 2017-10-13 | 2018-03-02 | 北京中教在线科技有限公司 | 一种电子画板共享方法 |
CN110554871A (zh) * | 2018-06-04 | 2019-12-10 | 上海视九信息科技有限公司 | NinePatch图形描绘方法及装置、计算机可读存储介质 |
CN109803162A (zh) * | 2019-01-22 | 2019-05-24 | 青岛海信电器股份有限公司 | 信息共享方法、装置及智能电视 |
CN111221665A (zh) * | 2019-12-25 | 2020-06-02 | 中科曙光国际信息产业有限公司 | 基于浏览器的容器远程登陆方法和装置 |
CN113542335A (zh) * | 2020-04-30 | 2021-10-22 | 北京字节跳动网络技术有限公司 | 一种信息共享方法、装置、电子设备及存储介质 |
CN112584228A (zh) * | 2020-11-25 | 2021-03-30 | 山东宁泓信息技术有限公司 | 一种基于web的低延迟投屏方法及系统 |
CN115022708A (zh) * | 2022-05-31 | 2022-09-06 | 咪咕视讯科技有限公司 | 多屏互动方法、装置、网络设备及终端 |
CN115022708B (zh) * | 2022-05-31 | 2024-03-12 | 咪咕视讯科技有限公司 | 多屏互动方法、装置、网络设备及终端 |
Also Published As
Publication number | Publication date |
---|---|
CN105228080B (zh) | 2018-12-07 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN105228080A (zh) | 多屏互动方法、系统及浏览器 | |
CN110324671B (zh) | 网页视频播放方法及装置、电子设备及存储介质 | |
US20200162548A1 (en) | Synchronizing an application on a companion device | |
CN108933948B (zh) | 一种视频播放进度同步方法及装置 | |
CN103716709A (zh) | 一种同屏互动方法以及装置 | |
CN104735524A (zh) | 移动终端的数据分享方法及数据分享系统 | |
US10397647B2 (en) | System and method for delivering interactive trigger events | |
CN109803151B (zh) | 多媒体数据流切换方法、装置、存储介质及电子装置 | |
CN105282601A (zh) | 一种同屏共享的方法、装置及系统 | |
CN102547443A (zh) | 一种多终端系统资源共享及互动实现方法 | |
CN103412896A (zh) | 浏览器资源展示的方法和系统 | |
CN104717542A (zh) | 一种智能电视的同步信息获取方法、装置及系统 | |
CN103618941A (zh) | 一种基于多屏互动的交互式系统及方法 | |
CN102469562B (zh) | 移动终端的功率消耗控制方法与装置 | |
WO2015180446A1 (zh) | 一种多设备联动服务中的连接通道维护系统及方法 | |
CN102387187A (zh) | 服务器、客户端及利用其远程播放视频文件的方法和系统 | |
CN104932849A (zh) | 一种设置应用场景的方法、设备和系统 | |
CN103891296A (zh) | 信息处理设备、信息处理方法以及程序 | |
CN103514219A (zh) | 一种在多个终端间分享Web内容的方法及系统 | |
CN104202652A (zh) | 一种电视机机顶盒的播放控制方法及机顶盒 | |
CN110545457A (zh) | 一种视频播放方法、视频播放系统、终端设备及存储介质 | |
US20140208352A1 (en) | Flash video enabler for ios devices | |
CN107241651B (zh) | 一种媒体数据播放方法和装置、智能终端 | |
CN112738620A (zh) | 一种媒体资源投屏方法、设备及系统 | |
CN105573180A (zh) | 终端控制方法和系统 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
C06 | Publication | ||
PB01 | Publication | ||
C10 | Entry into substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |