掌桥专利:专业的专利平台
掌桥专利
首页

操作界面操作方法、电子设备及存储介质

文献发布时间:2024-04-18 20:01:23


操作界面操作方法、电子设备及存储介质

技术领域

本公开涉及网络通信技术领域,尤其涉及一种操作界面操作方法、电子设备及存储介质。

背景技术

远程浏览器是指用户在使用本地浏览器访问外部网站时,不是直接访问,而是首先访问部署在远程服务器上的浏览器,再由远程服务器上的浏览器访问外部网站,访问成功后,由远程浏览器生成页面图片传给用户使用的浏览器,并进行显示。通常,用户需要使用浏览器的系统弹窗功能(例如,alert、confirm、prompt等)时,由于用户所看到的页面是远程浏览器生成的页面图片,而远程浏览器生成的页面图片是不包括系统弹窗部分的,导致用户在本地浏览器的显示页面中无法使用远程浏览器的系统弹窗功能。

需要说明的是,在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解,因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种操作界面操作方法、电子设备及存储介质,能够解决用户在本地浏览器的显示页面中无法使用远程浏览器的系统弹窗功能的技术问题。

本公开的其他特性和优点将通过下面的详细描述变得显然,或部分地通过本公开的实践而习得。

根据本公开的一个方面,提供一种操作界面操作方法,应用于终端,所述终端上搭载有本地浏览器,所述操作界面操作方法包括:

建立本地浏览器与服务器中远程浏览器之间的通信连接;

监听所述本地浏览器显示的网页图片上的操作事件,所述网页图片为所述远程浏览器中呈现的网页界面的图片;

在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数;

基于所述通信连接接收所述远程浏览器发送的所述显示参数,并根据所述显示参数在所述本地浏览器中显示所述操作界面;

获取所述操作界面对应的输入结果,并基于所述通信连接将所述输入结果发送至所述远程浏览器,以使所述远程浏览器执行所述输入结果对应的操作。

可选地,所述建立本地浏览器与服务器中远程浏览器之间的通信连接的步骤,包括:

通过Chrome DevTools协议中的WebSocket消息通道,将所述本地浏览器与所述远程浏览器进行连接。

可选地,所述根据所述显示参数在所述本地浏览器中显示所述操作界面的步骤,包括:

获取所述显示参数对应的界面类型;

比对所述显示参数对应的界面类型与所述请求指令对应的界面类型;

在所述显示参数对应的界面类型与所述请求指令对应的界面类型相同的情况下,读取所述显示参数,以在所述本地浏览器中显示所述操作界面。

可选地,所述操作界面包括系统弹窗和/或功能控件。

可选地,所述监听所述本地浏览器显示的网页图片上的操作事件的步骤,包括:

获取所述网页图片对应的第一网址信息;

在所述第一网址信息与外网对应的第二网址信息匹配的情况下,监听所述本地浏览器显示的网页图片上的操作事件。

可选地,所述在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数的步骤,包括:

在所述操作事件为触发显示操作界面的事件的情况下,输出访问所述外网的风险提示信息对应的进入选项和退出选项;

在监听到所述进入选项的点击事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

根据本公开的另一个方面,提供一种操作界面操作方法,应用于服务器,所述服务器中搭载有远程浏览器,所述操作界面操作方法包括:

建立远程浏览器与终端上搭载的本地浏览器之间的通信连接;

基于所述通信连接接收所述本地浏览器发送的请求指令,并根据所述请求指令获取用于显示操作界面的显示参数;

基于所述通信连接将所述显示参数发送至所述本地浏览器,以使所述本地浏览器显示所述显示参数对应的操作界面;

基于所述通信连接接收所述本地浏览器发送的输入结果,并在所述远程浏览器中执行所述输入结果对应的操作。

可选地,所述建立远程浏览器与终端上搭载的本地浏览器之间的通信连接的步骤,包括:

通过Chrome DevTools协议中的WebSocket消息通道,将所述远程浏览器与所述本地浏览器进行连接。

可选地,所述根据所述请求指令获取用于显示操作界面的显示参数的步骤,包括:

根据所述请求指令确定所述操作界面的界面类型;

获取所述界面类型对应的显示参数。

根据本公开的再一个方面,提供一种操作界面操作装置,所述操作界面操作装置配置于终端,所述终端上搭载有本地浏览器,所述操作界面操作装置包括:

第一通信模块,用于建立本地浏览器与服务器中远程浏览器之间的通信连接;

事件监听模块,用于监听所述本地浏览器显示的网页图片上的操作事件,所述网页图片为所述远程浏览器中呈现的网页界面的图片;

指令发送模块,用于在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数;

界面显示模块,用于基于所述通信连接接收所述远程浏览器发送的所述显示参数,并根据所述显示参数在所述本地浏览器中显示所述操作界面;

结果发送模块,用于获取所述操作界面对应的输入结果,并基于所述通信连接将所述输入结果发送至所述远程浏览器,以使所述远程浏览器执行所述输入结果对应的操作。

根据本公开的又一个方面,提供一种操作界面操作装置,所述操作界面操作装置配置于服务器,所述服务器中搭载有远程浏览器,所述操作界面操作装置包括:

第二通信模块,用于建立远程浏览器与终端上搭载的本地浏览器之间的通信连接;

指令接收模块,用于基于所述通信连接接收所述本地浏览器发送的请求指令,并根据所述请求指令获取用于显示操作界面的显示参数;

参数发送模块,用于基于所述通信连接将所述显示参数发送至所述本地浏览器,以使所述本地浏览器显示所述显示参数对应的操作界面;

