CN111078209B - 业务页面的开发处理方法、装置及设备 - Google Patents

Abstract

本申请公开了一种业务页面的开发处理方法、装置及设备，涉及页面开发技术领域，可提高业务页面开发的效率。其中方法包括：首先在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；然后在所述目标容器环境的页面中，调取所述待开发业务页面进行编辑开发。本申请适用于业务页面的开发处理。

Description

业务页面的开发处理方法、装置及设备

技术领域

本申请涉及页面开发技术领域，尤其是涉及到一种业务页面的开发处理方法、装置及设备。

背景技术

随着移动互联网技术的发展，应用程序(Application，APP)的功能越来越强大。同时，业务页面因其灵活性高、制作周期短等优势，在APP中的应用也越来越普遍。

目前，在针对目标APP开发相应业务页面的过程中，必须依赖于该目标APP中的容器环境，即首先装载该目标APP，然后在该目标APP中的容器环境内进行编辑开发。然而，开发过程中可能会受到这种APP中容器环境的条件制约，影响业务页面开发的流畅性，进而会影响业务页面开发的效率。

发明内容

有鉴于此，本申请提供了一种业务页面的开发处理方法、装置及设备，主要目的在于解决目前在针对目标APP开发相应业务页面的过程中，会受到APP中容器环境的条件制约，进而会影响业务页面开发效率的技术问题。

根据本申请的一个方面，提供了一种业务页面的开发处理方法，该方法包括：

在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；

在所述目标容器环境的页面中，调取所述待开发业务页面进行编辑开发。

可选的，所述目标容器环境的预设存储位置保存有业务页面在所述原容器环境中调用时所需的各个接口信息；

对调取到的所述待开发业务页面进行编辑开发，具体包括：

通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发。

可选的，所述通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发，具体包括：

配置所述待开发业务页面对应的网页视图标识，所述网页视图标识用于判定发送接口信息调用请求的业务页面；

当根据所述网页视图标识、判定所述待开发业务页面请求调用目标接口信息时，根据所述目标接口信息的类型执行对应的触发操作。

可选的，所述根据所述目标接口信息的类型执行对应的触发操作，具体包括：

若所述目标接口信息的类型为单独存储的业务类型，则在所述目标容器环境的页面中进行相应的存储处理，并触发与所述目标接口信息对应的执行事件；

若所述目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与所述目标接口信息对应需要调用的目标视图页面；

触发将所述目标视图页面加载到所述目标容器环境的页面中的对应位置，并区别于所述待开发业务页面所在的图层。

可选的，所述方法还包括：

当接收到对加载的所述目标视图页面的操作指令时，执行与所述目标视图页面对应的预设事件。

可选的，所述在目标浏览器中调取目标容器环境的页面，具体包括：

通过在所述目标浏览器中输入与所述目标容器环境的页面对应的第一网址信息，调取所述目标容器环境的页面。

可选的，在所述目标容器环境的页面中，调取所述待开发业务页面，具体包括：

通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面。

可选的，所述通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面，具体包括：

对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信，具体包括：

在所述第二网址信息中添加预设参数，所述预设参数用于指示加载预定脚本，以便建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信，具体还包括：

在调取所述待开发业务页面后，根据所述预设参数建立临时会话存储对象，所述临时会话存储对象用于在通过所述待开发业务页面调取其他业务页面时，指示加载所述预定脚本，以便建立所述其他业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述方法还包括：

在所述待开发业务页面编辑开发完成后，利用所述目标浏览器对开发完成的所述待开发业务页面进行测试。

可选的，所述待开发业务页面以内联框架IFRAME的形式配置在所述目标容器环境的页面中。

根据本申请的另一方面，提供了一种业务页面的开发处理装置，该装置包括：

调取模块，用于在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；

调取模块，还用于在所述目标容器环境的页面中，调取所述待开发业务页面；

开发模块，用于对调取到的所述待开发业务页面进行编辑开发。

可选的，所述目标容器环境的预设存储位置保存有业务页面在所述原容器环境中调用时所需的各个接口信息；

所述开发模块，具体用于通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发。

可选的，所述开发模块，具体还用于配置所述待开发业务页面对应的网页视图标识，所述网页视图标识用于判定发送接口信息调用请求的业务页面；

当根据所述网页视图标识、判定所述待开发业务页面请求调用目标接口信息时，根据所述目标接口信息的类型执行对应的触发操作。

