CN111563032A - App调试方法、装置、计算机设备及存储介质 - Google Patents

Abstract

本申请实施例提供了一种APP调试方法、装置、计算机设备及计算机可读存储介质。属于APP开发技术领域，实现APP调试时，APP预先被开发为APP壳框架及若干个H5程序包，APP壳框架通过装载H5程序包来实现APP的功能，调试终端上配置有APP壳框架，获取待调试的H5程序包所对应的URL地址；根据URL地址，加载H5程序包，并将H5程序包装载至APP壳框架中的网页视图中；通过网页视图渲染H5程序包所对应的前端页面以对H5程序包进行调试，以得到H5程序包所对应的调试结果，能够提高APP调试的简便性、高效性和准确性，能够提升APP前端代码的调试效率。

Description

APP调试方法、装置、计算机设备及存储介质

技术领域

本申请涉及APP开发技术领域，尤其涉及一种APP调试方法、装置、计算机设备及计算机可读存储介质。

背景技术

随着前端技术的发展，进行APP开发时，为了避免更新APP时需要用户升级APP，传统技术中逐渐采取H5开发取代大部分原生开发内容。然而，随着H5所做事情的增多，出现问题的机率也逐步增加，导致H5调试人员每天需要进行涉及APP开发或者APP修复等方面的APP调试。

传统技术中，对APP进行调试一般有两种方式：1)、调试人员在自己电脑上模拟服务器运行代码，在电脑浏览器中打开页面进行调试，即对前端APP进行调试时，采用直接通过电脑浏览器运行APP页面以实现对APP进行调试，但是由于APP会运行在各种不同的手机等终端设备上，而手机品牌不同，使用的内核不同，浏览器无法准确模拟出不同开发商的智能手机等终端设备，导致在调试APP时效果并不理想，电脑浏览器中运行的效果往往和真实机器上APP中效果差别挺大，有时明明电脑上看效果正常，到手机上就是有问题。

2)、直接访问APP上的页面进行调试，此页面部署在真实的生产环境中。此方案缺点：不灵活，调试人员每调试一次代码需要将代码部署到服务器上，APP中才能动态改变。

后来采用在手机上运行APP应用，通过后台日志和Charles等工具进行调试，但是这种调试方式不仅麻烦，而且更多的是针对APP中后端接口部分进行的分析，无法做到像浏览器调试那样多元化。并且由于APP所涉及的前端代码往往在开发、测试及生产时部署在不同的服务器上，每台服务器或多或少会存在不一致，导致针对前端APP进行调试比较麻烦，降低了APP调试的效率。

发明内容

本申请实施例提供了一种APP调试方法、装置、计算机设备及计算机可读存储介质，能够解决传统技术中APP调试效率较低的问题。

第一方面，本申请实施例提供了一种APP调试方法，应用于调试终端，所述调试终端为应用所述APP的计算机设备，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述方法应用于所述APP壳框架，所述调试终端上配置有所述APP壳框架，所述方法包括：通过预设方式获取待调试的所述H5程序包所对应的URL地址；根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

第二方面，本申请实施例还提供了一种APP调试装置，应用于调试终端，所述调试终端为应用所述APP的计算机设备，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述装置应用于所述APP壳框架，所述调试终端上配置有所述APP壳框架，所述装置包括：获取单元，用于通过预设方式获取待调试的所述H5程序包所对应的URL地址；加载单元，用于根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；调试单元，用于通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

第三方面，本申请实施例还提供了一种计算机设备，其包括存储器及处理器，所述存储器上存储有计算机程序，所述处理器执行所述计算机程序时实现所述APP调试方法。

第四方面，本申请实施例还提供了一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时使所述处理器执行所述APP调试方法。

本申请实施例提供了一种APP调试方法、装置、计算机设备及计算机可读存储介质。本申请实施例实现APP调试时，由于调试终端为应用所述APP的计算机设备，因而调试人员可以自定义调试终端，在调试终端上安装所述APP后，并且由于H5程序包是单独下载的，因而调试人员可以将所述H5程序包存放在自定义的服务器上，以通过所述H5程序包所对应的URL地址自定义调试页面，并通过所述URL地址将调试终端连接到对应的服务器上，装载所述H5程序包后，通过调试终端运行所述H5程序包所对应的调试页面，即可获得所述H5程序包在调试终端上的实际调试效果。由于H5程序包及服务器均可以灵活的自定义，并且调试终端是APP使用所对应的真实应用环境，因而在调试终端中运行APP来对APP进行调试，可以获得真实而准确的调试效果，相比传统技术中通过浏览器调试APP前端代码，或者通过后台日志和Charles等工具进行调试，面对多款终端设备和各种各样的操作系统及分辨率等多种多种多样的应用环境，能够实现APP前端代码调试的多元化，且能够有效的避免由于不同的机器设备各自所对应的应用环境不同导致的APP前端页面显示效果不一致问题，若APP调试过程中所述H5程序包所对应的APP前端代码存在问题，可以让调试人员可以快速定位问题，能够提高APP调试的简便性、高效性和准确性，能够提升APP前端代码的调试效率。

附图说明

为了更清楚地说明本申请实施例技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本申请实施例提供的一个APP调试方法的应用场景示意图；

图2为本申请实施例提供的APP的结构框图示意图；

图3为本申请实施例提供的APP调试方法的流程示意图；

图4为本申请实施例提供的APP调试方法的一个交互流程示意图；

图5为本申请实施例提供的APP调试装置的一个示意性框图；以及

图6为本申请实施例提供的计算机设备的示意性框图。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

应当理解，当在本说明书和所附权利要求书中使用时，术语“包括”和“包含”指示所描述特征、整体、步骤、操作、元素和/或组件的存在，但并不排除一个或多个其它特征、整体、步骤、操作、元素、组件和/或其集合的存在或添加。

请参阅图1和图2，图1为本申请实施例提供的一个APP调试方法的应用场景示意图，图2为本申请实施例提供的APP的结构框图示意图。本申请实施例中，APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述方法应用于所述APP壳框架，调试终端上配置所述APP壳框架(即调试终端上安装所述APP)。如图2所示，APP预先被开发为APP壳框架H及若干个H5程序包，即一个完整的APP包含APP壳H、H5程序包A、H5程序包B、H5程序包C、H5程序包D及H5程序包E，APP壳H通过装载H5程序包A、H5程序包B、H5程序包C、H5程序包D及H5程序包E以实现完整的APP功能。具体地，APP包含以下两部分内容：