结果接收模块,用于基于所述通信连接接收所述本地浏览器发送的输入结果,并在所述远程浏览器中执行所述输入结果对应的操作。

根据本公开的又一个方面,提供一种电子设备,上述电子设备包括存储器、处理器以及存储在上述存储器中并可在上述处理器上运行的计算机程序,上述处理器执行上述计算机程序时实现如上述实施例中上述的操作界面操作方法。

根据本公开的又一个方面,提供一种计算机可读存储介质,其上存储有计算机程序,上述计算机程序被处理器执行时实现如上述实施例中上述的操作界面操作方法。

本公开的实施例所提供的操作界面操作方法、电子设备及存储介质,具备以下技术效果:

本公开通过采用建立本地浏览器与服务器中远程浏览器之间的通信连接,监听本地浏览器显示的网页图片上的操作事件,网页图片为远程浏览器中呈现的网页界面的图片,在操作事件为触发显示操作界面的事件的情况下,基于通信连接向远程浏览器发送请求指令,以请求用于显示操作界面的显示参数,基于通信连接接收远程浏览器发送的显示参数,并根据显示参数在本地浏览器中显示操作界面,获取操作界面对应的输入结果,并基于通信连接将输入结果发送至远程浏览器,以使远程浏览器执行输入结果对应的操作的技术方案,实现了在本地浏览器侧显示远程浏览器的操作界面,方便用户在本地浏览侧使用远程浏览器的操作界面功能,有利于用户直接与远程浏览器进行交互,提高了用户的使用体验。

应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书一起用于解释本公开的原理。显而易见地,下面描述中的附图仅仅是本公开的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。

图1示出了本公开一示例性实施例中操作界面操作方法的流程示意图;

图2示出了本公开一示例性实施例的本地浏览器与远程浏览器的交互示意图;

图3示出了本公开一示例性实施例的操作界面的示意图;

图4示出了本公开另一示例性实施例中操作界面操作方法的流程示意图;

图5示出了本公开一示例性实施例的操作界面操作装置的结构示意图;

图6示出了本公开另一示例性实施例的操作界面操作装置的结构示意图;

图7示出了本公开一示例性实施例中电子设备的结构示意图。

具体实施方式

为使本公开的目的、技术方案和优点更加清楚,下面将结合附图对本公开实施例方式作进一步地详细描述。

下面的描述涉及附图时,除非另有表示,不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本公开相一致的所有实施方式。相反,它们仅是如所附权利要求书中所详述的、本公开的一些方面相一致的装置和方法的例子。

需要注意的是,上述附图仅是根据本公开示例性实施例的方法所包括的处理的示意性说明,而不是限制目的。易于理解,上述附图所示的处理并不表明或限制这些处理的时间顺序。另外,也易于理解,这些处理可以是例如在多个模块中同步或异步执行的。

以下对本公开提供的操作界面操作方法的实施例。其中,图1示出了本公开一示例性实施例中操作界面操作方法的流程示意图;图2示出了本公开一示例性实施例的本地浏览器与远程浏览器的交互示意图。如图1和图2所示,本公开方法的一实施例提供的操作界面操作方法,应用于终端。终端包括本地浏览器和浏览器扩展,本地浏览器可以理解为搭载或安装在终端中的浏览器,本地浏览器包括浏览器扩展,浏览器扩展可以理解为本地浏览器中的一个功能插件,也可以称为扩展程序。其中,本地浏览器与远程浏览器之间的数据交互,实际是浏览器扩展与远程浏览器进行数据交互,从而实现本地浏览器与远程浏览器的数据交互。终端是指具有操作系统的设备,例如是笔记电脑、平板电脑、手机等。上述操作界面操作方法,包括以下方案:

步骤S110:建立本地浏览器与服务器中远程浏览器之间的通信连接。

在示例性实施例中,事先建立本地浏览器中浏览器扩展与服务器中远程浏览器之间的通信连接,进而基于通信连接,浏览器扩展与远程浏览器可以互相进行通信,实现二者之间的双向数据传输。

步骤S120:监听所述本地浏览器显示的网页图片上的操作事件。

在一些场景下,当用户通过本地浏览器去访问目标网站时,本地浏览器无法直接访问到目标网站,而是需要通过搭载在服务器上的远程浏览器实现目标网站的访问。也就是,远程浏览器将目标网站中用户所需的信息获取到之后,再将获取到的信息的图片发送给本地浏览器进行显示,给用户的感受就是通过本地浏览器访问了目标网站,获取到了自身所需的信息。

对于需要通过远程浏览器获取用户所需信息,且由本地浏览器对获取的用户所需信息进行显示的场景,如果要实现用户在本地浏览器侧对远程浏览器进行直接操作,则需要将远程浏览器包括的操作页面显示在本地浏览器侧,如此可以让用户感受到自身不仅可以直接看到远程浏览器的操作页面,还能够方便与远程浏览器进行直接交互。

在示例性实施例中,用户打开本地浏览器之后,浏览器扩展启用,用户通过本地浏览器访问目标网站之后,由远程浏览器代理本地浏览器去访问目标网站,远程浏览器在自身的显示页面中呈现目标网站对应的网页界面,进而远程浏览器将自身显示页面中呈现的网页界面的图片发送给本地浏览器,本地浏览器在自身的显示页面中显示远程浏览器发送的网页图片,即该网页图片为远程浏览器中呈现的网页界面的图片,且该图片是与目标网站对应的。