可选的，所述开发模块，具体还用于若所述目标接口信息的类型为单独存储的业务类型，则在所述目标容器环境的页面中进行相应的存储处理，并触发与所述目标接口信息对应的执行事件；

若所述目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与所述目标接口信息对应需要调用的目标视图页面；

触发将所述目标视图页面加载到所述目标容器环境的页面中的对应位置，并区别于所述待开发业务页面所在的图层。

可选的，所述开发模块，还用于当接收到对加载的所述目标视图页面的操作指令时，执行与所述目标视图页面对应的预设事件。

可选的，所述调取模块，具体用于通过在所述目标浏览器中输入与所述目标容器环境的页面对应的第一网址信息，调取所述目标容器环境的页面。

可选的，所述调取模块，具体还用于通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面。

可选的，所述调取模块，具体还用于对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述调取模块，具体还用于在所述第二网址信息中添加预设参数，所述预设参数用于指示加载预定脚本，以便建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述调取模块，具体还用于在调取所述待开发业务页面后，根据所述预设参数建立临时会话存储对象，所述临时会话存储对象用于在通过所述待开发业务页面调取其他业务页面时，指示加载所述预定脚本，以便建立所述其他业务页面与所述目标容器环境的页面之间的实时通信。

可选的，所述装置还包括：

测试模块，用于在所述待开发业务页面编辑开发完成后，利用所述目标浏览器对开发完成的所述待开发业务页面进行测试。

可选的，所述待开发业务页面以内联框架IFRAME的形式配置在所述目标容器环境的页面中。

依据本申请又一个方面，提供了一种存储介质，其上存储有计算机程序，所述程序被处理器执行时实现上述用户界面视觉验收的处理方法。

依据本申请再一个方面，提供了一种业务页面的开发处理的实体设备，包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现上述业务页面的开发处理方法。

借由上述技术方案，本申请提供的一种业务页面的开发处理方法、装置及设备。与目前在APP中的容器环境内进行业务页面编辑开发的方式相比，本申请可预先根据该APP中的原容器环境，在浏览器中创建目标容器环境，进而可在浏览器中利用该目标容器环境调取业务页面进行编辑开发，因此可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅，可提高业务页面开发的效率。

上述说明仅是本申请技术方案的概述，为了能够更清楚了解本申请的技术手段，而可依照说明书的内容予以实施，并且为了让本申请的上述和其它目的、特征和优点能够更明显易懂，以下特举本申请的具体实施方式。

附图说明

此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：

图1示出了本申请实施例提供的一种业务页面的开发处理方法的流程示意图；

图2示出了本申请实施例提供的另一种业务页面的开发处理方法的流程示意图；

图3示出了本申请实施例提供的应用场景的实施架构流程示意图；

图4示出了本申请实施例提供的一种业务页面的开发处理装置的结构示意图。

具体实施方式

下文中将参考附图并结合实施例来详细说明本申请。需要说明的是，在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。

目前在针对目标APP开发相应业务页面的过程中，会受到APP中容器环境的条件制约，进而会影响业务页面开发的效率。为了解决该技术问题，本实施例提供了一种业务页面的开发处理方法，如图1所示，该方法包括：

101、在目标浏览器中调取目标容器环境的页面。

其中，目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的，相当于在浏览器上模拟一套基于APP native环境。待开发业务页面可为需要开发的业务页面，例如，对于未编辑开发完成的业务页面继续进行开发，或者对已开发完成的业务页面进一步进行修改更新等。

在本实施例中，针对目标APP需要开发相应的业务页面，预先根据该目标APP中的原容器环境创建目标容器环境，该目标容器环境包含原容器环境中对于业务页面调用的各个应用接口(Application Programming Interface，API)方法。并且该目标容器环境可被目标浏览器调取，相当于调取目标容器环境的顶层页面，该目标容器环境的相关页面可预先配置在本地或者配置在云端等。目标浏览器可选用开发人员比较熟悉、容易操作、约束条件较少的浏览器，或者根据实际需求选用其他浏览器等。

对于本实施例的执行主体可为用于业务页面开发处理的装置或设备，具体可配置在客户端侧，以便辅助用户对业务页面进行编辑开发。

102、在目标容器环境的页面中，调取待开发业务页面进行编辑开发。