1)APP壳。APP壳主要提供如下内容：(1)部分H5页面不能直接唤起的系统功能和唤起方法，例如相机及GPS定位等系统功能，供H5页面需要时调用；(2)一个全局的Webview(指网页视图，又称为网络视图)窗口，用于装载H5页面，进行渲染；(3)预设的部分调试指令，即通过一系列按钮(例如开启调试、自动修复等)触发，以执行一个个命令进行具体操作。

2)H5程序包。H5程序包是根据预设规则划分的APP包含的H5各部分的独立单元所对应的开发包，例如，根据APP的功能或者APP的模块等将APP划分为不同的H5开发包。例如图2中APP包括H5程序包A、H5程序包B、H5程序包C、H5程序包D及H5程序包E，H5程序包又可以称为H5开发包或者H5包。H5程序包之间进行协作可以直接通过浏览器的location.href进行页面跳转即可。其中，H5程序包可以为任意个，需要调试哪个H5程序包时，在APP壳中装载对应H5页面所对应的H5程序包即可。由于APP开发完成后，APP壳及APP页面框架结构等一般不会有变动，即APP包含的框架内容是固定的，会产生变动的只是H5程序包所对应的H5页面所包含的具体内容，而本申请实施例中H5程序包所对应的H5页面是部署在服务提供商自身的后台服务器上的，而不是像APP更新一样需要经过第三方平台审核。所以更新时只要更新服务提供商自身的后台服务器的H5页面所对应的H5程序包即可，不影响后续APP的更新。

其中，APP壳只是用于装载各个H5应用包(即图2中的H5程序包)的一个窗口。在安卓系统和IOS系统中，如果H5页面需要使用APP壳内的功能，APP壳和H5页面程序包，可以分别使用各自对应的方式进行交互，例如，在安卓系统中，可以通过桥连接的方式使APP壳和H5页面程序包进行交互，比如Android JS桥交互，Android JS桥交互是指安卓系统中Webview和JS进行交互的方式，使用连接桥JsBridge进行连接，在IOS系统中，IOS Webview与JS交互，可以使用运用JavaScrIPtCore框架进行交互等。

如图1所示，所述应用场景包括：(1)服务器。用于存储APP所包含的下载文件，包含APP安装文件(实质是APP壳)及H5程序包，可以将不同的H5程序包存放在不同的服务器上，以实现H5程序包的分布式存储，例如将图2中的H5程序包A存储在图1中服务器1上，H5程序包B和H5程序包C存储在服务器2上，H5程序包D和H5程序包E存储在服务器3上等。服务器可以是APP服务提供商所在单位的服务器，若服务器用于存储进行调试的H5程序包时，也可以是调试人员所使用的笔记本或者台式电脑等计算机终端。(2)调试终端。又可以称为测试终端，安装APP的终端设备，模拟生产环境下的使用环境，用于对APP运行是否正常进行测试的终端设备，例如智能手机、平板电脑或者智能手表等安装APP的终端设备。(3)显示终端。用于显示对APP调试过程及结果的计算机设备，例如笔记本电脑或者台式电脑等便于显示调试过程和调试结果的计算机设备。

图1中的各个主体工作过程如下：1)调试终端从服务器上下载APP(本申请实施例中实质下载的是APP壳)，并在调试终端上安装APP。2)调试终端接收电脑等显示终端与自身上所对应的浏览器调试工具的连接，并对所述显示终端及APP进行访问授权。3)调试终端打开APP后，调试终端上的APP从服务器上下载待调试的H5程序包(即APP前端页面所对应的代码)，并运行待调试的H5程序包以对所述H5程序包进行调试，从而通过在模拟的生产环境下显示APP所对应的前端页面，此时显示出的调试效果为在生产环境下访问此页面时的实际页面所对应的显示效果，以判断H5显示是否正常，实现对H5程序包的调试。4)调试终端将对H5程序包的调试过程映射到与调试终端连接的显示终端上，以通过显示终端显示调试结果，便于调试人员对调试结果进行查看及对H5程序包进行修改。

需要说明的是，图1中仅仅示意出智能手机作为调试终端，笔记本电脑或者台式电脑作为显示前端，在实际操作过程中，终端的类型不限于图1中所示，所述终端还可以为智能手表、笔记本电脑或者平板电脑等电子设备，上述APP调试方法的应用场景仅仅用于说明本申请技术方案，并不用于限定本申请技术方案，上述连接关系还可以有其他形式。

请参阅图3，图3是本申请实施例提供的APP调试方法的流程示意图。本申请实施例所描述的APP调试方法，应用于调试终端，所述调试终端为应用所述APP的计算机设备，所述调试终端包括智能手机、平板电脑及各种穿戴设备等安装所述APP以供用户使用所述APP的终端设备，具体应用于调试终端上所配置的所述APP壳框架，所述调试终端上安装所述APP，在本申请实施例中实质安装的是所述APP壳框架。如图3所示，该方法包括以下步骤S301-S303：

S301、通过预设方式获取待调试的所述H5程序包所对应的URL地址。

其中，预设方式包括自动选择方式或者接收用户输入地址的方式，以获取待调试的所述H5程序包所对应的URL地址。URL，指统一资源定位符，英文为Uniform ResourceLocator，缩写为URL，又称为网址，网址格式为：<协议>://<域名或IP>:<端口>/<路径>，其中，<协议>://<域名或IP>是必需的，其中，IP地址，是每个连接到Internet上的主机都会分配一个IP地址，IP地址是用来唯一标识互联网上计算机的逻辑地址，机器之间的访问就是通过IP地址来进行的。可见，URL中包含IP地址。

具体地，调试终端从服务器上下载APP，并安装APP，此处的APP指APP壳。由于APP由原先自带内容改成一个空壳，在空壳中根据获得的URL地址确定服务器后，才自动装载所对应服务器上的H5程序包，服务器上只需要发布H5程序包即可，不需要发布整个APP，即APP提供H5程序包运行的系统框架环境，实现APP所需要的H5程序包全部交由服务器通过单独装载进行处理。其中，调试终端，又可以称为测试终端，是指测试APP所包含的H5程序包运行是否正常的计算机设备，可以为智能终端，例如智能手机、平板电脑或者智能手表等安装APP的终端设备。

