[发明专利]用于调试页面的系统、方法和装置

说明书

本申请实施例公开了用于调试页面的系统、方法和装置。该方法的一具体实施方式包括：通过计算机设备和与计算机设备无线网络连接的移动终端，实现在计算机设备中安装的Chrome开发者工具的元素面板中调试移动端Web页面，而不需要移动终端与计算机设备之间通过有线连接，继而降低了开发调试成本，提高了调试效率。

技术领域

本申请实施例涉及计算机技术领域，具体涉及用于调试页面的系统、方法和装置。

背景技术

随着移动互联网的发展，移动端Web页面作为一个重要的展现形式广泛的应用在各种移动终端上。这里的移动端Web页面包括在移动端应用中的Web页面和移动端浏览器中显示的单纯Web页面。为了便捷的开发和调试移动端web页面，一种常用方法是在计算机设备上安装Chrome开发者工具，将移动终端通过USB(Universal Serial Bus,通用串行总线)数据线连接到计算机设备上，从而完成在Chrome开发者工具的各个面板(比如，源代码面板、控制面板、元素面板、网络面板、应用面板等等)中对移动端Web页面进行调试。然而，当移动终端与计算机设备不在同一场地，或者移动终端不支持USB数据线时就不能再采用这种方法实时调试移动端Web页面了。另外，由于苹果公司的限制，发布在App Store(应用商店)里的应用中不能开启远程调试协议，这就导致不能在计算机设备上利用Chrome开发者工具实现对安装有iOS操作系统(iOS是由苹果公司开发的移动操作系统)的移动终端Web页面进行调试。

发明内容

本申请实施例提出了用于调试页面的系统、方法和装置。

第一方面，本申请实施例提供了一种用于调试页面的系统，包括无线网络连接的设置有显示器的计算机设备和移动终端，其中：所述计算机设备被配置成：响应于检测到针对待调试页面在元素面板的第一调试请求，在所述元素面板打开所述待调试页面，以及将所述待调试页面的文档对象模型DOM树发送给所述移动终端；响应于接收到所述移动终端发送的DOM树，基于所收到的DOM树重新渲染并呈现所述待调试页面；所述移动终端被配置成：响应于接收到所述计算机设备发送的DOM树，基于所收到的DOM树渲染并呈现所述待调试页面；响应于检测到针对所述待调试页面的DOM树更新操作，将更新后的DOM树发送给所述计算机设备。

在一些实施例中，所述计算机设备还被配置成：响应于检测到针对待调试页面在网络面板的第二调试请求，在所述网络面板加载所述待调试页面；

响应于接收到所述移动终端发送的网络请求详情信息，在所述网络面板中显示所收到的网络请求详情信息；以及所述移动终端还被配置成：将与所述待调试页面对应的网络请求详情信息发送给所述计算机设备。

在一些实施例中，所述计算机设备还被配置成：响应于检测到针对所述待调试页面在应用面板的第三调试请求，在所述应用面板中加载所述待调试页面；响应于接收到所述移动终端发送的存储信息数据，在所述应用面板中显示所收到的存储信息数据；以及所述移动终端还被配置成：将与所述待调试页面对应的存储信息数据发送给所述计算机设备。

在一些实施例中，所述计算机设备还被配置成：响应于检测到针对所述待调试页面在源代码面板或者控制面板的第一调试请求，在与所述待调试页面对应的线程中加载并执行所述待调试页面对应的代码，得到执行结果，以及将所得到的执行结果发送给所述移动终端；响应于接收到所述移动终端发送的页面事件信息，在与所述待调试页面对应的线程中基于所收到的页面事件信息执行所述待调试页面对应的代码，得到执行结果，以及将所得到的执行结果发送给所述移动终端；所述移动终端还被配置成：响应于接收到所述计算机设备发送的执行结果，基于所收到的执行结果渲染以及呈现所述待调试页面；响应于检测到用户针对所述待调试页面的操作，生成与所述操作相关的页面事件信息，以及将所生成的页面事件信息发送给所述计算机设备。

在一些实施例中，所述移动终端和所述计算机设备通过套接字进行数据通信。