由于目标容器环境包含APP原容器环境中对于业务页面调用的各个API方法，所以在目标容器环境的页面中调取待开发业务页面进行编辑开发，可以实现脱离APP原容器环境，依然可以调用相关的API方法进行业务页面编辑开发。

通过应用本实施例提供的业务页面的开发处理方法，与目前在APP中的容器环境内进行业务页面编辑开发的方式相比，本实施例可预先根据该APP中的原容器环境，在浏览器中创建目标容器环境，进而可在浏览器中利用该目标容器环境调取业务页面进行编辑开发，因此可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅，可提高业务页面开发的效率。

进一步的，作为上述实施例具体实施方式的细化和扩展，为了完整说明本实施例的具体实施过程，本实施例提供了另一种业务页面的开发处理方法，如图2所示，该方法包括：

201、通过在目标浏览器中输入与目标容器环境的页面对应的第一网址信息，调取目标容器环境的页面。

其中，第一网址信息用于调取目标容器环境的页面。通过这种方式可方便在目标浏览器中加载目标容器环境，操作简单，便于用户操作。

可选的，目标容器环境的预设存储位置保存有业务页面在原容器环境中调用时所需的各个接口信息。例如，可预先根据待开发业务页面对应APP中的原容器环境创建目标容器环境，该目标容器环境中保存有业务页面在原容器环境中调用时所需的各个接口信息，并且还可包含触发调用这些接口信息的条件内容等。从而保证后续在该目标容器环境中开发业务页面时可准确模拟APP中的原容器环境，进而保证开发需求，并且还可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅。

202、通过在目标容器环境的页面中输入待开发业务页面的第二网址信息，调取待开发业务页面。

其中，第二网址信息用于在目标容器环境的页面中调取待开发业务页面。与目前现有技术相比，可方便调取需要开发的待开发业务页面，并且调取的待开发业务页面可在同一目标容器环境的页面中进行展示，更加方便进行业务页面的编辑开发与调试，提高了一定的效率。

可选的，待开发业务页面以内联框架IFRAME的形式配置在目标容器环境的页面中。这样的好处是业务页面是个独立的环境，不会受到外界的任何样式或者脚本等所带来的影响，从而相对是个稳定且安全的环境。

为了实现业务页面与目标容器环境的页面之间的实时通信，作为一种可选方式，步骤202具体可包括：对第二网址信息进行处理，使得建立待开发业务页面与目标容器环境的页面之间的实时通信。进而实现在目标容器环境中调用需要的接口信息，从而实现对业务页面的有效开发编辑。并且后续开发完成的业务页面调用这些需要的接口信息也能在该目标容器环境中实现相应的业务功能。

可选的，对第二网址信息进行处理，使得建立待开发业务页面与目标容器环境的页面之间的实时通信，具体可包括：在第二网址信息中添加预设参数，预设参数用于指示加载预定脚本，以便建立待开发业务页面与目标容器环境的页面之间的实时通信。

在本可选方式中，业务页面需要引入一段脚本(预定脚本)，该脚本在指定的环境(目标容器环境)下才会被加载，进而实现业务页面与目标容器环境的页面之间的实时通信。

例如，在目标容器环境的页面中输入待开发业务页面的统一资源定位符(UniformResource Locator，URL)时，***自动在该URL上面添加一个参数，如果存在该参数，业务页面的IFRAME的地址会发现这个参数，那么就会加载业务页面的预定脚本。

由于在业务页面中可能会继续调用其他业务页面，而采用上述可选方式不会在新输入的网址信息中添加预设参数。因此为了保证新调取的其他业务页面也能与目标容器环境的页面之间实现实时通信，进一步可选的，对第二网址信息进行处理，使得建立待开发业务页面与目标容器环境的页面之间的实时通信，具体还可包括：在调取待开发业务页面后，根据预设参数建立临时会话存储对象，该临时会话存储对象用于在通过待开发业务页面调取其他业务页面时，指示加载预定脚本，以便建立该其他业务页面与目标容器环境的页面之间的实时通信。

例如，使用这种临时会话存储的方式，来代替在业务URL上面拼接一个字段来加载预定脚本，可实现通过业务页面新调取的其他业务页面也能与目标容器环境的页面之间实现实时通信，进而保证这些其他业务页面也能在目标容器环境中实现编辑开发与功能测试等。

203、对调取到的待开发业务页面进行编辑开发。