其中，通过自动选择方式获取待调试的所述H5程序包所对应的URL地址，是指对APP进行调试时，下载H5程序包的本地服务器地址可以由调试终端自动获取，可以通过打开APP时访问当前局域网活动IP地址，并遍历IP地址，对每个IP地址发送一个获取页面的请求，如果能正常返回，表示此局域网IP开启了本地服务，最后将所有开启了本地服务的IP展示在调试APP上，调试人员需要调试哪个IP地址所对应的服务器上的H5程序包就选择哪个IP，调试终端根据调试人员选择的IP地址，获取待调试的所述H5程序包所对应的IP地址。例如可以是在调试终端打开APP时弹出一组服务器显示列表，调试人员选择服务器，调试终端自动定位至调试人员所选择服务器上的H5程序包所对应的前端页面。接收用户输入地址的方式是指调试设备接收调试人员直接输入待调试的H5程序包所在的服务器的IP地址。由于只需要下载进行调试的H5程序包，并且是动态输入所述H5程序包所对应的服务器地址，因此，H5程序包可以设置在不同的服务器上，H5程序包所在服务器的设置具有灵活性和可选择性，从而便于更改服务器，比如可以新增服务器，实现服务器的扩展，前端代码能够部署到更多的分布式服务器中，后续APP根据设置的IP地址动态选择需要访问的服务器，不会影响到调试效率，亦不会给调试人员对APP调试带来负担。

由于APP壳需要根据H5页面所在的服务器的IP地址装载服务器上的H5程序包，从而访问服务器上的页面，所以在调试终端上打开并进入APP，动态输入需要调试的URL地址，即服务器的域名和对应端口，APP根据输入IP地址动态选择需要访问的服务器，并装载服务器对应H5程序包。

S302、根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中。

具体地，由于URL中包含有所述H5程序包所在服务器所对应的IP地址，调试终端获取待调试的所述H5程序包所对应的URL后，解析所述URL，从所述URL中解析出所述IP地址，根据所述IP地址，从所述IP地址所对应的服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中，以使所述网页视图进一步解析所述H5程序包，对所述H5程序包进行渲染，对所述H5程序包进行渲染的过程，即对所述H5程序包进行调试的过程，以显示出所述H5程序包所对应的网页，从而实现对所述H5程序包的调试。

进一步地，所述根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中的步骤包括：

接收打开所述APP的打开指令；根据所述打开指令，获取所述APP的首页所对应的第一URL；根据所述第一URL，从第一预设服务器上加载所述首页所对应的第一H5程序包；将所述第一H5程序包装载至所述APP壳框架中的网页视图中，以识别所述第一H5程序包中包含的第二URL；根据所述第二URL，从第二预设服务器上加载第二H5程序包；将所述第二H5程序包装载至所述网页视图中，以识别所述第二H5程序包中包含的第三URL；根据所述第三URL，从第三预设服务器上加载第三H5程序包，将所述第三H5程序包装载至所述网页视图中；迭代所述识别所述第一H5程序包中包含的第二URL的步骤，及迭代所述识别所述第二H5程序包中包含的第三URL的步骤，直至识别出所述第一H5程序包中包含的所有URL及识别出所述第二H5程序包中包含的所有URL。

具体地，由于任何一个包含H5的APP应用都是从首页开始通过各种链接跳转到首页面所包含的子页面的，所以对H5程序包的调试可以从该H5程序包的首页开始，装载服务器对应H5开发包首页，然后不断识别页面中的URL进行后续页面调试，直至将页面中的所有URL识别完毕并按照识别的顺序加载且调试完毕。即调试终端接收打开所述APP的打开指令，根据所述打开指令，获取所述APP的首页所对应的第一URL，根据所述第一URL，从第一预设服务器上加载所述首页所对应的第一H5程序包，将所述第一H5程序包装载至所述APP壳框架中的网页视图中，以识别所述第一H5程序包中包含的第二URL，根据所述第二URL，从第二预设服务器上加载第二H5程序包；将所述第二H5程序包装载至所述网页视图中，以识别所述第二H5程序包中包含的第三URL，根据所述第三URL，从第三预设服务器上加载第三H5程序包，将所述第三H5程序包装载至所述网页视图中，迭代所述识别所述第一H5程序包中包含的第二URL的步骤，及迭代所述识别所述第二H5程序包中包含的第三URL的步骤，直至识别出所述第一H5程序包中包含的所有URL及识别出所述第二H5程序包中包含的所有URL。

S303、通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

其中，网页视图，英文为Webview，又可以称为网络视图，能加载并显示网页，可以将其视为一个浏览器，主要用于展示网络请求后的内容，就是将网络地址请求的内容展示在里面。

具体地，开发APP时，开发APP所对应的APP壳框架，所述APP壳框架能够被单独安装，并包含一些系统功能，例如所述APP壳框架包含网页视图，以通过网页视图显示APP中的各个页面。调试终端打开APP后，根据获得的所述URL地址，从所对应的预设服务器上加载下载待调试的H5程序包(即前端代码)，并将所述H5程序包装载至网页视图中，所述网页视图包含于所述APP壳框架，运行待调试的前端代码以对所述待调试的前端代码进行调试。在本申请实施例中，由于APP由原先自带内容改成一个空壳，在空壳中根据接收的URL所包含的IP地址，从IP地址所对应的服务器上加载H5程序包，即APP只提供H5程序包运行的框架环境，APP中其它内容的实现全部交由服务器通过装载进行处理，所以传统技术中是打开APP便开启Webview渲染前端页面，而本申请实施例中是根据选择或输入的服务器IP动态获取服务器地址，再将服务器上H5程序包装载到Webview中后，再进行渲染所述H5程序包所对应的前端页面，此处APP壳装载H5应用主要将H5应用的地址放入APP壳中的Webview中，便可以自动打开并渲染页面。网页渲染的过程大概包括：将H5程序包输入至到HTML解析器，HTML解析器解析，然后构建DOM树，在这期间如果遇到JavaScript代码则交给JavaScript引擎处理；如果来自CSS解析器的样式信息，构建一个内部绘图模型，该模型由布局模块计算模型内部各个元素的位置和大小信息，最后由绘图模块完成从该模型到图像的绘制，完成网页渲染，并将渲染结果显示出来，从而通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果，实现对所述APP调试。

本申请实施例实现APP调试时，由于调试终端为应用所述APP的计算机设备，因而调试人员可以自定义调试终端，在调试终端上安装所述APP后，并且由于H5程序包是单独下载的，因而调试人员可以将所述H5程序包存放在自定义的服务器上，以通过所述H5程序包所对应的URL地址自定义调试页面，并通过所述URL地址将调试终端连接到对应的服务器上，装载所述H5程序包后，通过调试终端运行所述H5程序包所对应的调试页面，即可获得所述H5程序包在调试终端上的实际调试效果。由于H5程序包及服务器均可以灵活的自定义，并且调试终端是APP使用所对应的真实应用环境，因而在调试终端中运行APP来对APP进行调试，可以获得真实而准确的调试效果，相比传统技术中通过浏览器调试APP前端代码，或者通过后台日志和Charles等工具进行调试，面对多款终端设备和各种各样的操作系统及分辨率等多种多种多样的应用环境，能够实现APP前端代码调试的多元化，且能够有效的避免由于不同的机器设备各自所对应的应用环境不同导致的APP前端页面显示效果不一致问题，若APP调试过程中所述H5程序包所对应的APP前端代码存在问题，可以让调试人员可以快速定位问题，能够提高APP调试的简便性、高效性和准确性，能够提升APP前端代码的调试效率。