本地浏览器在自身的显示页面中显示远程浏览器发送的网页图片之后,本地浏览器通过浏览器扩展实时监听自身显示的网页图片上是否发生了操作事件,或者,本地浏览器实时监听自身显示的网页图片上是否发生了操作事件。其中,操作事件可以理解为一种点击操作事件,点击操作事件可以能是用于进入某个网页里面,也可能是打开浏览器的操作界面,还有可能是其他目的。例如,用户在浏览器的显示页面中点击了“百度-搜狗百科”,从而进入相应的界面。又例如,用户在浏览器的显示页面中通过鼠标进行点击操作,从而打开浏览器的操作界面,也就是响应点击操作事件之后,浏览器的显示页面中显示出操作界面。操作界面包括系统弹窗和/或功能控件,即操作界面可以是系统弹窗,也可以是功能控件。系统弹窗可以参考图3中的图A、图B和图C,图A、图B和图C示出了3种类型的系统弹窗。响应点相应的击操作事件之后,浏览器的显示页面中显示出系统弹窗可能是图A、图B和图C中的一种或者多种。功能控件可以参考图3中的图D,D0表示翻译网页界面内容的翻译控件,D1表示截图控件,D2表示浏览器的菜单控件。当鼠标落在对应的功能控件上之后,该功能控件获得焦点,例如该功能控件所在区域的颜色加深,左键点击该功能控件之后,可以使用该功能控件的功能或进入该功能控件中的选项栏,从而选择所需的操作或者输入需要的内容。例如,当鼠标左键点击D1中的剪刀标识后,可以对网页界面进行截图。

步骤S130:在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

监听到操作事件之后,操作事件可能是触发显示操作界面的事件,也可能不是触发显示操作界面的事件,因此需要比对操作事件与触发显示操作界面的事件是否是相同的,如果二者不相同,则执行操作事件对应实际操作;如果二者相同,则认为操作事件为触发显示操作界面的事件,从而表明需要在本地浏览器显示的网页图片上显示远程浏览器的操作界面,而不是在本地浏览器的显示页面中显示本地浏览器的操作界面。在本地浏览器显示的网页图片上显示远程浏览器的操作界面,需要根据该操作界面的显示参数进行该操作界面的显示,该显示参数至少包括操作界面的框体的尺寸大小信息、显示内容等相关信息。其中,为了提高用户的使用体验,远程浏览器的操作界面与本地浏览器的操作界面十分相似,使得用户在本地浏览器看到操作界面时,实际上看到的是远程浏览器的操作界面,而给用户的感受是,用户看到的就是本地浏览器的操作界面。

进而,在判定操作事件为触发显示操作界面的事件之后,浏览器扩展通过通信连接向远程浏览器发送请求指令,该请求指令用于向远程浏览器请求操作事件对应的操作界面的显示参数,即通过请求指令向远程浏览器请求远程浏览器的显示参数。

步骤S140:基于所述通信连接接收所述远程浏览器发送的所述显示参数,并根据所述显示参数在所述本地浏览器中显示所述操作界面。

在示例性实施例中,远程浏览器接收到浏览器扩展发送请求指令后,将需要在本地浏览器侧显示的操作界面的显示参数发送给浏览器扩展,即远程浏览器通过通信连接将显示参数发送给浏览器扩展。在浏览器扩展接收到远程浏览器发送的显示参数后,读取该显示参数从而生成操作界面,然后在本地浏览器显示的网页图片上显示生成的操作界面,即用户看到的操作界面实际上是远程浏览器的,不是本地浏览器的,给用户的感受是显示的操作界面就是是本地浏览器的,如此可以直接在本地浏览器侧为用户显示远程浏览器的操作界面,方便用户在本地浏览器侧使用远程浏览器的操作界面功能,以及方便用户与远程浏览器进行直接交互。

步骤S150:获取所述操作界面对应的输入结果,并基于所述通信连接将所述输入结果发送至所述远程浏览器,以使所述远程浏览器执行所述输入结果对应的操作。

在本地浏览器显示的网页图片上显示远程浏览器的操作界面之后,用户可以直接操作远程浏览器的操作界面,即用户在操作界面中可以执行自己所需的操作,从而存在在操作界面输入的输入结果。

在示例性实施例中,通过浏览器扩展监听显示的操作界面中是否发生了相应的操作,如果发生了相应的操作,则获取该操作对应的输入结果。参考图3中的图A-C,输入结果包括用户在操作界面中点击的确定/取消、或者在输入框中输入的内容。如图3所示,当输入结果包括确定时,操作界面如图3中的A图所示;当输入结果包括确定/取消时,操作界面如图3中的B图所示;当输入结果包括输入的内容、点击的确定/取消时,操作界面如图3中的C图所示。参考图3中的图D,输入结果包括用户选择的某个功能控件,或者用户点击进入某个功能控件对应的选项栏中后,在选项栏中选择的选项。例如,点击进入D1中剪刀标识右侧的三角符号之后,进入到了截图选项栏,在截图选项栏中点击了区域截图选项(截图选项栏在图中未示出),即输入结果包括在点击的区域截图选项。

在通过浏览器扩展监听并获取到操作界面对应的输入结果的情况下,将输入结果通过通信连接发送给远程浏览器,远程浏览器接收到输入结果之后,远程浏览器在自身呈现的网页界面上执行输入结果对应的操作。例如,显示的操作界面为图3中的B图对应的系统弹窗,且输入结果是点击“确定”,远程浏览器接收到输入结果之后,在自身显示的相同系统弹窗中也执行点击“确定”的操作,实现了用户能够在本地浏览器侧使用远程浏览器的操作界面功能,使得用户直接与远程浏览器进行交互,提升了用户的浏览器使用体验。

