一种同域跨单页应用无感知跳转方法及装置制造方法及图纸

本公开提供了一种同域跨单页应用无感知跳转方法及装置，涉及计算机技术领域，包括：当执行JavaScript代码时，将History API的原始push方法存放于变量中；基于存储的变量构造函数，得到History API的自定义push方法；基于自定义push方法，在当前页面需要跳转到目标页面时，判断目标页面的跳转目标地址是否与预设的白名单地址相匹配；根据匹配结果调用不同的跳转方式，并基于跳转方式从当前页面跳转到目标页面。本公开可以有效减少开发逻辑和规避不必要产生的错误。

【技术实现步骤摘要】
一种同域跨单页应用无感知跳转方法及装置
本公开涉及计算机
，尤其涉及一种同域跨单页应用无感知跳转方法及装置。
技术介绍
Web页面之间相互跳转是互联网最基本的一个功能。在多页面Web应用中，是由服务端控制路由，每次地址栏改变都会向服务端发送新的页面请求更新当前页面，页面跳转使用a标签或者window.location.href跳转；在单页面Web应用中，是由前端控制路由，每次地址栏改变不会发送新的页面请求，页面跳转通过调用window.HistoryAPI来实现，也即在只改变地址栏不刷新页面的前提下，从当前HTML中把页面上某块局部内容展示出来。一个功能繁杂的复杂应用，实际可能是由多页面Web应用和单页面Web应用等多个这样的子系统组成的。在这些子系统与子系统之间改变路径跳转时，主要是采用后端控制路由的跳转方式；然而，单页面Web应用是通过前端控制路由实现跳转的。针对于此，在页面跳转中需要为每个跳转的地方设置判断条件，用于判断路径是跳往子系统内部还是外部。但是，该方式严重消耗开发逻辑，并容易产生错误，诸如：如果判断是跳往子系统外部的地址，却错误的使用了前端路由跳转，就会出现页面找不到的情况。
技术实现思路
为了解决上述技术问题或者至少部分地解决上述技术问题，本公开提供了一种同域跨单页应用无感知跳转方法及装置。本公开提供了一种同域跨单页应用无感知跳转方法，包括：当执行JavaScript代码时，将HistoryAPI的原始push方法存放于变量中；基于存储的变量构造函数，得到HistoryAPI的自定义push方法；基于所述自定义push方法，在当前页面需要跳转到目标页面时，判断所述目标页面的跳转目标地址是否与预设的白名单地址相匹配；根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面。进一步，所述根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面的步骤，包括：当匹配结果为所述跳转目标地址与预设的白名单地址匹配时，通过调用window.location.href将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。进一步，所述根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面的步骤，包括：当匹配结果为所述跳转目标地址与预设的白名单地址不匹配时，通过调用存放于变量中所述原始push方法将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。进一步，所述方法还包括：通过添加和/或删除的操作设置有效的外部跳转的白名单地址；其中，所述白名单地址使用数值列表存放，且所述数值列为字符串或正则表达式。进一步，所述方法还包括：响应于用户操作，根据所述用户操作获取URL请求对应的所述目标页面，并执行所述目标页面上的JavaScript代码。本公开提供了一种同域跨单页应用无感知跳转装置，包括：方法存放模块，用于当执行JavaScript代码时，将HistoryAPI的原始push方法存放于变量中；方法构造模块，用于基于存储的变量构造函数，得到HistoryAPI的自定义push方法；判断模块，用于基于所述自定义push方法，在当前页面需要跳转到目标页面时，判断所述目标页面的跳转目标地址是否与预设的白名单地址相匹配；页面跳转模块，用于根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面。进一步，所述页面跳转模块还用于：当匹配结果为所述跳转目标地址与预设的白名单地址匹配时，通过调用window.location.href将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。进一步，所述页面跳转模块还用于：当匹配结果为所述跳转目标地址与预设的白名单地址不匹配时，通过调用存放于变量中所述原始push方法将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。进一步，所述装置还包括：白名单设置模块，用于通过添加和/或删除的操作设置有效的外部跳转的白名单地址；其中，所述白名单地址使用数值列表存放，且所述数值列为字符串或正则表达式。进一步，所述装置还包括：JS执行模块，用于响应于用户操作，根据所述用户操作获取URL请求对应的所述目标页面，并执行所述目标页面上的JavaScript代码。本公开实施例提供的技术方案与现有技术相比具有如下优点：本公开提供了一种同域跨单页应用无感知跳转方法及装置，包括：当执行JavaScript代码时，将HistoryAPI的原始push方法存放于变量中；基于存储的变量构造函数，得到HistoryAPI的自定义push方法；基于自定义push方法，在当前页面需要跳转到目标页面时，判断目标页面的跳转目标地址是否与预设的白名单地址相匹配；根据匹配结果调用不同的跳转方式，并基于跳转方式从当前页面跳转到目标页面。本公开基于预设的白名单地址，可以无需考虑将要跳转的路径是外部的还是内部的，并根据路径的匹配结果来调用不同的跳转方式，上述方式无需在所有页面跳转的地方做条件判断，可以有效减少开发逻辑和规避不必要产生的错误。附图说明此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。为了更清楚地说明本公开实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，对于本领域普通技术人员而言，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。图1为本公开实施例所述一种同域跨单页应用无感知跳转方法流程图；图2为本公开实施例所述另一种同域跨单页应用无感知跳转方法流程图；图3为本公开实施例所述一种同域跨单页应用无感知跳转装置的结构框图。具体实施方式为了能够更清楚地理解本公开的上述目的、特征和优点，下面将对本公开的方案进行进一步描述。需要说明的是，在不冲突的情况下，本公开的实施例及实施例中的特征可以相互组合。在下面的描述中阐述了很多具体细节以便于充分理解本公开，但本公开还可以采用其他不同于在此描述的方式来实施；显然，说明书中的实施例只是本公开的一部分实施例，而不是全部的实施例。本实施例提供了一种同域跨单页应用无感知跳转方法，参照图1所示的同域跨单页应用无感知跳转方法流程图，该方法主要包括如下步骤：步骤S102，当执行JavaScript代码时，将HistoryAPI的原始push方法存放于变量中；步骤S104，基于存储的变量构造函数，得到HistoryAPI的自定义push方法；步骤S106，基于自定义push方法，在当前页面需要跳转到目标页面时，判断目标页面的跳转目标地址是否与预设的白名单地址相匹配；步骤S108，根据匹配结果调用不同的跳转方式，并基于跳转方式从当前页面跳转到目标页面。本步骤S本文档来自技高网...