基于步骤201中可选内容，步骤203具体可包括：通过目标容器环境保存的在原容器环境中调用时所需的各个接口信息，对调取到的待开发业务页面进行编辑开发。从而保证在目标容器环境中开发业务页面时可准确模拟APP中的原容器环境，进而保证开发需求，并且还可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅。

为了说明具体的开发编辑过程，示例性可选的，上述通过各个接口信息，对调取到的待开发业务页面进行编辑开发，具体可包括：配置待开发业务页面对应的网页视图标识，该网页视图标识用于判定发送接口信息调用请求的业务页面；通过开发编辑使得当根据网页视图标识、判定待开发业务页面请求调用目标接口信息时，根据该目标接口信息的类型执行对应的触发操作。

***可自动配置每个在目标容器环境页面中调取的业务页面的网页视图标识(WebviewID)，然后建立相应的映射关系，这样在目标容器环境页面中打开多个业务页面时，也能根据该网页视图标识判别是哪个业务页面发送的API调用请求。通过这种方式可实现业务页面与目标容器环境页面之间的准确通信。

进一步可选的，上述根据目标接口信息的类型执行对应的触发操作，具体可包括：若业务页面请求调用的目标接口信息的类型为单独存储的业务类型，则在目标容器环境的页面中进行相应的存储处理，并触发与目标接口信息对应的执行事件。

例如，如果业务页面请求调用的API类型是如设置头部、头部文案、右上角的按钮等独立存储在其他位置的业务类型时，可在目标容器环境的页面中进行相应的store处理，然后触发相对应的action操作，进而执行对应的事件，做到即时生效。

若业务页面请求调用的目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与该目标接口信息对应需要调用的目标视图页面；然后触发将目标视图页面加载到目标容器环境的页面中的对应位置，并区别于待开发业务页面所在的图层。即二者可存在于不同图层，然后堆叠展示。

在本可选方式中，可将所有需要调用的视图部分单独存储，没有在业务层显示，这样做的目的是区分开请求调用API方法的视图与业务视图之间的关联，使得二者没有任何相关联，且不会存在样式冲突的问题。后续如果需要更新新的关于视图的API时，只需要在这个单纯存储的预设视图存储位置中进行相应更新操作即可，不需要额外发布目标容器环境页面的包迭代，进而便于维护。例如，显示对应的视图可包括登录部分、loading、toast等等。

进一步的，通过对业务页面的编辑开发使得当接收到对加载的目标视图页面的操作指令时，可执行与目标视图页面对应的预设事件。在本实施例中，由于在目标容器环境页面调取目标视图页面时会配置对应的网页视图标识，因此后续接收到对目标容器环境页面加载的目标视图页面的操作指令(如用户点击该视图等)时，可通过该标识ID，调用该ID对应的事件，进而实现完整的视图并包括对应的事件。

204、在待开发业务页面编辑开发完成后，利用目标浏览器对开发完成的待开发业务页面进行测试。

例如，可同样在目标浏览器中输入目标容器环境的页面的网址信息，这样可进入目标容器环境的页面，然后在该目标容器环境的页面中输入需要测试的业务页面的网址信息，进而调取该业务页面进行功能测试。通过这种方式测试人员无需按照目标APP即可实现对相应业务页面的测试，无需用真机去看，只需浏览器即可实现测试需求，进而可提高测试效率。

基于上述如图1和图2所示的具体实施方式内容，为了有更好的理解，给出如下具体应用实现场景，但不限于此，如图3所示。

针对于本方案提供的业务页面的开发处理方法，编辑顶层工具页面(即目标容器环境页面)。在顶层主页面接入工具核心模块。首先业务页面需要引入一段JS(Javascript)脚本，这样在顶层工具页面中调取业务页面时可自动加载该脚本，实现业务页面与顶层工具页面之间的实时通信。该业务页面以IFRAME的形式放在顶层工具页面中。顶层工具页面会派发一个页面的webviewID给该业务页面，这样就算pushwindow多个业务页面的时候，也能知道是哪个页面发出的api请求。

在顶层工具页面中，所有页面调用的JS API的方法都存放在当前的位置store上，任何业务层API的变化都会触发顶层工具页面与其他层直接的通信，建立与之对应的关系。本顶层工具页面还起到一个桥梁的作用，与业务层页面还有视图页面之间建立桥梁关系。当业务页面调用JS API的时候，会通知到该顶层工具页面中来。如果根据该调用的JS API，确定需要显示一个用户界面(User Interface，UI)视图，会继续通知到视图页面进行调取。在视图页面上面的时间点击之后，会触发通知顶层工具层，工具层再派发到对应的业务层，告知对应的ID，进而调度对应的事件。