本实施例由于采用了建立本地浏览器与服务器中远程浏览器之间的通信连接,监听本地浏览器显示的网页图片上的操作事件,网页图片为远程浏览器中呈现的网页界面的图片,在操作事件为触发显示操作界面的事件的情况下,基于通信连接向远程浏览器发送请求指令,以请求用于显示操作界面的显示参数,基于通信连接接收远程浏览器发送的显示参数,并根据显示参数在本地浏览器中显示操作界面,获取操作界面对应的输入结果,并基于通信连接将输入结果发送至远程浏览器,以使远程浏览器执行输入结果对应的操作的技术方案,实现了在本地浏览器侧显示远程浏览器的操作界面,方便用户在本地浏览侧使用远程浏览器的操作界面功能,有利于用户直接与远程浏览器进行交互,提高了用户的使用体验。

可选的,基于上述方法实施例,步骤S110包括以下方案:

通过Chrome DevTools协议中的WebSocket消息通道,将所述本地浏览器与所述远程浏览器进行连接。

在示例性实施例中,Chrome DevTools协议是指扩展后的协议,通过ChromeDevTools协议中的WebSocket消息通道将本地浏览器中浏览器扩展与远程浏览器进行连接,从而建立了本地浏览器与远程浏览器之间的通信连接,浏览器扩展与远程浏览器通过WebSocket消息通道进行双向的数据传输。其中,WebSocket消息通道能够支持的多标签页管理、操作界面(如右键菜单)、本地文件上传、文件下载、本地输入法等功能对应数据的传输,也即浏览器扩展能够实现的多标签页管理、操作界面(如右键菜单)、本地文件上传、文件下载、本地输入法等功能。

可选的,基于上述方法实施例,所述根据所述显示参数在所述本地浏览器中显示所述操作界面包括以下方案:

获取所述显示参数对应的界面类型;

比对所述显示参数对应的界面类型与所述请求指令对应的界面类型;

在所述显示参数对应的界面类型与所述请求指令对应的界面类型相同的情况下,读取所述显示参数,以在所述本地浏览器中显示所述操作界面。

在示例性实施例中,在浏览器扩展接收到远程浏览器发送的操作界面的显示参数之后,本地浏览器解析该显示参数以获取获取操作界面的界面类型,即显示参数对应的界面类型。由于监听到的操作事件为触发显示操作界面的事件在,则触发显示的操作界面的界面类型是确定的,则向远程浏览器请求的显示参数对应的界面类型就是触发显示的操作界面的界面类型,即触发显示的操作界面的界面类型为触发显示的操作界面的界面类型。进而,将显示参数对应的界面类型与请求指令对应的界面类型进行比对,判断二者是否相同,以使在本地浏览器侧显示的操作界面与远程浏览器侧的操作界面是相同的,即类型相同。如果二者相同,则表示远程浏览器发送的显示参数就是在网页图片上显示操作界面所需的参数,读取该显示参数之后,在本地浏览器显示的网页图片上的显示出操作界面,网页图片上的显示该操作界面与远程浏览器侧的操作界面是相同的类型。图3中图A-C示出了3种类型的操作界面,图A表示Alert对应类型的操作界面、图B表示Confirm对应类型的操作界面、图C表示Prompt对应类型的操作界面。如果请求指令对应的界面类型是Prompt类型,那么远程浏览器发送的也应该是Prompt类型的显示参数,本地浏览器显示的操作界面的界面类型为Prompt类型,即实现本地浏览器侧显示的操作界面与远程浏览器侧显示的操作界面是相同的类型,确保了本地浏览器与远程浏览器对应操作界面的一致性,提高了用户使用浏览器的视觉体验。

可选的,基于上述方法实施例,步骤S120包括以下方案:

获取所述网页图片对应的第一网址信息;

在所述第一网址信息与外网对应的第二网址信息匹配的情况下,监听所述本地浏览器显示的网页图片上的操作事件。

在示例性实施例中,第一网址信息可以理解为用户通过本地浏览器访问的网站的网址,外网可以理解为本国之外其他国家的网络,外网对应的第二网址信息可以理解为其他国家的网站的网址。考虑到,用户通过本地浏览器访问其他国家的网站时存在风险,容易遭到外网的直接攻击。在用户通过本地浏览器访问其他国家的网站时,而通过远程浏览器作为跳板,即通过远程浏览器直接访问外网,当遭到外网的攻击时,直接遭到攻击的是远程浏览器而不是本地浏览器,如此可以保护本地浏览器的安全。因此,当用户在本地浏览器中输入第一网址信息后,获取第一网址信息,并将第一网址信息与外网对应的第二网址信息进行比较,如果第一网址信息属于外网对应的第二网址信息中的一个,则认为第一网址信息与外网对应的第二网址信息匹配,第一网址信息属于外网的第二网址信息。其中,判断第一网址信息是否属于外网对应的第二网址信息可以通过网址的域名进行判断。然后在第一网址信息与外网对应的第二网址信息匹配的情况下,执行通过浏览器扩展监听本地浏览器显示的网页图片上的操作事件,如此可以避免本地浏览器被外网直接攻击,有利于保护本地浏览器的安全。

可选的,基于上述方法实施例,步骤S130包括以下方案:

在所述操作事件为触发显示操作界面的事件的情况下,输出访问所述外网的风险提示信息对应的进入选项和退出选项;

