页面交互方法、装置、计算机可读介质及电子设备制造方法及图纸

技术编号:24456974 阅读:18 留言:0更新日期:2020-06-10 15:50
本公开提供一种页面交互方法、页面交互装置、计算机可读介质及电子设备;涉及计算机应用技术领域。该页面交互方法包括:响应第三方页面的嵌入请求,通过沙箱机制确定对于所述第三方页面的目标页面;通过所述嵌入请求获取所述第三方页面的页面元素信息,并将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息;基于所述页面元素信息确定所述目标页面的交互效果,以完成所述第三方页面的嵌入。本公开中的页面交互方法能够在一定程度上克服第三方页面嵌入造成用户体验不好的问题,进而提升页面的交互效果。

Page interaction methods, devices, computer-readable media and electronic equipment

【技术实现步骤摘要】
页面交互方法、装置、计算机可读介质及电子设备
本公开涉及前端
,具体而言,涉及一种页面交互方法、页面交互装置、计算机可读介质及电子设备。
技术介绍
为了提高平台功能的丰富性,满足用户的需求,大部分的平台都需要接入第三方平台,例如,在电子商务平台中接入一商品页面、在社交媒体平台接入一第三方系统页面等。目前平台接入第三方主要是通过将第三方页面的相关代码以及事件绑定至父页面,在父页面显示该第三方页面的信息,但是直接将代码绑定至父页面会对父页面造成污染,存在安全隐患。为了不对父页面造成污染可以通过iframe嵌入的方法在父页面嵌入第三方页面,但是嵌入的第三方页面中的所有交互效果只能显示在该iframe页面区域,如果超出该区域则无法显示,影响用户体验。需要说明的是,在上述
技术介绍
部分公开的信息仅用于加强对本公开的背景的理解,因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。
技术实现思路
本公开的目的在于提供一种页面交互方法、页面交互装置、计算机可读介质及电子设备,能够在一定程度上克服第三方页面嵌入时造成的用户交互体验差的问题,进而提升交互体验。本公开的其他特性和优点将通过下面的详细描述变得显然,或部分地通过本公开的实践而习得。根据本公开的第一方面,提供一种页面交互方法,包括:响应第三方页面的嵌入请求,通过沙箱机制确定对于所述第三方页面的目标页面;通过所述嵌入请求获取所述第三方页面的页面元素信息,并将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息;基于所述页面元素信息确定所述目标页面的交互效果,以完成所述第三方页面的嵌入。在本公开的一种示例性实施例中,所述通过所述嵌入请求获取所述第三方页面的页面元素信息,包括:通过所述嵌入请求获取所述第三方页面发送的字符串信息;对所述字符串信息进行格式转换,以获得所述页面元素信息。在本公开的一种示例性实施例中,所述对所述字符串信息进行格式转换,以获得所述页面元素信息,包括:检测所述字符串信息中包含的目标字符串;将所述目标字符串转换成可执行脚本,以获取所述页面元素信息。在本公开的一种示例性实施例中,所述将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息,包括:根据所述页面元素信息确定所述第三方页面的显示样式;将所述显示样式与所述目标页面进行关联,以按照所述显示样式显示所述目标页面。在本公开的一种示例性实施例中,所述基于所述目标页面中的所述页面元素信息,确定所述目标页面的交互效果,包括:基于所述页面元素信息确定用户操作指令;通过所述第三方页面响应所述用户操作指令,以控制所述目标页面的交互效果。在本公开的一种示例性实施例中,所述基于所述目标页面中的所述页面元素信息,确定所述目标页面的交互效果,包括:根据所述页面元素信息确定所述目标页面中的待显示元素,以及事件信息;通过所述待显示元素以及所述事件信息确定所述目标页面的交互效果。在本公开的一种示例性实施例中,所述待显示元素包括弹窗,所述基于所述目标页面中的所述页面元素信息,确定所述目标页面的交互效果,包括:根据所述事件信息在所述目标页面中显示所述弹窗;响应用户对于所述弹窗的移动操作,在所述目标页面中移动所述弹窗。根据本公开的第二方面,提供一种页面交互装置,请求响应模块、页面确定模块以及交互模块,其中:请求响应模块,用于响应第三方页面的嵌入请求,通过沙箱机制确定对于所述第三方页面的目标页面;页面确定模块,用于通过所述嵌入请求获取所述第三方页面的页面元素信息,并将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息;交互模块,用于基于所述页面元素信息确定所述目标页面的交互效果,以完成所述第三方页面的嵌入。在本公开的一种示例性实施例中,页面确定模块可以包括信息获取单元以及信息转换单元,其中:信息获取单元,用于通过所述嵌入请求获取所述第三方页面发送的字符串信息。信息转换单元,用于对所述字符串信息进行格式转换,以获得所述页面元素信息。在本公开的一种示例性实施例中,信息转换单元可以包括字符串检测单元以及脚本转换单元,其中:字符串检测单元,用于检测所述字符串信息中包含的目标字符串。脚本转换单元,用于将所述目标字符串转换成可执行脚本,以获取所述页面元素信息。在本公开的一种示例性实施例中,页面确定模块可以包括显示样式确定单元以及页面显示单元,其中:显示样式确定单元,用于根据所述页面元素信息确定所述第三方页面的显示样式。页面显示单元,用于将所述显示样式与所述目标页面进行关联,以按照所述显示样式显示所述目标页面。在本公开的一种示例性实施例中,交互模块可以包括指令确定单元以及交互控制单元,其中:指令确定单元,用于基于所述页面元素信息确定用户操作指令。交互控制单元,用于通过所述第三方页面响应所述用户操作指令,以控制所述目标页面的交互效果。在本公开的一种示例性实施例中,交互模块可以包括事件确定单元以及交互效果确定单元,其中:事件确定单元,用于根据所述页面元素信息确定所述目标页面中的待显示元素,以及事件信息。交互效果确定单元,用于通过所述待显示元素以及所述事件信息确定所述目标页面的交互效果。在本公开的一种示例性实施例中,交互模块可以包括弹窗显示单元以及弹窗控制单元,其中:弹窗显示单元,用于根据所述事件信息在所述目标页面中显示所述弹窗。弹窗控制单元,用于响应用户对于所述弹窗的移动操作,在所述目标页面中移动所述弹窗。根据本公开的第三方面,提供一种电子设备,包括:处理器;以及存储器,用于存储所述处理器的可执行指令;其中,所述处理器配置为经由执行所述可执行指令来执行上述任意一项所述的方法。根据本公开的第四方面,提供一种计算机可读介质,其上存储有计算机程序,所述计算机程序被处理器执行时实现上述任意一项所述的方法。本公开示例性实施例可以具有以下部分或全部有益效果:在本公开的一示例实施方式所提供的页面交互方法中,通过沙箱机制确定目标页面,然后通过目标页面接收第三方页面的页面元素信息,目标页面能够对第三方页面的信息进行隔离,可以避免第三方页面对系统的代码造成污染,能够提高系统的安全性;并且,第三方页面的页面元素信息通过目标页面进行显示,在实现第三方页面的显示的同时,能够避免页面元素信息受到第三方的限制,提高页面交互的灵活性;此外,第三方的页面元素能够在目标页面的各个区域产生交互效果,从而可以提高用户体验。应当理解的是,以上的一般描述和后文的细节描述仅是示例性和解释性的,并不能限制本公开。附图说明此处的附图被并入说明书中并构成本说明书的一部分,示出了符合本公开的实施例,并与说明书本文档来自技高网...

