CN106339163B - 一种App内置浏览器与内嵌网页回退交互的方法 - Google Patents
一种App内置浏览器与内嵌网页回退交互的方法 Download PDFInfo
- Publication number
- CN106339163B CN106339163B CN201610786587.2A CN201610786587A CN106339163B CN 106339163 B CN106339163 B CN 106339163B CN 201610786587 A CN201610786587 A CN 201610786587A CN 106339163 B CN106339163 B CN 106339163B
- Authority
- CN
- China
- Prior art keywords
- address
- page
- rollback
- webpage
- embedded webpage
- 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.)
- Active
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
- G06F3/04847—Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
- G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
- G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
- G06F3/0481—Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Human Computer Interaction (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本发明提供了一种App内置浏览器与内嵌网页回退交互的方法,S101、登陆手机App,访问内嵌网页;S102、用户在App内打开内嵌网页T,其中T页面为初始页面,即入口页面,url地址存储在sessionStorage中;S103、用户访问第一内嵌网页,将该页面url和参数记录在sessionStorage中;S104、用户访问第二内嵌网页,将该页面url和参数记录在sessionStorage中,S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作。
Description
技术领域
本发明涉及信息技术领域,特别涉及一种App内置浏览器与内嵌网页回退交互的方法。
背景技术
随着html5技术的不断发展以及移动端浏览器对html5的支持越来越完善,html5在移动的使用越来越广泛。同时html5的跨平台优势,一套html5代码可以兼容android、ios等主流系统,于是就产生了手机app的webview加载html5网页的混合开发模式(即HybirdApp)。它介于原生应用和网页应用之间,兼具NativeApp的良好用户体验的优势和WebApp跨平台开发的优势。现有技术中,手机App内嵌网页的功能跳转后的回退机制比较混乱,回退跳转加载网页速度慢、浪费用户流量,回退操作不能跟手机物理返回键绑定。
发明内容
针对现有技术的上述缺陷,本发明提供了一种App内置浏览器与内嵌网页回退交互的方法,包括:
S101、登陆手机App,访问内嵌网页;
S102、用户在App内打开内嵌网页T,其中T页面为初始页面,即入口页面,url地址存储在sessionStorage中;
S103、用户访问第一内嵌网页,将该页面url和参数记录在sessionStorage中;
S104、用户访问第二内嵌网页,将该页面url和参数记录在sessionStorage中,
S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作。
优选地,当每访问一个页面时,都会将该页面url和参数记录在sessionStorage中。
优选地,所述S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作进一步包括:
S201、用户在某个页面触发物理回退键或者导航的回退键;
S202、判断该页面地址是否与T页面地址一致,如果一致,则前往S203;
S203、判断为入口页面,执行跳出手机端内嵌浏览器并清空sessionStorage,返回至App原生界面,回退结束。
优选地,如果S202中判断该页面地址与T页面地址不一致,则去往步骤S204;
S204、判断该页面地址是否有配置的回退父级页面;如果有配置,则去往S205;
S205、根据访问历史和配置文件进行回退地址的计算;
S206、消除历史记录中区段间的访问记录,去往S207;
S207、回退到所配置的页面。
优选地,步骤S204中判断该页面地址没有配置的回退父级页面,则去往S207;
根据本发明的一个具体实施方式,根据具体业务的需要,某个功能页面的父级页面可以多个,通过配置文件的方式设置,在不同的应用场景下自动选择回退到特定父级页面;
S208、直接触发浏览器的返回,使用缓存打开页面;
S209、回退上一页面。
根据本发明的一个具体实施方式,根据具体业务的需要,同一功能页面设置多个父级页面,通过配置文件的方式设置,在不同的应用场景下自动选择回退到特定父级页面。配置各个网页功能块的返回路径,本地存储访问的历史路径,达到从那来回那去;回退使用页面缓存,访问速度快,节省网络流量;同时,通过智能算法计算每次回退的地址,通过跟手机原生客户端定义的JS接口,回退操作绑定手机的返回键盘,让用户感受到所有的操作跟原生开发的App效果一模一样,极大的提升了用户的体验。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明中记载的一些实施例,对于本领域普通技术人员来讲,还可以根据这些附图获得其他的附图。
图1是本发明实施例提供的与手机客户端交互接口以及网页内部处理跳转的方法流程图;
图2是本发明实施例提供的内嵌网页回退交互方法。
具体实施方式
为了使本技术领域的人员更好地理解本发明实施例的方案,下面结合附图和实施方式对本发明实施例作进一步的详细说明。
缩略语和关键术语定义
App(Application,应用程序):安装在手机上的软件。
Html5:是对HTML(Hyper Text Markup Language,即超文本标记语言)标准的第五次修订。其主要的目标是将互联网语义化,以便更好地被人类和机器阅读,并同时提供更好地支持各种媒体的嵌入。
Webview(网络视图):能加载显示网页,可以将其视为一个浏览器。使用智能手机中内置的高性能的webkit内核浏览器显示网页,在SDK中封装为一个叫做WebView组件。
SessionStorage:html5中的存储方式。用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
根据本发明的一个具体实施方式,一种App内置浏览器与内嵌网页回退交互的方法,当用户使用手机App使用内置浏览器访问内嵌网页时,记录用户浏览记录,并储存于sessionStorage中,当用户需要执行回退操作,即触发手机物理返回键或App返回导航时,依赖于手机App与网页端约定的交互接口,使其保持一致的行为,根据用户访问历史记录以及网页页面间父级子级关系计算出应该返回的场景,即回退至某一指定页面或者关闭内置浏览器,使内嵌网页表现出与App同样的场景切换效果且实现了将网页内部场景切换的控制权全部放置在网页端。
如图1所示,本发明的一个具体实施方式提供了一种与手机客户端交互接口以及网页内部处理跳转的方法,具体流程如下:
S101、登陆手机App,访问内嵌网页;
S102、用户在App内打开内嵌网页T,其中T页面为初始页面,即入口页面,url地址存储在sessionStorage中;
S103、用户访问第一内嵌网页,将该页面url和参数记录在sessionStorage中;
S104、用户访问第二内嵌网页,将该页面url和参数记录在sessionStorage中,
S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作。
其中的第一内嵌网页,第二内嵌网页以及第三内嵌网页仅是示例说明,在具体实施过程中不限制内嵌网页的个数。
根据本发明的一个具体实施方式,
S101’、用户登陆手机App,访问内嵌网页;
S102’、用户在App内打开内嵌网页T,其中T页面为初始页面,即入口页面,url地址存储在sessionStorage中;
S103’、用户访问内嵌网页a,当每访问一个页面时,都会将该页面url和参数记录在sessionStorage中;
S104’、用户访问内嵌网页b;
S105’、用户访问内嵌网页c,浏览后触发回退功能,执行回退操作。
如图2所示,根据本发明的一个具体实施方式,当用户访问任何内嵌网页功能时,需要退出网页功能,都按照如下步骤执行。
S201、用户在某个页面触发物理回退键或者导航的回退键;
S202、判断该页面地址是否与T页面地址一致,如果一致,则前往S203,如果不一致,则去往步骤S204;
S203、判断为入口页面,执行跳出手机端内嵌浏览器并清空sessionStorage,返回至App原生界面,所有回退结束;
S204、判断该页面地址是否有配置的回退父级页面;如果有配置,则去往S205;如果未配置,则去往S207;
根据本发明的一个具体实施方式,根据具体业务的需要,某个功能页面的父级页面可以多个,通过配置文件的方式设置,在不同的应用场景下自动选择回退到特定父级页面;
S205、根据访问历史和配置文件进行回退地址的计算;
S206、消除历史记录中区段间的访问记录,去往S207;
S207、回退到所配置的页面;
S208、直接触发浏览器的返回,使用缓存打开页面;
S209、回退上一页面。
根据本发明的一个具体实施方式,
S201’、用户在浏览c页面时触发物理回退键或者导航的回退键;
S202’、判断该页面地址是否与T页面地址一致;
S203’、如果一致,判断为入口页面,执行跳出手机端内嵌浏览器并清空sessionStorage,返回至App原生界面,所有回退结束;如果不一致,则去往步骤S204’;
S204’、判断c页面地址是否有配置的回退父级页面;如果有配置,则去往S205’;如果未配置,则去往S207’;
根据本发明的一个具体实施方式,当前该配置中c页面的父级页面为a页面;
S205’、根据访问历史和配置文件进行回退地址的计算,计算得到当前回退页面;
优选地,S205’还可以读取本地存储的地址库及当前地址的配置信息,在地址库中查找是否有这个地址,如果有,回退到配置地址,清除该地址后面所有的地址信息,得到最新的地址库并更新地址库,如果没有查找到,直接跳转到配置地址,同时记录到地址库中,更新地址库。
优选地,地址库以数组的形式存储,例如:[url1,url2,url3,url5,url7,url8,url10,url13];地址的配置信息以json的数据格式存储:{‘url5’:{‘k1’:[url2]},’url13’:{‘k1’:[url7]}};如果当前页面是url13,在配置里面存在url13的配置url7,而且在现有的地址库中查找存在url7的地址,回退直接到url7,清除url7地址后面的所有的信息,即地址库信息变更为:[url2,url3,url5,url7]。如果当前的地址库为[url1,url2,url3,url5,url6,url8,url13];当前地址为url13,但是当前地址库中没有找到他的配置url7,直接回退到地址url7,新的地址库变为[url1,url2,url3,url5,url6,url8,url13,url7],更新地址库。
S206’、消除历史记录中区段间,即a页面之后的访问记录,去往S207;
S207’、回退到所配置的页面;
S208’、直接触发浏览器的返回,使用缓存打开页面;
S209’、回退上一页面,即b页面。
通过实施本发明所提供的方法,用户使用手机App使用内置浏览器访问内嵌网页时,程序记录用户浏览记录,并储存于sessionStorage中,当用户需要执行回退操作,即触发手机物理返回键或App返回导航时,依赖于手机App与网页端约定的交互接口,使其保持一致的行为,根据用户访问历史记录以及网页页面间父级子级关系计算出应该返回的场景,即回退至某一指定页面或者关闭内置浏览器,使内嵌网页表现出与App同样的场景切换效果且实现了将网页内部场景切换的控制权全部放置在网页端,提升了开发协作性并实现了将内置浏览器端页面的可管理性。
本发明的访问方式既可以支持跟原生App的执行方式一样,从那来回那去,也可以特定的配置某个操作的跳转到指定的地方,非常灵活方便。同时使用到内置浏览器的缓存机制,返回直接走缓存页面,速度快,同时也节省流量。
本说明书中的各个实施例均采用递进的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。本领域普通技术人员在不付出创造性劳动的情况下,即可以理解并实施。
以上所述仅为本发明的较佳实施例,并不用以限制本发明,凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (8)
1.一种App内置浏览器与内嵌网页回退交互的方法,具体流程如下
S101、登陆手机App,访问内嵌网页;
S102、用户在App内打开内嵌网页T,其中T页面为初始页面,即入口页面,url地址存储在sessionStorage中;
S103、用户访问第一内嵌网页,将该页面url和参数记录在sessionStorage中;
S104、用户访问第二内嵌网页,将该页面url和参数记录在sessionStorage中,
S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作,
当每访问一个页面时,都会将该页面url和参数记录在sessionStorage中,
所述S105、用户访问第三内嵌网页,浏览后触发回退功能,执行回退操作进一步包括:
S201、用户在某个页面触发物理回退键或者导航的回退键;
S202、判断该页面地址是否与T页面地址一致,如果一致,则前往S203;
S203、判断为入口页面,执行跳出手机端内嵌浏览器并清空sessionStorage,返回至App原生界面,回退结束。
2.根据权利要求1所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
如果S202中判断该页面地址与T页面地址不一致,则去往步骤S204;
S204、判断该页面地址是否有配置的回退父级页面;如果有配置,则去往S205;
S205、根据访问历史和配置文件进行回退地址的计算;
S206、消除历史记录中区段间的访问记录,去往S207;
S207、回退到所配置的页面。
3.根据权利要求2所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
步骤S204中判断该页面地址没有配置的回退父级页面,则去往S207;
某个功能页面的父级页面可以多个,通过配置文件的方式设置,在不同的应用场景下自动选择回退到特定父级页面;
S208、直接触发浏览器的返回,使用缓存打开页面;
S209、回退上一页面。
4.根据权利要求3所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
根据具体业务的需要,同一功能页面设置多个父级页面,通过配置文件的方式设置,在不同的应用场景下自动选择回退到特定父级页面。
5.根据权利要求4所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
S205进一步包括读取本地存储的地址库及当前地址的配置信息,在地址库中查找是否有这个地址,如果有,回退到配置地址,清除该地址后面所有的地址信息,得到最新的地址库并更新地址库,如果没有查找到,直接跳转到配置地址,同时记录到地址库中,更新地址库。
6.根据权利要求5所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
地址库以数组的形式存储。
7.根据权利要求6所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
地址的配置信息以json的数据格式存储。
8.根据权利要求1至7任一所述的一种App内置浏览器与内嵌网页回退交互的方法,其特征在于:
地址库以数组的形式存储:[url1,url2,url3,url5,url7,url8,url10,url13];地址的配置信息以json的数据格式存储:{‘url5’:{‘k1’:[url2]},’url13’:{‘k1’:[url7]}};如果当前页面是url13,在配置里面存在url13的配置url7,而且在现有的地址库中查找存在url7的地址,回退直接到url7,清除url7地址后面的所有的信息,即地址库信息变更为:[url2,url3,url5,url7],如果当前的地址库为[url1,url2,url3,url5,url6,url8,url13];当前地址为url13,但是当前地址库中没有找到他的配置url7,直接回退到地址url7,新的地址库变为[url1,url2,url3,url5,url6,url8,url13,url7],更新地址库。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610786587.2A CN106339163B (zh) | 2016-08-30 | 2016-08-30 | 一种App内置浏览器与内嵌网页回退交互的方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201610786587.2A CN106339163B (zh) | 2016-08-30 | 2016-08-30 | 一种App内置浏览器与内嵌网页回退交互的方法 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN106339163A CN106339163A (zh) | 2017-01-18 |
CN106339163B true CN106339163B (zh) | 2019-04-05 |
Family
ID=57822377
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201610786587.2A Active CN106339163B (zh) | 2016-08-30 | 2016-08-30 | 一种App内置浏览器与内嵌网页回退交互的方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN106339163B (zh) |
Families Citing this family (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN107608801B (zh) * | 2017-09-05 | 2020-09-29 | 北京京东尚科信息技术有限公司 | 原生页面与html5页面通信方法、装置、介质和设备 |
WO2019090764A1 (zh) * | 2017-11-13 | 2019-05-16 | 深圳峰创智诚科技有限公司 | 应用程序页面返回的实现方法和装置 |
CN109815000B (zh) * | 2019-02-25 | 2021-09-03 | 百度在线网络技术(北京)有限公司 | 应用调起方法及其系统、移动终端和计算机可读介质 |
TWI720721B (zh) * | 2019-12-06 | 2021-03-01 | 中華電信股份有限公司 | 用於網頁應用程式之瀏覽操作系統及方法 |
CN111382387B (zh) * | 2020-03-06 | 2023-10-24 | 深圳市盟天科技有限公司 | 基于小程序的网页访问方法、装置、设备及存储介质 |
CN111459481A (zh) * | 2020-03-26 | 2020-07-28 | 平安普惠企业管理有限公司 | 页面侧滑方法、装置、电子设备和存储介质 |
CN114036428A (zh) * | 2021-11-26 | 2022-02-11 | 重庆允成互联网科技有限公司 | 一种浏览器回退控制方法、系统、设备及存储介质 |
Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN1918572A (zh) * | 2004-02-26 | 2007-02-21 | 国际商业机器公司 | 使web应用能够访问企业管理的数据的方法、装置和计算机程序 |
CN103500204A (zh) * | 2013-09-27 | 2014-01-08 | 北京京东尚科信息技术有限公司 | 一种网页浏览回退方法、网页服务器和客户端 |
CN103856508A (zh) * | 2012-11-30 | 2014-06-11 | 腾讯科技(深圳)有限公司 | 数据透传方法和相应的即时通讯终端 |
WO2014126645A1 (en) * | 2013-02-13 | 2014-08-21 | Dropbox, Inc. | Seamless editing and saving of online content items using applications |
CN104423934A (zh) * | 2013-08-25 | 2015-03-18 | 上海莞东拿信息科技有限公司 | 基于Android平台系统的旅程航班动态通知系统及其方法 |
CN105159984A (zh) * | 2015-08-31 | 2015-12-16 | 联想(北京)有限公司 | 一种信息处理方法及电子设备 |
CN102262528B (zh) * | 2010-05-26 | 2016-06-22 | 腾讯科技(深圳)有限公司 | 即时通讯客户端及其内嵌网页页面实现拖拽的方法 |
-
2016
- 2016-08-30 CN CN201610786587.2A patent/CN106339163B/zh active Active
Patent Citations (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN1918572A (zh) * | 2004-02-26 | 2007-02-21 | 国际商业机器公司 | 使web应用能够访问企业管理的数据的方法、装置和计算机程序 |
CN102262528B (zh) * | 2010-05-26 | 2016-06-22 | 腾讯科技(深圳)有限公司 | 即时通讯客户端及其内嵌网页页面实现拖拽的方法 |
CN103856508A (zh) * | 2012-11-30 | 2014-06-11 | 腾讯科技(深圳)有限公司 | 数据透传方法和相应的即时通讯终端 |
WO2014126645A1 (en) * | 2013-02-13 | 2014-08-21 | Dropbox, Inc. | Seamless editing and saving of online content items using applications |
CN104423934A (zh) * | 2013-08-25 | 2015-03-18 | 上海莞东拿信息科技有限公司 | 基于Android平台系统的旅程航班动态通知系统及其方法 |
CN103500204A (zh) * | 2013-09-27 | 2014-01-08 | 北京京东尚科信息技术有限公司 | 一种网页浏览回退方法、网页服务器和客户端 |
CN105159984A (zh) * | 2015-08-31 | 2015-12-16 | 联想(北京)有限公司 | 一种信息处理方法及电子设备 |
Also Published As
Publication number | Publication date |
---|---|
CN106339163A (zh) | 2017-01-18 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN106339163B (zh) | 一种App内置浏览器与内嵌网页回退交互的方法 | |
US9787795B2 (en) | System for prefetching digital tags | |
KR102324286B1 (ko) | 애플리케이션 인터페이스 관리 방법 및 장치 | |
CN106886570B (zh) | 页面处理方法及装置 | |
CA2842737C (en) | Web browsing enhanced by cloud computing | |
CN108255890B (zh) | 页面的处理方法和装置 | |
CN110377851A (zh) | 多级联动下拉框的实现方法、装置和计算机设备 | |
CN106294372A (zh) | 应用程序页面快速访问方法及应用其的移动终端 | |
WO2015138147A1 (en) | Prefetching application data for periods of disconnectivity | |
CN102955694A (zh) | 基于WebKit 浏览器的客户端实现方法以及客户端 | |
CN104426713A (zh) | 网络站点访问效果数据的监测方法和装置 | |
CN104850546A (zh) | 移动媒介信息的展示方法和系统 | |
CN104572777A (zh) | 基于UIWebView组件的网页加载方法及装置 | |
CN102880679B (zh) | 一种网页信息存储方法和装置 | |
CN102663081A (zh) | 在线应用平台内浏览网页的方法及在线浏览器、在线应用平台 | |
CN110213105A (zh) | 一种跨平台微应用创建方法 | |
CN103297498A (zh) | 基于手机客户端的关联内容推送方法 | |
CN102955852A (zh) | 一种网页资源处理方法、装置及设备 | |
US9811324B2 (en) | Code caching system | |
US9164817B2 (en) | Mobile communication terminal to provide widget expansion function using message communication, and operation method of the mobile communication terminal | |
CN109634758A (zh) | 基于json文件控制事件和行为的方法及中间件平台 | |
CN108664191A (zh) | 系统访问方法及装置 | |
CN109313657A (zh) | 用于提供与主要信息相关的附加信息的方法和系统 | |
CN115981650A (zh) | 一种网站搭建方法及装置、电子设备、存储介质 | |
CN110020238A (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 |