在监听到所述进入选项的点击事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

考虑到在访问外网的情况下,虽然是通过远程浏览器对外网进行访问,但如果远程浏览器的安全保护机制的保护能力不足,一旦被攻破,用户在本地浏览器侧与远程浏览器进行交互时,本地浏览器也有面临风险的可能。因此,在判定操作事件为触发显示操作界面的事件的情况下,在本地浏览器侧输出外网的风险提示信息对应的进入选项和退出选项,即在本地浏览器的显示页面中显示进入选项和退出选项,对用户进行风险提示。

如果用户选择进入选项,则继续向远程浏览器请求操作界面的显示参数,以在本地浏览器中显示远程浏览器的操作界面;如果用户选择了退出选项,则不在本地浏览器的显示页面中显示远程浏览器的操作界面,即用户无法与远程浏览器进行直接交互。在通过浏览器扩展监听到进入选项的点击事件的情况下,即用户选择了进入选项,则继续执行基于通信连接向远程浏览器发送请求指令,以请求用于显示操作界面的显示参数,后续将在本地浏览器显示的网页图片上显示远程浏览器的操作界面,如此可以避免本地浏览器被外网直接攻击,有利于保护本地浏览器的安全。

可选的,基于上述方法实施例,步骤S130包括以下方案:

获取上述终端对应的第一操作系统以及上述服务器对应的第二操作系统,上述第一操作系统与上述第二操作系统不相同;

在上述第一操作系统的业务处理能力低于上述第二操作系统的业务处理能力的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

在示例性实施例中,安装本地浏览器的终端与安装远程浏览的服务器的操作系统可能是不同的,其中,安装本地浏览器的终端的操作系统称为第一操作系统,安装远程浏览的服务器的操作系统称为第二操作系统。如果第一操作系统的业务处理能力高于第二操作系统的业务处理能力,本地浏览器自身就可以处理用户所需的业务,无需再通过远程浏览器处理用户所需的业务之后,将网页图片返回给本地浏览器进行显示。如果第一操作系统的业务处理能力低于第二操作系统的业务处理能力,则需要通过远程浏览器处理用户所需的业务之后,将网页图片返回给本地浏览器进行显示,进而在继续执行基于通信连接向远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。例如,安装本地浏览器的终端的操作系统为Linux系统,安装远程浏览的服务器的操作系统为windows系统,Linux系统的业务处理能力是低于windows系统的,如果用户通过本地浏览器处理所需的业务时,则需要通过远程浏览器处理用户所需的业务之后,将网页图片返回给本地浏览器进行显示,进而执行基于通信连接向远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数,从而使得在本地浏览器侧显示远程浏览器的操作界面,便于用户在本地浏览器侧使用远程浏览器的操作界面功能。

图4示出了本公开另一示例性实施例中操作界面操作方法的流程示意图;如图2和图4所示,本公开方法的另一实施例提供的操作界面操作方法,应用于服务器,服务器中搭载有远程浏览器,远程浏览器可以代理终端上的本地浏览器完成相应的业务(例如网站访问业务)。上述操作界面操作方法,包括以下方案:

步骤S210:建立远程浏览器与终端上搭载的本地浏览器之间的通信连接。

在示例性实施例中,事先建立远程浏览器与终端上搭载的本地浏览器中浏览器扩展之间的通信连接,进而基于通信连接,远程浏览器与浏览器扩展可以互相进行通信,实现二者之间的双向数据传输。

步骤S220:基于所述通信连接接收所述本地浏览器发送的请求指令,并根据所述请求指令获取用于显示操作界面的显示参数。

在一些场景下,当用户通过本地浏览器去访问目标网站时,本地浏览器无法直接访问到目标网站,而是需要通过搭载在服务器上的远程浏览器实现目标网站的访问。也就是,远程浏览器将目标网站中用户所需的信息获取到之后,再将获取到的信息的图片发送给本地浏览器进行显示,给用户的感受就是通过本地浏览器访问了目标网站,获取到了自身所需的信息。

在示例性实施例中,本地浏览器在自身的显示页面中显示远程浏览器发送的网页图片之后,通过浏览器扩展监听到网页图片上发生了操作事件,如果监听到了操作事件,则判定操作事件是否为触发显示操作界面的事件,如果判定操作事件为触发显示操作界面的事件,则浏览器扩展通过通信连接将用于请求操作界面的显示参数的请求指令发送给远程浏览器,远程浏览器通过通信连接接收浏览器扩展发送的请求指令,并根据该请求指令获取该操作界面的显示参数。其中,显示参数至少包括操作界面的框体的尺寸大小信息、显示内容等相关信息,通过该显示参数可以绘制渲染出远程浏览器的操作界面。

步骤S230:基于所述通信连接将所述显示参数发送至所述本地浏览器,以使所述本地浏览器显示所述显示参数对应的操作界面。

在示例性实施例中,远程浏览器获取到操作界面的显示参数之后,将该显示参数通过通信连接发送给浏览器扩展。浏览器扩展接收到远程浏览器发送的显示参数后,读取该显示参数从而生成操作界面,然后在本地浏览器显示的网页图片上显示生成的操作界面,即用户看到的操作界面实际上是远程浏览器的,不是本地浏览器的,给用户的感受是显示的操作界面就是是本地浏览器的,如此可以直接在本地浏览器侧为用户显示远程浏览器的操作界面,方便用户在本地浏览器侧使用远程浏览器的操作界面功能,以及方便用户与远程浏览器进行直接交互。