在一个实施例中，所述APP调试方法所对应的应用环境中还包括显示终端，所述显示终端用于通过映射方式对所述调试终端上所述APP的调试进行显示，所述显示终端为通过映射方式显示调试终端上所述APP的调试过程和调试结果的计算机设备，并可以通过所述显示终端对所述调试结果中的错误进行修改，所述显示终端包括台式电脑或者笔记本电脑，所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之前，还包括：

接收所述显示终端的连接请求；

对所述连接请求进行连接授权以建立与所述显示终端的连接；

所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之后，还包括：

将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，以通过所述显示终端显示所述调试结果。

具体地，由于需要调试的代码会存在两种服务器中，一种是公司的服务器，另一种是调试人员自身的本地服务器(本地服务器指以调试人员自己电脑作为服务器时的服务器，将需要运行的代码存储到自己电脑上，以使所述调试终端从自己电脑上下载所述代码并运行的过程称为本地服务器运行)。当服务器为本地服务器时，可以通过将在调试终端上的调试过程映射至调试人员的本地电脑所对应的显示终端，此时，显示终端包括笔记本电脑或者台式机电脑等调试人员使用的计算机设备，本地服务器开启时，通过APP壳装载本地服务器上的H5页面进行调试，此时将调试信息映射至电脑上，会更容易使调试人员更容易查看调试结果及对调试中的问题进行定位和修改，能够缩短调试过程，从而提高对APP的调试效率。若是公司服务器可以不做映射，直接在调试终端上显示。

进一步地，显示终端通过数据线等方式与调试终端进行连接，例如台式机电脑等显示终端通过数据线访问APP，是通过调试人员电脑上的浏览器访问调试终端上相对应的浏览器调试工具以连接至调试终端上的APP，调试终端接收所述显示终端的连接请求，并对所述连接请求进行连接授权，以建立与所述显示终端的连接，即调试终端接收到所述显示终端的连接请求后，预先在调试终端上授权APP的访问权限，可以通过接收人工点击同意授权的操作指令进行授权，也可以通过设置授权白名单进行自动授权，包括需要调试终端给显示终端授予访问权限以及APP授予调试终端访问权限，只有两个权限授予后，调试终端才能建立与所述显示终端的连接，调试人员的电脑才能直接访问到APP中的页面，调试终端才能将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，进而通过所述显示终端显示所述调试结果。例如将智能手机通过数据线连接至电脑时，安卓手机是利用chrome的设备管理器访问接入设备，IOS手机是利用Safari的开发者模式识别到接入设备。

在一个实施例中，所述对所述连接请求进行连接授权，以建立与所述显示终端的连接的步骤包括：

根据所述连接请求，获取所述显示终端所属计算机设备的设备标识；

判断所述设备标识是否包含于预设授权白名单中；

若所述设备标识包含于所述预设授权白名单中，许可与所述显示终端建立连接。

具体地，可以预先在调试终端中设置APP授权白名单，在所述APP授权白名单中设置允许连接的显示终端所对应的设备标识，调试终端接收到连接请求后，根据所述连接请求，获取所述显示终端所属计算机设备的设备标识，判断所述设备标识是否包含于预设授权白名单中，若所述设备标识包含于所述预设授权白名单中，允许调试终端与所述显示终端建立连接，若所述设备标识未包含于所述预设授权白名单中，拒绝调试终端与所述显示终端建立连接。例如在APP授权白名单配置文件中添加显示终端所对应计算机设备的序列号，若显示终端所对应计算机设备的序列号在APP授权白名单中，允许显示终端与调试终端建立连接，以实现自动完成授权。并且通过配置APP授权白名单后，调试终端上下载APP无需再次授权。

请参阅图4，图4为本申请实施例提供的APP调试方法的一个交互流程示意图。图4中对APP进行调试时，执行主体主要是调试终端上的APP和显示终端上的浏览器。如图4所示，APP内前端代码在动态服务器下的调试过程如下：

1)在调试终端上，从服务器上下载需要进行调试的APP安装文件，此处，所述APP指本申请实施例中的APP壳。2)在调试终端上安装APP。3)接收显示终端的连接，并授予显示终端访问权限，即接收显示终端通过数据线连接，连接至显示终端的浏览器，并授权显示终端访问APP的权限。通过数据线访问APP时需要先给调试终端授权，故先在调试终端上授权APP访问权限，再将调试终端通过数据线连接至电脑，安卓手机利用Chrome的设备管理器访问接入设备，IOS手机利用Safari的开发者模式识别到接入设备。4)打开并进入APP。5)显示终端上的调试工具自动识别连接上的调试终端上的APP，从而可以通过映射显示APP调试过程和调试结果。6)接收调试界面打开指令，接收想要打开的页面地址，以在APP内跳转页面，可以动态输入需要调试的服务器域名和对应端口，APP根据输入内容动态选择需要访问的服务器并装载服务器对应H5开发包首页，可以打开安卓或IOS对应的浏览器调试工具，找到调试设备，通过location.href的方式直接跳转到需要调试的页面。7)调试终端从获得的URL地址所对应的服务器上下载页面地址所对应的H5程序包。8)对下载的H5程序包进行页面渲染以打开页面，即对想要打开的页面进行打开以进行调试，渲染页面以打开页面，并将页面显示的过程即是调试的过程。9)调试过程通过数据线连接映射至显示终端。10)通过显示终端上的浏览器集成的调试工具成显示调试结果。

本申请实施例中，采用调试终端上的APP访问实际页面，并使用显示终端上的浏览器进行调试的方式可以有效的避免机器硬件原因导致的前端页面显示效果不一致问题，同时，还能完整的保留浏览器调试带来的便利性，从而让调试人员可以快速定位问题，找出原因进行修复，提高问题修复的及时性，避免在寻找问题中耗费过多时间，缩短调试过程，提高调试效率。

在一个实施例中，所述根据所述URL地址，从预设服务器上加载所述H5程序包的步骤包括：

根据所述URL地址，从预设服务器集群所包含的服务器上加载所述H5程序包。

具体地，由于只需要下载进行调试的H5程序包，并且是动态输入所述H5程序包所对应的服务器地址，因此，H5程序包所在服务器的设置具有灵活性和可选择性，多个H5程序包可以设置在不同的服务器上，从而实现H5程序包分布式部署在服务器集群中，下载H5程序包时，根据所述URL地址，从预设服务器集群所包含的服务器上加载所述H5程序包。