通过应用上述场景的方案，可在浏览器中利用预先编辑的容器环境调取业务页面进行编辑开发，因此可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅，可提高业务页面开发的效率。与目前采用浏览器插件的实现方式相比，本方案顶层主模块可采用tnpm包的形式提供，所以具备tnpm包管理的一切规范和特征，不需要特意地通知用户进行更新。并且本方案可采用web端react技术栈编写，开发成本以及维护性、拓展性方面远小于采用浏览器插件的实现方式。

进一步的，作为图1和图2方法的具体实现，本申请实施例提供了一种业务页面的开发处理装置，如图4所示，该装置包括：调取模块31、开发模块32。

调取模块31，可用于在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；

调取模块31，还可用于在所述目标容器环境的页面中，调取所述待开发业务页面；

开发模块32，可用于对调取到的所述待开发业务页面进行编辑开发。

在具体的应用场景中，可选的，所述目标容器环境的预设存储位置保存有业务页面在所述原容器环境中调用时所需的各个接口信息；

所述开发模块32，具体可用于通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发。

在具体的应用场景中，所述开发模块32，具体还可用于配置所述待开发业务页面对应的网页视图标识，所述网页视图标识用于判定发送接口信息调用请求的业务页面；当根据所述网页视图标识、判定所述待开发业务页面请求调用目标接口信息时，根据所述目标接口信息的类型执行对应的触发操作。

在具体的应用场景中，所述开发模块32，具体还可用于若所述目标接口信息的类型为单独存储的业务类型，则在所述目标容器环境的页面中进行相应的存储处理，并触发与所述目标接口信息对应的执行事件；若所述目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与所述目标接口信息对应需要调用的目标视图页面；触发将所述目标视图页面加载到所述目标容器环境的页面中的对应位置，并区别于所述待开发业务页面所在的图层。

在具体的应用场景中，所述开发模块32，还可用于当接收到对加载的所述目标视图页面的操作指令时，执行与所述目标视图页面对应的预设事件。

在具体的应用场景中，所述调取模块31，具体可用于通过在所述目标浏览器中输入与所述目标容器环境的页面对应的第一网址信息，调取所述目标容器环境的页面。

在具体的应用场景中，所述调取模块31，具体还可用于通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面。

在具体的应用场景中，所述调取模块31，具体还可用于对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

在具体的应用场景中，所述调取模块31，具体还可用于在所述第二网址信息中添加预设参数，所述预设参数用于指示加载预定脚本，以便建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

在具体的应用场景中，所述调取模块31，具体还可用于在调取所述待开发业务页面后，根据所述预设参数建立临时会话存储对象，所述临时会话存储对象用于在通过所述待开发业务页面调取其他业务页面时，指示加载所述预定脚本，以便建立所述其他业务页面与所述目标容器环境的页面之间的实时通信。

在具体的应用场景中，本装置还包括：测试模块；

测试模块，可用于在所述待开发业务页面编辑开发完成后，利用所述目标浏览器对开发完成的所述待开发业务页面进行测试。

在具体的应用场景中，可选的，所述待开发业务页面以内联框架IFRAME的形式配置在所述目标容器环境的页面中。

需要说明的是，本实施例提供的一种业务页面的开发处理装置所涉及各功能单元的其它相应描述，可以参考图1和图2中的对应描述，在此不再赘述。

基于上述如图1和图2所示方法，相应的，本申请实施例还提供了一种存储介质，其上存储有计算机程序，该程序被处理器执行时实现上述如图1和图2所示的业务页面的开发处理方法。

基于这样的理解，本申请的技术方案可以以软件产品的形式体现出来，该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM，U盘，移动硬盘等)中，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施场景所述的方法。

基于上述如图1和图2所示的方法，以及图4所示的虚拟装置实施例，为了实现上述目的，本申请实施例还提供了一种业务页面开发处理的实体设备，具体可以为计算机，智能手机，平板电脑，智能手表，智能手环，或者其他网络设备等，该实体设备包括存储介质和处理器；存储介质，用于存储计算机程序；处理器，用于执行计算机程序以实现上述如图1和图2所示的业务页面的开发处理方法。