【技术保护点】
1.一种同域跨单页应用无感知跳转方法，其特征在于，包括：/n当执行JavaScript代码时，将History API的原始push方法存放于变量中；/n基于存储的变量构造函数，得到History API的自定义push方法；/n基于所述自定义push方法，在当前页面需要跳转到目标页面时，判断所述目标页面的跳转目标地址是否与预设的白名单地址相匹配；/n根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面。/n

【技术特征摘要】
1.一种同域跨单页应用无感知跳转方法，其特征在于，包括：
当执行JavaScript代码时，将HistoryAPI的原始push方法存放于变量中；
基于存储的变量构造函数，得到HistoryAPI的自定义push方法；
基于所述自定义push方法，在当前页面需要跳转到目标页面时，判断所述目标页面的跳转目标地址是否与预设的白名单地址相匹配；
根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面。


2.根据权利要求1所述的方法，其特征在于，所述根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面的步骤，包括：
当匹配结果为所述跳转目标地址与预设的白名单地址匹配时，通过调用window.location.href将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。


3.根据权利要求1所述的方法，其特征在于，所述根据匹配结果调用不同的跳转方式，并基于所述跳转方式从所述当前页面跳转到所述目标页面的步骤，包括：
当匹配结果为所述跳转目标地址与预设的白名单地址不匹配时，通过调用存放于变量中所述原始push方法将所述当前页面的地址改变为所述跳转目标路径，以从所述当前页面跳转到所述目标页面。


4.根据权利要求1所述的方法，其特征在于，所述方法还包括：
通过添加和/或删除的操作设置有效的外部跳转的白名单地址；其中，所述白名单地址使用数值列表存放，且所述数值列为字符串或正则表达式。


5.根据权利要求1所述的方法，其特征在于，所述方法还包括：
响应于用户操作，根据所述用户操作获取URL请求对应的所述目标页面，并执行所述目标页面上的JavaScri...

【专利技术属性】
技术研发人员：吴江林，崔浩波，孙德华，
申请(专利权)人：北京嗨学网教育科技股份有限公司，
类型：发明
国别省市：北京;11