进一步地，可以修改所述服务器集群，包括更改服务器及新增服务器，以实现H5程序包的灵活部署，能够提高APP调试的便利性和效率。

进一步地，所述从预设服务器上加载所述H5程序包的步骤包括：

从新增服务器上加载所述H5程序包。

具体地，由于只需要下载进行调试的H5程序包，并且是动态输入所述H5程序包所对应的服务器地址，因此，更改所述H5程序包所对应的服务器地址，不会影响对APP的调试，H5程序包可以设置在任意服务器上，比如H5程序包可以设置在新增服务器上，所述APP从新增服务器上加载所述H5程序包。

进一步地，所述新增服务器可以包含于预设服务器集群中，即从预设服务器集群所包含的新增服务器上加载所述H5程序包。比如，H5程序包分布式部署在服务器集群中，在服务器集群中新增服务器，将待调试的H5程序包部署在服务器集群所包含的新增服务器上，以实现对服务器集群的扩展，不会影响对APP的调试，从而可以根据实际需求，从新增的服务器上下载所述H5程序包，即从预设服务器集群所包含的新增服务器上加载所述H5程序包，只需在调试新服务器上的H5程序包时，将新增的服务器域名和端口填入APP中进行调试即可，由于服务器可选择的灵活性，能够提高对APP调试的效率。

在一个实施例中，所述从预设服务器上加载所述H5程序包的步骤包括：

从本地服务器上加载所述H5程序包，所述本地服务器为调试人员自身所用的计算机设备所作为的服务器，所述本地服务器包括台式计算机或者笔记本电脑。

具体地，进行APP调试时，存储H5程序包的服务器，可以是公司的服务器，也可以是将调试人员自身所用的计算机设备所作为服务器，调试人员自身所用的计算机设备所作为服务器，相对于公司的服务器，又可以称为本地服务器，从预设服务器上加载所述H5程序包，即从调试人员自身所用的计算机设备加载所述H5程序包。其中，本地服务器指的是在调试人员自己电脑上搭建的一个服务器环境，在这个服务器中放入H5页面代码所对应的H5程序包，在调试人员自身所适应的电脑上通过浏览器地址访问这个服务器上页面地址即称为访问本地服务器，从而实现通过利用调试人员本地服务器调试的便利又避免电脑浏览器和真实生产环境下的APP存在差异带来的调试不准确问题，提高了对APP调试的准确性、便利性和效率。

进一步地，所述本地服务器可以为预设服务器集群中的一台服务器，即所述本地服务器包含于预设服务器集群中，或者所述本地服务器可以新增服务器，即新增加的服务器为本地服务器，或者所述本地服务器为预设服务器集群中的一台服务器，同时为新增加的服务器，即在预设服务器集群中新增加一台本地服务器，亦即本地服务器为预设服务器集群中所包含的新增服务器。

在一个实施例中，所述显示终端所对应的计算机设备和所述本地服务器为同一台计算机设备。

具体地，调试人员将自身所使用的电脑既当做服务器以存储H5程序包，又当作显示终端以显示从调试终端上映射过来的调试过程和调试结果，从而既便于调试人员定位调试过程中出现的问题，又便于修改调试过程中出现的问题，从而提高调试效率。传统的APP调试过程中，调试人员使用自己的电脑作为服务器，并通过自己电脑上的浏览器访问APP，而且电脑上浏览器也提供了手机页面调试工具，但是电脑毕竟不是手机，APP内的应用通过电脑上的浏览器调试比起真实手机等测试机器上调试相差比较远，而且不同商家的手机使用的浏览器内核版本都会存在差别，而这些差别会导致APP在各种生产环境下的终端运行时会出现错误。因此，通过电脑上的浏览器直接调试APP不能反映APP在生产环境下所对应的真实效果，需要在在生产环境下所对应的真实机器上对APP页面所对应的H5程序包进行调试，才能保证APP页面在生产环境下的良好兼容性。而在本申请实施例中，由于APP运行过程是在调试终端上，并且调试终端装载的是本地服务器的代码，通过利用相同浏览器可跨平台互相访问的特性，将调试终端和用作本地服务器的电脑通过数据线连接，通过相同浏览器将调试终端上的APP运行效果所对应的调试过程映射至电脑上，例如安卓手机上的Chrome和Window电脑上的Chrome通过数据线连接可以让电脑上看到安卓手机上的效果(类似一个扩展屏幕)，就可实现采用APP访问H5程序包所对应的实际页面并使用电脑上的浏览器进行调试。

进一步地，当H5页面在APP壳中渲染出来即可认为下载完成，并在自动执行调试前，对APP壳内装载的指令操作按钮进行触发，从而自动进行调试，将调试过程映射至笔记本电脑或者台式机电脑等显示终端上，显示调试结果。例如可以通过打开安卓或IOS对应的浏览器调试工具，找到识别设备，通过location.href的方式直接跳转到需要调试的页面，调试过程是在智能手机上，通过APP壳内定义的一系列指令进行自动进行调试。其中，调试是指打开每个页面判断是否有错误，执行页面的时候实际会执行页面的JavascrURLt代码，而Js代码执行时如果出现异常，浏览器会自动抛出异常，异常信息中携带了错误类型，位置等一系列信息)，当出现异常时便认为页面有错误，从而实现利用本地服务器的便利性，采用真实调试终端所对应的的硬件设备上的APP访问实际页面，并使用台式机等显示终端上的浏览器进行调试显示的方式，完成对APP的调试，能够提高APP调试的效率。其中，本地服务器便利性是因为本地的服务器运行的就是调试人员自己电脑上的代码，调试人员修改代码后可迅速更新到服务器，十分便利。此时与电脑浏览器关系不大，实际页面还是运行在手机APP内的，只是通过电脑浏览器映射调试终端上的实际运行效果，而且这种采用APP访问实际页面，使用浏览器进行调试的方式，也即APP壳装载页面，利用浏览器映射将调试过程清晰的映射到电脑上，分析调试，可以有效的避免机器硬件原因导致的前端页面显示效果不一致问题的同时，通过本申请实施例的APP内前端代码在动态服务器下的调试方式可以容易找出不同生产环境下的差异，并对H5程序包中的问题进行修复，从而使H5程序包兼容各种机型，还能完整的保留浏览器调试带来的便利性，从而让调试人员可以快速定位问题，找出原因进行修复，做到问题修复的及时性，解决了调试人员定位问题难、定位不准确、处理问题慢等一系列问题，避免在寻找问题中耗费过多时间，提升对APP的调试效率和开发效率。