【技术保护点】
1.一种页面交互方法,其特征在于,包括:/n响应第三方页面的嵌入请求,通过沙箱机制确定对于所述第三方页面的目标页面;/n通过所述嵌入请求获取所述第三方页面的页面元素信息,并将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息;/n基于所述页面元素信息确定所述目标页面的交互效果,以完成所述第三方页面的嵌入。/n

【技术特征摘要】
1.一种页面交互方法,其特征在于,包括:
响应第三方页面的嵌入请求,通过沙箱机制确定对于所述第三方页面的目标页面;
通过所述嵌入请求获取所述第三方页面的页面元素信息,并将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息;
基于所述页面元素信息确定所述目标页面的交互效果,以完成所述第三方页面的嵌入。


2.根据权利要求1所述的方法,其特征在于,所述通过所述嵌入请求获取所述第三方页面的页面元素信息,包括:
通过所述嵌入请求获取所述第三方页面发送的字符串信息;
对所述字符串信息进行格式转换,以获得所述页面元素信息。


3.根据权利要求2所述的方法,其特征在于,所述对所述字符串信息进行格式转换,以获得所述页面元素信息,包括:
检测所述字符串信息中包含的目标字符串;
将所述目标字符串转换成可执行脚本,以获取所述页面元素信息。


4.根据权利要求1所述的方法,其特征在于,所述将所述页面元素信息与所述目标页面进行关联,以在所述目标页面中显示所述页面元素信息,包括:
根据所述页面元素信息确定所述第三方页面的显示样式;
将所述显示样式与所述目标页面进行关联,以按照所述显示样式显示所述目标页面。


5.根据权利要求1所述的方法,其特征在于,所述基于所述目标页面中的所述页面元素信息,确定所述目标页面的交互效果,包括:
基于所述页面元素信息确定用户操作指令;
通过所述第三方页面响应所述用户操作指令,以控制所述...

【专利技术属性】
技术研发人员:汤振兴
申请(专利权)人:网易杭州网络有限公司
类型:发明
国别省市:浙江;33

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1