步骤S240:基于所述通信连接接收所述本地浏览器发送的输入结果,并在所述远程浏览器中执行所述输入结果对应的操作。

在示例性实施例中,在本地浏览器显示的网页图片上显示远程浏览器的操作界面之后,用户可以直接操作远程浏览器的操作界面。过浏览器扩展监听显示的操作界面中是否发生了相应的操作,如果发生了相应的操作,则获取该操作对应的输入结果,并将输入结果通过通信连接发送给远程浏览器,远程浏览器通过通信连接接收浏览器扩展发送的输入结果之后,在自身呈现的网页界面上执行输入结果对应的操作。例如,例如,显示的操作界面为图3中的B图对应的系统弹窗,且输入结果是点击“取消”,远程浏览器接收到输入结果之后,在自身显示的相同系统弹窗中也执行点击“取消”的操作,实现了用户能够在本地浏览器侧使用远程浏览器的操作界面功能,使得用户直接与远程浏览器进行交互,提升了用户的浏览器使用体验。

可选的,基于上述方法实施例,步骤S210包括以下方案:

通过Chrome DevTools协议中的WebSocket消息通道,将上述远程浏览器与上述本地浏览器进行连接。

Chrome DevTools协议是指扩展后的协议,通过Chrome DevTools协议中的WebSocket消息通道将远程浏览器与本地浏览器中浏览器扩展进行连接,从而建立了远程浏览器与本地浏览器之间的通信连接,远程浏览器与浏览器扩展通过WebSocket消息通道进行双向的数据传输。其中,WebSocket消息通道能够支持的多标签页管理、功能窗口(如右键菜单)、本地文件上传、文件下载、本地输入法等功能对应数据的传输,也即浏览器扩展能够实现的多标签页管理、功能窗口(如右键菜单)、本地文件上传、文件下载、本地输入法等功能。

可选的,基于上述方法实施例,所述根据所述请求指令获取用于显示操作界面的显示参数包括以下方案:

根据所述请求指令确定所述操作界面的界面类型;

获取所述界面类型对应的显示参数。

在示例性实施例中,由于监听到的操作事件为触发显示操作界面的事件在,则触发显示的操作界面的界面类型是确定的,将需要显示的操作界面的界面类型携带在请求指令中,以向远程浏览器请求相同类型的操作界面的显示参数。远程浏览器接收到浏览器扩展发送的请求指令之后,解析请求指令,得到界面类型,然后获取该界面类型对应的显示参数。进而,远程浏览器将获取的显示参数发送给浏览器扩展,在浏览器扩展接收到远程浏览器发送的操作界面的显示参数之后,将显示参数对应的界面类型与请求指令对应的界面类型进行比对,如果二者相同,则表示远程浏览器发送的显示参数就是在网页图片上显示操作界面所需的参数。浏览器扩展读取该显示参数之后,在本地浏览器显示的网页图片上的显示出操作界面,实现本地浏览器侧显示的操作界面与远程浏览器侧显示的操作界面是相同的类型,确保了本地浏览器与远程浏览器对应操作界面的一致性,提高了用户使用浏览器的视觉体验。

下述为本公开装置实施例,可以用于执行本公开方法实施例。对于本公开装置实施例中未披露的细节,请参照本公开方法实施例。

一实施例中,图5示出了可以应用本公开一实施例的操作界面操作装置的结构示意图。请参见图5,该图所示的操作界面操作装置可以通过软件、硬件或者两者的结合实现成为终端的全部或一部分,还可以作为独立的模块集成于终端中或服务器上。

本公开实施例中的操作界面操作装置500,所述操作界面操作装置500配置于终端,所述终端上搭载有本地浏览器,所述操作界面操作装置500包括:

第一通信模块510,用于建立本地浏览器与服务器中远程浏览器之间的通信连接;

事件监听模块520,用于监听所述本地浏览器显示的网页图片上的操作事件,所述网页图片为所述远程浏览器中呈现的网页界面的图片;

指令发送模块530,用于在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数;

界面显示模块540,用于基于所述通信连接接收所述远程浏览器发送的所述显示参数,并根据所述显示参数在所述本地浏览器中显示所述操作界面;

结果发送模块550,用于获取所述操作界面对应的输入结果,并基于所述通信连接将所述输入结果发送至所述远程浏览器,以使所述远程浏览器执行所述输入结果对应的操作。

在示例性的实施例中,基于前述方案,所述第一通信模块510在建立本地浏览器与服务器中远程浏览器之间的通信连接方面,具体用于通过Chrome DevTools协议中的WebSocket消息通道,将所述本地浏览器与所述远程浏览器进行连接。

在示例性的实施例中,基于前述方案,所述界面显示模块540在根据所述显示参数在所述本地浏览器中显示所述操作界面方面,具体包括:

类型获取单元,用于获取所述显示参数对应的界面类型;

类型比对单元,用于比对所述显示参数对应的界面类型与所述请求指令对应的界面类型;

界面显示单元,用于在所述显示参数对应的界面类型与所述请求指令对应的界面类型相同的情况下,读取所述显示参数,以在所述本地浏览器中显示所述操作界面。

在示例性的实施例中,基于前述方案,所述操作界面包括系统弹窗和/或功能控件。

在示例性的实施例中,基于前述方案,所述事件监听模块520,包括:

网址获取单元,用于获取所述网页图片对应的第一网址信息;

网址比对单元,用于在所述第一网址信息与外网对应的第二网址信息匹配的情况下,监听所述本地浏览器显示的网页图片上的操作事件。