本申请实施例通过调试终端从服务器上下载APP，并在调试终端上安装APP，调试终端接收电脑等显示终端通过与调试终端上相对应的浏览器调试工具的连接，并对所述显示终端及APP进行访问授权，调试终端打开APP后，调试终端上的APP从获得的URL地址所对应的服务器上下载待调试的前端代码，且该服务器可以根据需要灵活设置，该服务器可以为多台服务器中的一台，并可以实现扩展，并运行待调试的前端代码以对所述待调试的前端代码进行调试，从而通过APP访问实际页面，调试终端将对H5程序包的调试过程映射到与调试终端连接的笔记本电脑或者台式机电脑等显示终端上，以通过显示终端显示调试结果，实现了采用调试终端上的APP访问实际页面，并使用台式机等显示终端上的浏览器进行调试显示的方式，可以有效的避免机器硬件原因导致的前端页面显示效果不一致问题，同时还能完整的保留浏览器调试带来的便利性，从而让调试人员可以快速定位问题，提升APP前端代码的调试效率。

在一个实施例中，所述通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果的步骤之后，还包括：

判断所述调试结果中是否包含异常；

若所述调试结果中包含异常，通过预设全局异常捕获函数捕获所述异常；

通过预设修复函数修复所述异常以完成更新所述H5程序包，并执行所述从本地服务器上加载所述H5程序包的步骤；

迭代所述判断所述调试结果中是否包含异常的步骤，直至所述调试结果中未包含异常。

具体地，H5程序包从服务器上下载完毕后，调试终端上的APP自动执行打开H5程序包中所包含的每个页面进行调试，由于前端页面交互是通过事件来处理的，调试可通过算法读取页面中的各类事件，例如点击的Click事件及获取焦点的Focus事件等，循环执行所有事件以自动调试整个H5程序包，同时，判断H5程序包中所包含的每个页面是否存在异常，若存在异常，将错误等异常抛给预设的全局异常处理函数，全局异常处理函数根据异常再一次读取H5程序包中所包含的代码，读取异常在H5程序包中所对应的异常位置代码，根据所述异常位置代码上报的异常类型，对异常位置所对应的代码进行重写，从而修复出现的异常。例如，当执行某个事件对应的方法时，若出现错误，将错误抛给全局的错误处理函数，错误处理函数在捕获到错误数据后，会将错误信息进行整理，然后自动解决错误，或者提醒调试人员手动解决错误。若是手动解决，异常处理函数跳过此异常，调试人员自己在代码中修改错误。若是自动修复，就利用异常处理函数中定义的异常处理方法进行异常修复，比如，若上报的错误是某个参数未定义，直接在代码段中写入此参数即可。

进一步地，若服务器是本地服务器，且所述显示终端所对应的计算机设备和所述本地服务器为同一台计算机设备，由于调试过程中服务器是调试人员自身本地的计算机设备，因此方便调试人员对调试进行控制，在本地代码(本地代码指的是调试人员自己电脑上开启服务器运行的代码，捕获及修复函数其实就是异常处理函数的拆分，异常处理先要捕获异常，然后对异常修复)中加入全局错误捕获及修复函数，然后采用任务脚本执行一个个页面，由于浏览器发现错误只会简单的抛出异常，要处理这些异常，需要全局捕获函数捕获异常信息，当出现错误便在全局错误捕获方法中分析，以得到前端代码中哪里发生了异常，异常是什么，才能做进一步异常处理，将分析结果交付给修复函数，修复函数直接在源代码中写入代码补丁修复异常，比如说现在H5页面出现了一个错误为某个变量未定义，这时浏览器会抛出一个异常，说代码在哪一行出现了什么异常。此时全局错误捕获方法接收到错误后对错误信息整理，假设得出第三行变量a未定义，将这个消息传给修复函数，修复函数让调试人员选择手动修复还是自动修复。手动修复的话调试人员自己对代码修改进行修复。自动修复APP直接在错误代码前面一行查处a变量定义即可修复此异常。由于此时是将调试人员自己电脑作为服务器，APP中运行的代码是调试人员自己电脑上的代码，这时修改代码后再运行修改后的代码就可以很快捷，修改代码后服务器热更新会自动渲染修改后的新代码。本申请实施例通过将调试人员自身的电脑作为服务器兼显示终端，既能通过本地服务器实现代码的快速修复，又模拟了APP的真实运行环境，并且通过显示终端上的浏览器调试工具进行调试过程调试结果的显示，实现了高效而准确的APP内前端代码在动态服务器下的调试，解决了调试人员定位问题难、定位不准确及处理问题慢等问题，有效提升APP整体开发和修复问题效率。

需要说明的是，上述各个实施例所述的APP调试方法，可以根据需要将不同实施例中包含的技术特征重新进行组合，以获取组合后的实施方案，但都在本申请要求的保护范围之内。

请参阅图5，图5为本申请实施例提供的APP调试装置的一个示意性框图。对应于上述APP调试方法，本申请实施例还提供一种APP调试装置，应用于调试终端，所述调试终端为应用所述APP的计算机设备，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述装置应用于所述APP壳框架，所述调试终端上配置有所述APP壳框架，如图5所示，该APP调试装置包括用于执行上述APP调试方法的单元，该装置可以被配置于智能手机等调试终端所对应的计算机设备中。具体地，请参阅图5，该APP调试装置500包括获取单元501、加载单元502及调试单元503。

其中，获取单元501，用于通过预设方式获取待调试的所述H5程序包所对应的URL地址；

加载单元502，用于根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；

调试单元503，用于通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

在一个实施例中，所述APP调试方法所对应的应用环境中还包括显示终端，所述显示终端用于通过映射方式对所述调试终端上所述APP的调试进行显示，所述APP调试装置500还包括：

接收单元，用于接收所述显示终端的连接请求；

授权单元，用于对所述连接请求进行连接授权，以建立与所述显示终端的连接；

映射单元，用于将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，以通过所述显示终端显示所述调试结果。

在一个实施例中，所述授权单元包括：

第一获取子单元，用于根据所述连接请求，获取所述显示终端所属计算机设备的设备标识；

判断子单元，用于判断所述设备标识是否包含于预设授权白名单中；

许可子单元，用于若所述设备标识包含于所述预设授权白名单中，许可与所述显示终端建立连接。

在一个实施例中，所述加载单元502包括：

接收子单元，用于接收打开所述APP的打开指令；

第二获取子单元，用于根据所述打开指令，获取所述APP的首页所对应的第一URL；

第一加载子单元，用于根据所述第一URL，从第一预设服务器上加载所述首页所对应的第一H5程序包；

第一装载子单元，用于将所述第一H5程序包装载至所述APP壳框架中的网页视图中，以识别所述第一H5程序包中包含的第二URL；

第二加载子单元，用于根据所述第二URL，从第二预设服务器上加载第二H5程序包；