可选的，该实体设备还可以包括用户接口、网络接口、摄像头、射频(RadioFrequency，RF)电路，传感器、音频电路、WI-FI模块等等。用户接口可以包括显示屏(Display)、输入单元比如键盘(Keyboard)等，可选用户接口还可以包括USB接口、读卡器接口等。网络接口可选的可以包括标准的有线接口、无线接口(如WI-FI接口)等。

本领域技术人员可以理解，本实施例提供的一种业务页面开发处理的实体设备结构并不构成对该实体设备的限定，可以包括更多或更少的部件，或者组合某些部件，或者不同的部件布置。

存储介质中还可以包括操作***、网络通信模块。操作***是管理上述实体设备硬件和软件资源的程序，支持信息处理程序以及其它软件和/或程序的运行。网络通信模块用于实现存储介质内部各组件之间的通信，以及与信息处理实体设备中其它硬件和软件之间通信。

通过以上的实施方式的描述，本领域的技术人员可以清楚地了解到本申请可以借助软件加必要的通用硬件平台的方式来实现，也可以通过硬件实现。通过应用本实施例的技术方案，可在浏览器中利用预先编辑的容器环境调取业务页面进行编辑开发，因此可减少受到APP中容器环境的条件制约所带来的影响，使得业务页面开发更加流畅，可提高业务页面开发的效率。与目前采用浏览器插件的实现方式相比，本方案顶层主模块可采用tnpm包的形式提供，所以具备tnpm包管理的一切规范和特征，不需要特意地通知用户进行更新。并且本方案可采用web端react技术栈编写，开发成本以及维护性、拓展性方面远小于采用浏览器插件的实现方式。

本领域技术人员可以理解附图只是一个优选实施场景的示意图，附图中的模块或流程并不一定是实施本申请所必须的。本领域技术人员可以理解实施场景中的装置中的模块可以按照实施场景描述进行分布于实施场景的装置中，也可以进行相应变化位于不同于本实施场景的一个或多个装置中。上述实施场景的模块可以合并为一个模块，也可以进一步拆分成多个子模块。

上述本申请序号仅仅为了描述，不代表实施场景的优劣。以上公开的仅为本申请的几个具体实施场景，但是，本申请并非局限于此，任何本领域的技术人员能思之的变化都应落入本申请的保护范围。

Claims (24)

1.一种业务页面的开发处理方法，其特征在于，包括：

在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；

在所述目标容器环境的页面中，调取所述待开发业务页面进行编辑开发；

所述目标容器环境的预设存储位置保存有业务页面在所述原容器环境中调用时所需的各个接口信息；

对调取到的所述待开发业务页面进行编辑开发，具体包括：

通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发。

2.根据权利要求1所述的方法，其特征在于，所述通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发，具体包括：

配置所述待开发业务页面对应的网页视图标识，所述网页视图标识用于判定发送接口信息调用请求的业务页面；

当根据所述网页视图标识、判定所述待开发业务页面请求调用目标接口信息时，根据所述目标接口信息的类型执行对应的触发操作。

3.根据权利要求2所述的方法，其特征在于，所述根据所述目标接口信息的类型执行对应的触发操作，具体包括：

若所述目标接口信息的类型为单独存储的业务类型，则在所述目标容器环境的页面中进行相应的存储处理，并触发与所述目标接口信息对应的执行事件；

若所述目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与所述目标接口信息对应需要调用的目标视图页面；

触发将所述目标视图页面加载到所述目标容器环境的页面中的对应位置，并区别于所述待开发业务页面所在的图层。

4.根据权利要求3所述的方法，其特征在于，所述方法还包括：

当接收到对加载的所述目标视图页面的操作指令时，执行与所述目标视图页面对应的预设事件。

5.根据权利要求1所述的方法，其特征在于，所述在目标浏览器中调取目标容器环境的页面，具体包括：

通过在所述目标浏览器中输入与所述目标容器环境的页面对应的第一网址信息，调取所述目标容器环境的页面。

6.根据权利要求1至5中任一项所述的方法，其特征在于，在所述目标容器环境的页面中，调取所述待开发业务页面，具体包括：

通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面。

7.根据权利要求6所述的方法，其特征在于，所述通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面，具体包括：

对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

8.根据权利要求7所述的方法，其特征在于，所述对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信，具体包括：