在示例性的实施例中,基于前述方案,所述指令发送模块530,包括:

风险提示单元,用于在所述操作事件为触发显示操作界面的事件的情况下,输出访问所述外网的风险提示信息对应的进入选项和退出选项;

指令发送单元,用于在监听到所述进入选项的点击事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

另一实施例中,图6示出了可以应用本公开另一实施例的操作界面操作装置的结构示意图。请参见图6,该图所示的操作界面操作装置可以通过软件、硬件或者两者的结合实现成为终端的全部或一部分,还可以作为独立的模块集成于终端中或服务器上。

本公开实施例中的操作界面操作装置600,所述操作界面操作装置600配置于服务器,所述服务器中搭载有远程浏览器,所述操作界面操作装置600包括:

第二通信模块610,用于建立远程浏览器与终端上搭载的本地浏览器之间的通信连接;

指令接收模块620,用于基于所述通信连接接收所述本地浏览器发送的请求指令,并根据所述请求指令获取用于显示操作界面的显示参数;

参数发送模块630,用于基于所述通信连接将所述显示参数发送至所述本地浏览器,以使所述本地浏览器显示所述显示参数对应的操作界面;

结果接收模块640,用于基于所述通信连接接收所述本地浏览器发送的输入结果,并在所述远程浏览器中执行所述输入结果对应的操作。

在示例性的实施例中,基于前述方案,所述第二通信模块610在建立远程浏览器与终端上搭载的本地浏览器之间的通信连接方面,具体用于通过Chrome DevTools协议中的WebSocket消息通道,将所述远程浏览器与所述本地浏览器进行连接。

在示例性的实施例中,基于前述方案,所述指令接收模块620在根据所述请求指令获取用于显示操作界面的显示参数方面,包括:

类型确定单元,用于根据所述请求指令确定所述操作界面的界面类型;

参数获取单元,用于获取所述界面类型对应的显示参数。

需要说明的是,上述实施例提供的操作界面操作装置在执行操作界面操作方法时,仅以上述各功能模块的划分进行举例说明,实际应用中,可以根据需要而将上述功能分配由不同的功能模块完成,即将设备的内部结构划分成不同的功能模块,以完成以上描述的全部或者部分功能。另外,上述实施例提供的操作界面操作装置与操作界面操作方法实施例属于同一构思,因此对于本公开装置实施例中未披露的细节,请参照本公开上述的操作界面操作方法的实施例,这里不再赘述。

上述本公开实施例序号仅仅为了描述,不代表实施例的优劣。

本公开实施例还提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现前述任一实施例方法的步骤。其中,计算机可读存储介质可以包括但不限于任何类型的盘,包括软盘、光盘、DVD、CD-ROM、微型驱动器以及磁光盘、ROM、RAM、EPROM、EEPROM、DRAM、VRAM、闪速存储器设备、磁卡或光卡、纳米系统(包括分子存储器IC),或适合于存储指令和/或数据的任何类型的媒介或设备。

本公开实施例还提供了一种电子设备,上述电子设备包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,处理器执行程序时实现上述任一实施例方法的步骤。

图7示意性示出了电子设备的结构示意图。请参见图7所示,电子设备700包括有:处理器701和存储器702。

本公开实施例中,处理器701为计算机系统的控制中心,可以是实体机的处理器,也可以是虚拟机的处理器。处理器701可以包括一个或多个处理核心,比如4核心处理器、8核心处理器等。处理器701可以采用DSP(Digital Signal Processing,数字信号处理)、FPGA(Field-Programmable Gate Array,现场可编程门阵列)、PLA(Programmable LogicArray,可编程逻辑阵列)中的至少一种硬件形式来实现。处理器……01也可以包括主处理器和协处理器,主处理器是用于对在唤醒状态下的数据进行处理的处理器,也称CPU(Central Processing Unit,中央处理器);协处理器是用于对在待机状态下的数据进行处理的低功耗处理器。

在本公开实施例中,上述处理器701具体用于:建立本地浏览器与服务器中远程浏览器之间的通信连接;监听所述本地浏览器显示的网页图片上的操作事件,所述网页图片为所述远程浏览器中呈现的网页界面的图片;在所述操作事件为触发显示操作界面的事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数;基于所述通信连接接收所述远程浏览器发送的所述显示参数,并根据所述显示参数在所述本地浏览器中显示所述操作界面;获取所述操作界面对应的输入结果,并基于所述通信连接将所述输入结果发送至所述远程浏览器,以使所述远程浏览器执行所述输入结果对应的操作。

进一步地,上述处理器701还用于:通过Chrome DevTools协议中的WebSocket消息通道,将所述本地浏览器与所述远程浏览器进行连接。

进一步地,上述处理器701还用于:获取所述显示参数对应的界面类型;比对所述显示参数对应的界面类型与所述请求指令对应的界面类型;在所述显示参数对应的界面类型与所述请求指令对应的界面类型相同的情况下,读取所述显示参数,以在所述本地浏览器中显示所述操作界面。

进一步地,上述处理器701还用于:获取所述网页图片对应的第一网址信息;在所述第一网址信息与外网对应的第二网址信息匹配的情况下,监听所述本地浏览器显示的网页图片上的操作事件。

进一步地,上述处理器701还用于:在所述操作事件为触发显示操作界面的事件的情况下,输出访问所述外网的风险提示信息对应的进入选项和退出选项;在监听到所述进入选项的点击事件的情况下,基于所述通信连接向所述远程浏览器发送请求指令,以请求用于显示所述操作界面的显示参数。