第二装载子单元，用于将所述第二H5程序包装载至所述网页视图中，以识别所述第二H5程序包中包含的第三URL；

第三装载子单元，用于根据所述第三URL，从第三预设服务器上加载第三H5程序包，将所述第三H5程序包装载至所述网页视图中；

迭代子单元，用于迭代所述识别所述第一H5程序包中包含的第二URL的步骤，及迭代所述识别所述第二H5程序包中包含的第三URL的步骤，直至识别出所述第一H5程序包中包含的所有URL及识别出所述第二H5程序包中包含的所有URL。

在一个实施例中，所述APP调试装置500还包括：

判断单元，用于判断所述调试结果中是否包含异常；

捕获单元，用于若所述调试结果中包含异常，通过预设全局异常捕获函数捕获所述异常；

修复单元，用于通过预设修复函数修复所述异常以完成更新所述H5程序包，并执行所述从本地服务器上加载所述H5程序包的步骤；

迭代单元，用于迭代所述判断所述调试结果中是否包含异常的步骤，直至所述调试结果中未包含异常。

需要说明的是，所属领域的技术人员可以清楚地了解到，上述APP调试装置和各单元的具体实现过程，可以参考前述方法实施例中的相应描述，为了描述的方便和简洁，在此不再赘述。

同时，上述APP调试装置中各个单元的划分和连接方式仅用于举例说明，在其他实施例中，可将APP调试装置按照需要划分为不同的单元，也可将APP调试装置中各单元采取不同的连接顺序和方式，以完成上述APP调试装置的全部或部分功能。

上述APP调试装置可以实现为一种计算机程序的形式，该计算机程序可以在如图6所示的计算机设备上运行。

请参阅图6，图6是本申请实施例提供的一种计算机设备的示意性框图。该计算机设备600可以是台式机电脑或者服务器等计算机设备，也可以是其他设备中的组件或者部件。

参阅图6，该计算机设备600包括通过系统总线601连接的处理器602、存储器和网络接口605，其中，存储器可以包括非易失性存储介质603和内存储器604。

该非易失性存储介质603可存储操作系统6031和计算机程序6032。该计算机程序6032被执行时，可使得处理器602执行一种上述APP调试方法。

该处理器602用于提供计算和控制能力，以支撑整个计算机设备600的运行。

该内存储器604为非易失性存储介质603中的计算机程序6032的运行提供环境，该计算机程序6032被处理器602执行时，可使得处理器602执行一种上述APP调试方法。

该网络接口605用于与其它设备进行网络通信。本领域技术人员可以理解，图6中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的计算机设备600的限定，具体的计算机设备600可以包括比图中所示更多或更少的部件，或者组合某些部件，或者具有不同的部件布置。例如，在一些实施例中，计算机设备可以仅包括存储器及处理器，在这样的实施例中，存储器及处理器的结构及功能与图6所示实施例一致，在此不再赘述。

其中，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现APP的功能，所述处理器602用于运行存储在存储器中的计算机程序6032，以实现如下步骤：通过预设方式获取待调试的所述H5程序包所对应的URL地址；根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

在一实施例中，进行APP调试所对应的应用环境中还包括显示终端，所述显示终端用于通过映射方式对所述APP的调试进行显示，所述处理器602在实现所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之前，还实现以下步骤：

接收所述显示终端的连接请求；

对所述连接请求进行连接授权，以建立与所述显示终端的连接；

所述处理器602在实现所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之后，还实现以下步骤：

将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，以通过所述显示终端显示所述调试结果。

在一实施例中，所述处理器602在实现所述对所述连接请求进行连接授权，以建立与所述显示终端的连接的步骤时，具体实现以下步骤：

根据所述连接请求，获取所述显示终端所属计算机设备的设备标识；判断所述设备标识是否包含于预设授权白名单中；若所述设备标识包含于所述预设授权白名单中，许可与所述显示终端建立连接。

在一实施例中，所述处理器602在实现所述根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中的步骤时，具体实现以下步骤：

接收打开所述APP的打开指令；根据所述打开指令，获取所述APP的首页所对应的第一URL；根据所述第一URL，从第一预设服务器上加载所述首页所对应的第一H5程序包；将所述第一H5程序包装载至所述APP壳框架中的网页视图中，以识别所述第一H5程序包中包含的第二URL；根据所述第二URL，从第二预设服务器上加载第二H5程序包；将所述第二H5程序包装载至所述网页视图中，以识别所述第二H5程序包中包含的第三URL；根据所述第三URL，从第三预设服务器上加载第三H5程序包，将所述第三H5程序包装载至所述网页视图中；迭代所述识别所述第一H5程序包中包含的第二URL的步骤，及迭代所述识别所述第二H5程序包中包含的第三URL的步骤，直至识别出所述第一H5程序包中包含的所有URL及识别出所述第二H5程序包中包含的所有URL。

在一实施例中，所述处理器602在实现所述通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果的步骤之后，还实现以下步骤：

判断所述调试结果中是否包含异常；

若所述调试结果中包含异常，通过预设全局异常捕获函数捕获所述异常；

通过预设修复函数修复所述异常以完成更新所述H5程序包，并执行所述从本地服务器上加载所述H5程序包的步骤；

迭代所述判断所述调试结果中是否包含异常的步骤，直至所述调试结果中未包含异常。

应当理解，在本申请实施例中，处理器602可以是中央处理单元(CentralProcessing Unit，CPU)，该处理器602还可以是其他通用处理器、数字信号处理器(DigitalSignal Processor，DSP)、专用集成电路(Application Specific Integrated Circuit，ASIC)、现成可编程门阵列(Field-Programmable GateArray，FPGA)或者其他可编程逻辑器件、分立门或者晶体管逻辑器件、分立硬件组件等。其中，通用处理器可以是微处理器或者该处理器也可以是任何常规的处理器等。

本领域普通技术人员可以理解的是实现上述实施例的方法中的全部或部分流程，是可以通过计算机程序来完成，该计算机程序可存储于一计算机可读存储介质。该计算机程序被该计算机系统中的至少一个处理器执行，以实现上述方法的实施例的流程步骤。

因此，本申请还提供一种计算机可读存储介质。该计算机可读存储介质可以为非易失性的计算机可读存储介质，该计算机可读存储介质存储有计算机程序，该计算机程序被处理器执行时使处理器执行如下步骤：

一种计算机程序产品，当其在计算机上运行时，使得计算机执行以上各实施例中所描述的APP调试方法的步骤。