在所述第二网址信息中添加预设参数，所述预设参数用于指示加载预定脚本，以便建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

9.根据权利要求8所述的方法，其特征在于，所述对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信，具体还包括：

在调取所述待开发业务页面后，根据所述预设参数建立临时会话存储对象，所述临时会话存储对象用于在通过所述待开发业务页面调取其他业务页面时，指示加载所述预定脚本，以便建立所述其他业务页面与所述目标容器环境的页面之间的实时通信。

10.根据权利要求1所述的方法，其特征在于，所述方法还包括：

在所述待开发业务页面编辑开发完成后，利用所述目标浏览器对开发完成的所述待开发业务页面进行测试。

11.根据权利要求1所述的方法，其特征在于，所述待开发业务页面以内联框架IFRAME的形式配置在所述目标容器环境的页面中。

12.一种业务页面的开发处理装置，其特征在于，包括：

调取模块，用于在目标浏览器中调取目标容器环境的页面，所述目标容器环境是根据待开发业务页面对应APP中的原容器环境创建得到的；

调取模块，还用于在所述目标容器环境的页面中，调取所述待开发业务页面；

开发模块，用于对调取到的所述待开发业务页面进行编辑开发；

所述目标容器环境的预设存储位置保存有业务页面在所述原容器环境中调用时所需的各个接口信息；

所述开发模块，具体用于通过所述各个接口信息，对调取到的所述待开发业务页面进行编辑开发。

13.根据权利要求12所述的装置，其特征在于，

所述开发模块，具体还用于配置所述待开发业务页面对应的网页视图标识，所述网页视图标识用于判定发送接口信息调用请求的业务页面；

当根据所述网页视图标识、判定所述待开发业务页面请求调用目标接口信息时，根据所述目标接口信息的类型执行对应的触发操作。

14.根据权利要求13所述的装置，其特征在于，

所述开发模块，具体还用于若所述目标接口信息的类型为单独存储的业务类型，则在所述目标容器环境的页面中进行相应的存储处理，并触发与所述目标接口信息对应的执行事件；

若所述目标接口信息的类型为调用视图的业务类型，则从预设视图存储位置中获取与所述目标接口信息对应需要调用的目标视图页面；

触发将所述目标视图页面加载到所述目标容器环境的页面中的对应位置，并区别于所述待开发业务页面所在的图层。

15.根据权利要求14所述的装置，其特征在于，

所述开发模块，还用于当接收到对加载的所述目标视图页面的操作指令时，执行与所述目标视图页面对应的预设事件。

16.根据权利要求12所述的装置，其特征在于，

所述调取模块，具体用于通过在所述目标浏览器中输入与所述目标容器环境的页面对应的第一网址信息，调取所述目标容器环境的页面。

17.根据权利要求12至16中任一项所述的装置，其特征在于，

所述调取模块，具体还用于通过在所述目标容器环境的页面中输入所述待开发业务页面的第二网址信息，调取所述待开发业务页面。

18.根据权利要求17所述的装置，其特征在于，

所述调取模块，具体还用于对所述第二网址信息进行处理，使得建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

19.根据权利要求18所述的装置，其特征在于，

所述调取模块，具体还用于在所述第二网址信息中添加预设参数，所述预设参数用于指示加载预定脚本，以便建立所述待开发业务页面与所述目标容器环境的页面之间的实时通信。

20.根据权利要求19所述的装置，其特征在于，

所述调取模块，具体还用于在调取所述待开发业务页面后，根据所述预设参数建立临时会话存储对象，所述临时会话存储对象用于在通过所述待开发业务页面调取其他业务页面时，指示加载所述预定脚本，以便建立所述其他业务页面与所述目标容器环境的页面之间的实时通信。

21.根据权利要求12所述的装置，其特征在于，所述装置还包括：

测试模块，用于在所述待开发业务页面编辑开发完成后，利用所述目标浏览器对开发完成的所述待开发业务页面进行测试。

22.根据权利要求12所述的装置，其特征在于，所述待开发业务页面以内联框架IFRAME的形式配置在所述目标容器环境的页面中。

23.一种存储介质，其上存储有计算机程序，其特征在于，所述程序被处理器执行时实现权利要求1至11中任一项所述的业务页面的开发处理方法。

24.一种业务页面的开发处理设备，包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述程序时实现权利要求1至11中任一项所述的业务页面的开发处理方法。

Images