在本公开实施例中,上述处理器701具体还用于:建立远程浏览器与终端上搭载的本地浏览器之间的通信连接;基于所述通信连接接收所述本地浏览器发送的请求指令,并根据所述请求指令获取用于显示操作界面的显示参数;基于所述通信连接将所述显示参数发送至所述本地浏览器,以使所述本地浏览器显示所述显示参数对应的操作界面;基于所述通信连接接收所述本地浏览器发送的输入结果,并在所述远程浏览器中执行所述输入结果对应的操作。

进一步地,上述处理器701还用于:通过Chrome DevTools协议中的WebSocket消息通道,将所述远程浏览器与所述本地浏览器进行连接。

进一步地,上述处理器701还用于:根据所述请求指令确定所述操作界面的界面类型;获取所述界面类型对应的显示参数。

存储器702可以包括一个或多个计算机可读存储介质,该计算机可读存储介质可以是非暂态的。存储器702还可包括高速随机存取存储器,以及非易失性存储器,比如一个或多个磁盘存储设备、闪存存储设备。在本公开的一些实施例中,存储器702中的非暂态的计算机可读存储介质用于存储至少一个指令,该至少一个指令用于被处理器701所执行以实现本公开实施例中的方法。

一些实施例中,电子设备700还包括有:外围设备接口703和至少一个外围设备。处理器701、存储器702和外围设备接口703之间可以通过总线或信号线相连。各个外围设备可以通过总线、信号线或电路板与外围设备接口703相连。具体地,外围设备包括:显示屏704、摄像头705和音频电路706中的至少一种。

外围设备接口703可被用于将I/O(Input/Output,输入/输出)相关的至少一个外围设备连接到处理器701和存储器702。在本公开的一些实施例中,处理器701、存储器702和外围设备接口703被集成在同一芯片或电路板上;在本公开的一些其他实施例中,处理器701、存储器702和外围设备接口703中的任意一个或两个可以在单独的芯片或电路板上实现。本公开实施例对此不作具体限定。

显示屏704用于显示UI(User Interface,用户界面)。该UI可以包括图形、文本、图标、视频及其它们的任意组合。当显示屏704是触摸显示屏时,显示屏704还具有采集在显示屏704的表面或表面上方的触摸信号的能力。该触摸信号可以作为控制信号输入至处理器701进行处理。此时,显示屏704还可以用于提供虚拟按钮和/或虚拟键盘,也称软按钮和/或软键盘。在本公开的一些实施例中,显示屏704可以为一个,设置电子设备700的前面板;在本公开的另一些实施例中,显示屏704可以为至少两个,分别设置在电子设备700的不同表面或呈折叠设计;在本公开的再一些实施例中,显示屏704可以是柔性显示屏,设置在电子设备700的弯曲表面上或折叠面上。甚至,显示屏704还可以设置成非矩形的不规则图形,也即异形屏。显示屏704可以采用LCD(Liquid Crystal Display,液晶显示屏)、OLED(OrganicLight-Emitting Diode,有机发光二极管)等材质制备。

摄像头705用于采集图像或视频。可选地,摄像头705包括前置摄像头和后置摄像头。通常,前置摄像头设置在电子设备700的前面板,后置摄像头设置在电子设备700的背面。在一些实施例中,后置摄像头为至少两个,分别为主摄像头、景深摄像头、广角摄像头、长焦摄像头中的任意一种,以实现主摄像头和景深摄像头融合实现背景虚化功能、主摄像头和广角摄像头融合实现全景拍摄以及VR(Virtual Reality,虚拟现实)拍摄功能或者其它融合拍摄功能。在本公开的一些实施例中,摄像头705还可以包括闪光灯。闪光灯可以是单色温闪光灯,也可以是双色温闪光灯。双色温闪光灯是指暖光闪光灯和冷光闪光灯的组合,可以用于不同色温下的光线补偿。

音频电路706可以包括麦克风和扬声器。麦克风用于采集用户及环境的声波,并将声波转换为电信号输入至处理器701进行处理。出于立体声采集或降噪的目的,麦克风可以为多个,分别设置在电子设备700的不同部位。麦克风还可以是阵列麦克风或全向采集型麦克风。

电源707用于为电子设备700中的各个组件进行供电。电源707可以是交流电、直流电、一次性电池或可充电电池。当电源707包括可充电电池时,该可充电电池可以是有线充电电池或无线充电电池。有线充电电池是通过有线线路充电的电池,无线充电电池是通过无线线圈充电的电池。该可充电电池还可以用于支持快充技术。

本公开实施例中示出的电子设备700结构框图并不构成对电子设备700的限定,电子设备700可以包括比图示更多或更少的组件,或者组合某些组件,或者采用不同的组件布置。

在本公开的描述中,需要理解的是,术语“第一”、“第二”等仅用于描述目的,而不能理解为指示或暗示相对重要性。对于本领域的普通技术人员而言,可以具体情况理解上述术语在本公开中的具体含义。此外,在本公开的描述中,除非另有说明,“多个”是指两个或两个以上。“和/或”,描述关联对象的关联关系,表示可以存在三种关系,例如,A和/或B,可以表示:单独存在A,同时存在A和B,单独存在B这三种情况。字符“/”一般表示前后关联对象是一种“或”的关系。

以上上述,仅为本公开的具体实施方式,但本公开的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本公开揭露的技术范围内,可轻易想到变化或替换,都应涵盖在本公开的保护范围之内。因此,依本公开权利要求所作的等同变化,仍属本公开所涵盖的范围。

技术分类

06120116551045