所述计算机可读存储介质可以是前述设备的内部存储单元，例如设备的硬盘或内存。所述计算机可读存储介质也可以是所述设备的外部存储设备，例如所述设备上配备的插接式硬盘，智能存储卡(Smart Media Card,SMC)，安全数字(Secure Digital,SD)卡，闪存卡(Flash Card)等。进一步地，所述计算机可读存储介质还可以既包括所述设备的内部存储单元也包括外部存储设备。

所属领域的技术人员可以清楚地了解到，为了描述的方便和简洁，上述描述的设备、装置和单元的具体工作过程，可以参考前述方法实施例中的对应过程，在此不再赘述。

所述计算机可读存储介质可以是U盘、移动硬盘、只读存储器(Read-Only Memory，ROM)、磁碟或者光盘等各种可以存储程序代码的计算机可读存储介质。

本领域普通技术人员可以意识到，结合本文中所公开的实施例描述的各示例的单元及算法步骤，能够以电子硬件、计算机软件或者二者的结合来实现，为了清楚地说明硬件和软件的可互换性，在上述说明中已经按照功能一般性地描述了各示例的组成及步骤。这些功能究竟以硬件还是软件方式来执行，取决于技术方案的特定应用和设计约束条件。专业技术人员可以对每个特定的应用来使用不同方法来实现所描述的功能，但是这种实现不应认为超出本申请的范围。

在本申请所提供的几个实施例中，应该理解到，所揭露的装置和方法，可以通过其它的方式实现。例如，以上所描述的装置实施例仅仅是示意性的。例如，各个单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式。例如多个单元或组件可以结合或者可以集成到另一个系统，或一些特征可以忽略，或不执行。

本申请实施例方法中的步骤可以根据实际需要进行顺序调整、合并和删减。本申请实施例装置中的单元可以根据实际需要进行合并、划分和删减。另外，在本申请各个实施例中的各功能单元可以集成在一个处理单元中，也可以是各个单元单独物理存在，也可以是两个或两个以上单元集成在一个单元中。

该集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个存储介质中。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分，或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台电子设备(可以是个人计算机，终端，或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。

以上所述，仅为本申请的具体实施方式，但本申请明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本申请揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本申请的保护范围之内。因此，本申请的保护范围应以权利要求的保护范围为准。

Claims (10)

1.一种APP调试方法，应用于调试终端，所述调试终端为应用所述APP的计算机设备，其特征在于，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述方法应用于所述APP壳框架，所述调试终端上配置有所述APP壳框架，所述方法包括：

通过预设方式获取待调试的所述H5程序包所对应的URL地址；

根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；

通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

2.根据权利要求1所述APP调试方法，其特征在于，所述APP调试方法所对应的应用环境中还包括显示终端，所述显示终端用于通过映射方式对所述调试终端上所述APP的调试进行显示，所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之前，还包括：

接收所述显示终端的连接请求；

对所述连接请求进行连接授权，以建立与所述显示终端的连接；

所述通过所述网页视图渲染所述H5程序包所对应的前端页面的步骤之后，还包括：

将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，以通过所述显示终端显示所述调试结果。

3.根据权利要求2所述APP调试方法，其特征在于，所述对所述连接请求进行连接授权，以建立与所述显示终端的连接的步骤包括：

根据所述连接请求，获取所述显示终端所属计算机设备的设备标识；

判断所述设备标识是否包含于预设授权白名单中；

若所述设备标识包含于所述预设授权白名单中，许可与所述显示终端建立连接。

4.根据权利要求1所述APP调试方法，其特征在于，所述根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中的步骤包括：

接收打开所述APP的打开指令；

根据所述打开指令，获取所述APP的首页所对应的第一URL；

根据所述第一URL，从第一预设服务器上加载所述首页所对应的第一H5程序包；

将所述第一H5程序包装载至所述APP壳框架中的网页视图中，以识别所述第一H5程序包中包含的第二URL；

根据所述第二URL，从第二预设服务器上加载第二H5程序包；

将所述第二H5程序包装载至所述网页视图中，以识别所述第二H5程序包中包含的第三URL；

根据所述第三URL，从第三预设服务器上加载第三H5程序包，将所述第三H5程序包装载至所述网页视图中；

迭代所述识别所述第一H5程序包中包含的第二URL的步骤，及迭代所述识别所述第二H5程序包中包含的第三URL的步骤，直至识别出所述第一H5程序包中包含的所有URL及识别出所述第二H5程序包中包含的所有URL。

5.根据权利要求1所述APP调试方法，其特征在于，所述通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果的步骤之后，还包括：

判断所述调试结果中是否包含异常；

若所述调试结果中包含异常，通过预设全局异常捕获函数捕获所述异常；

通过预设修复函数修复所述异常以完成更新所述H5程序包，并执行所述从本地服务器上加载所述H5程序包的步骤；

迭代所述判断所述调试结果中是否包含异常的步骤，直至所述调试结果中未包含异常。

6.一种APP调试装置，应用于调试终端，所述调试终端为应用所述APP的计算机设备，其特征在于，所述APP预先被开发为APP壳框架及若干个H5程序包，所述H5程序包为实现所述APP功能的独立单元，所述APP壳框架通过装载所述H5程序包来实现所述APP的功能，所述装置应用于所述APP壳框架，所述调试终端上配置有所述APP壳框架，所述装置包括：

获取单元，用于通过预设方式获取待调试的所述H5程序包所对应的URL地址；

加载单元，用于根据所述URL地址，从预设服务器上加载所述H5程序包，并将所述H5程序包装载至所述APP壳框架中的网页视图中；

调试单元，用于通过所述网页视图渲染所述H5程序包所对应的前端页面以对所述H5程序包进行调试，以得到所述H5程序包所对应的调试结果。

7.根据权利要求6所述APP调试装置，其特征在于，所述装置还包括：

接收单元，用于接收所述显示终端的连接请求；

授权单元，用于对所述连接请求进行连接授权，以建立与所述显示终端的连接；

映射单元，用于将对所述H5程序包进行调试的调试过程映射至与自身处于连接状态的所述显示终端，以通过所述显示终端显示所述调试结果。

8.根据权利要求7所述APP调试装置，其特征在于，所述授权单元包括：

第一获取子单元，用于根据所述连接请求，获取所述显示终端所属计算机设备的设备标识；

判断子单元，用于判断所述设备标识是否包含于预设授权白名单中；

许可子单元，用于若所述设备标识包含于所述预设授权白名单中，许可与所述显示终端建立连接。

9.一种计算机设备，其特征在于，所述计算机设备包括存储器以及与所述存储器相连的处理器；所述存储器用于存储计算机程序；所述处理器用于运行所述存储器中存储的计算机程序，以执行如权利要求1-5任一项所述APP调试方法的步骤。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序被处理器执行时使所述处理器执行如权利要求1-5中任一项所述APP调试方法的步骤。

Images