CN112988599A - 一种页面调试方法、装置、电子设备和存储介质 - Google Patents

Abstract

本申请涉及计算机技术领域，特别涉及云技术领域，公开了一种页面调试方法、装置、电子设备和存储介质，用以获得页面运行的中间状态，其中，方法包括：接收第一设备发送的待调试页面的脚本源码集合，获取第二设备发送的断点指示信息，以及对脚本源码集合进行处理得到目标脚本源码集合，再将目标脚本源码集合和断点指示信息，发送至第一设备，进而将接收的上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试。这样，能够根据实际配置需要，在任意位置中断执行目标脚本源码集合，以获得目标脚本源码集合运行的中间状态，进而能够保证对于待调试页面的调试效果，提高了调试结果的准确性。

Description

一种页面调试方法、装置、电子设备和存储介质

技术领域

本申请涉及计算机技术领域，特别涉及云技术领域，公开了一种页面调试方法、装置、电子设备和存储介质。

背景技术

目前，为保证基于第五版超文本标记语言（Hyper Text Markup Language5，HTML5）开发的页面，能够在移动终端上正常显示，需要对移动终端上的H5页面进行远程调试。

相关技术中，通常采用诸如网页远程审查（Web Inspector Remote，Weinre）等调试技术，在待调试设备上***调试脚本（JavaScript，JS）后，以套接字socket通信方式实现调试设备和移动终端的双向通信，从而实现采用调试设备对移动终端上的H5页面进行调试的目的。

例如，参阅图1所示，其为本申请实相关技术中的调试架构图，调试设备通过socket通信方式，经由本地服务器实现与移动终端的调试交互。

然而，采用诸如Weinre技术对H5页面进行调试时，只能获得运行H5页面后的最终结果，而无法获取移动终端上运行H5页面时的中间状态，这样，会导致在H5页面运行过程中，无法及时发现潜在问题，从而无法及时实现有效调试，进而在一定程度上严重影响调试结果的准确性。

发明内容

本申请实施例提供一种页面调试方法、装置、电子设备和存储介质，用以解决无法在对H5页面进行调试过程中，获取H5页面运行的中间状态的问题。

第一方面，本申请实施例提供的第一种页面调试方法，应用于处理设备，包括：

接收第一设备发送的待调试页面的脚本源码集合，所述脚本源码集合是所述第一设备接收到第二设备发送的所述待调试页面的地址信息后发送的；

将所述脚本源码集合发送至所述第二设备，并获取所述第二设备基于所述脚本源码集合返回的断点指示信息，以及在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合；

将所述目标脚本源码集合和所述断点指示信息，发送至所述第一设备，以使所述第一设备基于所述断点指示信息，上报中断执行所述目标脚本源码集合时的上下文变量信息；

将所述上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试。

可选的，所述接收第一设备发送的待调试页面的脚本源码集合，包括：

接收第二设备发送的调试连接建立请求，获取所述调试连接建立请求中携带的待调试页面的地址信息；

对应所述地址信息生成加密标识信息，并基于所述加密标识信息和所述地址信息生成所述待调试页面的编码信息；

将所述编码信息发送至所述第二设备，以使所述第二设备将所述编码信息发送至第一设备；

接收所述第一设备发送的携带所述加密标识信息的连接建立请求，并基于所述加密标识信息对所述第一设备进行身份验证；

若确定验证通过，则接收所述第一设备发送的所述待调试页面的脚本源码集合。

可选的，所述在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合，包括：

按照所述脚本源码集合中各行脚本源码的编写顺序，依次获取所述各行脚本源码，其中，每获得一行脚本源码，将预设的调试函数添加至所述一行脚本源码中的指定位置；

基于添加有调试函数的每一行脚本源码，生成与所述脚本源码集合对应的目标脚本源码集合。

可选的，所述接收第一设备发送的待调试页面的脚本源码集合之后，还包括：

接收所述第一设备发送的所述待调试页面的文档对象模型和样式数据，并将所述文档对象模型和所述样式数据转发至所述第二设备；

若接收到所述第二设备发送的，在对所述文档对象模型中目标对象进行修改后得到的待更新目标对象，则将所述待更新目标对象发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备；

若接收到所述第二设备发送的，在对所述样式数据中目标数据进行修改后得到的待更新目标数据，则将所述待更新目标数据发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备。

可选的，在接收所述第一设备中断执行所述目标脚本源码集合时上报的上下文变量信息的过程中，包括：

每接收一次所述第一设备上报的上下文变量信息，执行以下操作：

将当前接收的上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试，并显示所述第一设备的中断执行状态；

响应于所述第二设备发送的继续执行所述目标脚本源码集合的指示信息，将所述指示信息发送至所述第一设备，以使所述第一设备继续执行所述目标脚本源码集合。

可选的，完成所述待调试页面的调试后，进一步包括：

根据与所述第二设备之间的各个交互指令，生成能够对待调试页面进行调试的交互指令集合；

将所述交互指令集合发送至所述第二设备，以使所示第二设备参考所述交互指令集合执行其他待调试页面的调试操作。

第二方面，本申请实施例提供的第二种页面调试方法，包括：

接收处理设备发送的待调试页面的脚本源码集合，所述脚本源码集合是将待调试页面的地址信息发送至第一设备后，所述第一设备发送至所述处理设备的；

在所述脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成所述脚本源码集合对应的断点指示信息，以及将所述断点指示信息发送至所述处理设备，以使所述处理设备将所述断点指示信息发送至所述第一设备；

接收所述处理设备发送的上下文变量信息，并显示所述第一设备的中断执行状态，以及基于所述上下文变量信息对所述待调试页面进行调试，其中，所述上下文变量信息是所述第一设备基于所述断点指示信息，中断执行所述脚本源码集合后上报至所述处理设备的。

可选的，所述接收处理设备发送的待调试页面的脚本源码集合，包括：

向处理设备发送调试连接请求，其中，所述调试连接请求中携带有待调试页面的地址信息；

获取所述处理设备基于所述地址信息生成的编码信息，并将所述编码信息发送至第一设备，其中，所述编码信息是所述处理设备对应所述地址信息生成加密标识信息后，基于所述地址信息和所述加密标识信息生成的；

接收所述处理设备发送的所述待调试页面的脚本源码集合，其中，所述脚本源码集合是基于以下操作获得的：在所述处理设备基于所述第一设备发送的，携带所述加密标识信息的连接建立请求，完成对所述第一设备的身份验证后，由所述第一设备将所述脚本源码集合发送至所述处理设备。

可选的，所述接收处理设备发送的待调试页面的脚本源码集合之后，还包括：

接收所述处理设备发送的所述待调试页面的文档对象模型和样式数据；

若对所述文档对象模型中目标对象进行修改，则得到修改后的待更新目标对象后，将所述待更新目标对象发送至所述处理设备，以使所述处理设备将所述待更新目标对象发送至所述第一设备；

若对所述样式数据中目标数据进行修改，则得到修改后的待更新目标数据后，将所述待更新目标数据发送至所述处理设备，以使所述处理设备将所述待更新目标数据发送至所述第一设备。

可选的，所述接收所述处理设备发送的上下文变量信息之后，进一步包括：

向所述处理设备发送继续执行所述目标脚本源码集合的指示信息，以使所述处理设备将所述指示信息发送至所述第一设备，所述指示信息用于指示所述第一设备继续执行所述目标脚本源码集合。

可选的，完成所述待调试页面的调试后，进一步包括：

接收所述处理设备发送的交互指令集合，并基于所述交互指令集合执行其他待调试页面的调试操作。

第三方面，本申请实施例提供的第三种页面调试方法，包括：

接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，以使所述处理设备将所述脚本源码集合发送至所述第二设备；

接收所述处理设备发送的目标脚本源码集合和与所述脚本源码集合对应的断点指示信息，其中，所述目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，所述断点指示信息是所述第二设备基于在所述脚本源码集合中标记的断点位置生成的；

每执行所述目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将所述一行脚本源码的位置与所述断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行所述目标脚本源码集合，并将当前的上下文变量信息发送至所述处理设备。

可选的，所述接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，包括：

接收第二设备发送的编码信息，其中，当所述第二设备将携带有待调试页面的地址信息的调试连接建立请求发送至处理设备后，由所述处理设备基于所述地址信息和对应所述地址信息生成的加密标识信息，生成所述编码信息，并将所述编码信息发送至所述第二设备；

识别所述编码信息，并获取所述编码信息中包括的加密标识信息和待调试页面的地址信息；

向所述处理设备发送携带有所述加密标识信息的连接建立请求，并确定基于所述加密标识信息在所述处理设备上完成身份验证后，将所述待调试页面的脚本源码集合发送至所述处理设备。

可选的，所述将所述待调试页面的脚本源码集合发送至处理设备之后，还包括：

向所述处理设备发送所述待调试页面的文档对象模型和样式数据，以使所述处理设备将所述文档对象模型和所述样式数据转发至所述第二设备；

若接收到所述处理设备发送的待更新目标对象，则基于所述待更新目标对象对所述文档对象模型中对应的对象进行更新，并将更新后的所述文档对象模型和所述样式数据发送至所述处理设备，其中，所述待更新目标对象是所述第二设备基于所述文档对象模型进行修改后，发送至所述处理设备的；

若接收到所述处理设备发送的待更新目标数据，则基于所述待更新目标数据对所述样式数据中对应的内容进行更新，并将更新后的所述文档对象模型和所述样式数据发送至所述处理设备，其中，所述待更新目标数据是所述第二设备基于所述样式数据进行修改后，发送至所述处理设备的。

可选的，所述将当前的上下文变量信息发送至所述处理设备之后，进一步包括：

接收所述处理设备发送的继续执行所述目标脚本源码集合的指示信息，继续执行所述目标脚本源码集合，其中，所述指示信息是所述第二设备发送至所述处理设备的。

第四方面，本申请实施例提供的第一种页面调试装置，包括：

第一接收单元，用于接收第一设备发送的待调试页面的脚本源码集合，所述脚本源码集合是所述第一设备接收到第二设备发送的所述待调试页面的地址信息后发送的；

获取单元，用于将所述脚本源码集合发送至所述第二设备，并获取所述第二设备基于所述脚本源码集合返回的断点指示信息，以及在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合；

第一发送单元，用于将所述目标脚本源码集合和所述断点指示信息，发送至所述第一设备，以使所述第一设备基于所述断点指示信息，上报中断执行所述目标脚本源码集合时的上下文变量信息；

第二发送单元，将所述上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试。

可选的，所述接收第一设备发送的待调试页面的脚本源码集合时，所述接收单元用于：

接收第二设备发送的调试连接建立请求，获取所述调试连接建立请求中携带的待调试页面的地址信息；

对应所述地址信息生成加密标识信息，并基于所述加密标识信息和所述地址信息生成所述待调试页面的编码信息；

将所述编码信息发送至所述第二设备，以使所述第二设备将所述编码信息发送至第一设备；

接收所述第一设备发送的携带所述加密标识信息的连接建立请求，并基于所述加密标识信息对所述第一设备进行身份验证；

若确定验证通过，则接收所述第一设备发送的所述待调试页面的脚本源码集合。

可选的，所述在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合时，所述获取单元用于：

按照所述脚本源码集合中各行脚本源码的编写顺序，依次获取所述各行脚本源码，其中，每获得一行脚本源码，将预设的调试函数添加至所述一行脚本源码中的指定位置；

基于添加有调试函数的每一行脚本源码，生成与所述脚本源码集合对应的目标脚本源码集合。

可选的，所述接收第一设备发送的待调试页面的脚本源码集合之后，所述获取单元还用于：

接收所述第一设备发送的所述待调试页面的文档对象模型和样式数据，并将所述文档对象模型和所述样式数据转发至所述第二设备；

若接收到所述第二设备发送的，在对所述文档对象模型中目标对象进行修改后得到的待更新目标对象，则将所述待更新目标对象发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备；

若接收到所述第二设备发送的，在对所述样式数据中目标数据进行修改后得到的待更新目标数据，则将所述待更新目标数据发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备。

可选的，在接收所述第一设备中断执行所述目标脚本源码集合时上报的上下文变量信息的过程中，所述第一发送单元用于：

每接收一次所述第一设备上报的上下文变量信息，执行以下操作：

将当前接收的上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试，并显示所述第一设备的中断执行状态；

响应于所述第二设备发送的继续执行所述目标脚本源码集合的指示信息，将所述指示信息发送至所述第一设备，以使所述第一设备继续执行所述目标脚本源码集合。

可选的，完成所述待调试页面的调试后，进一步包括第一处理单元，所述第一处理单元用于：

根据与所述第二设备之间的各个交互指令，生成能够对待调试页面进行调试的交互指令集合；

将所述交互指令集合发送至所述第二设备，以使所示第二设备参考所述交互指令集合执行其他待调试页面的调试操作。

第五方面，本申请实施例提供的第二种页面调试装置，包括：

第二接收单元，接收处理设备发送的待调试页面的脚本源码集合，所述脚本源码集合是将待调试页面的地址信息发送至第一设备后，所述第一设备发送至所述处理设备的；

生成单元，在所述脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成所述脚本源码集合对应的断点指示信息，以及将所述断点指示信息发送至所述处理设备，以使所述处理设备将所述断点指示信息发送至所述第一设备；

调试单元，接收所述处理设备发送的上下文变量信息，并显示所述第一设备的中断执行状态，以及基于所述上下文变量信息对所述待调试页面进行调试，其中，所述上下文变量信息是所述第一设备基于所述断点指示信息，中断执行所述脚本源码集合后上报至所述处理设备的。

可选的，所述接收处理设备发送的待调试页面的脚本源码集合时，所述第二接收单元用于：

向处理设备发送调试连接请求，其中，所述调试连接请求中携带有待调试页面的地址信息；

获取所述处理设备基于所述地址信息生成的编码信息，并将所述编码信息发送至第一设备，其中，所述编码信息是所述处理设备对应所述地址信息生成加密标识信息后，基于所述地址信息和所述加密标识信息生成的；

接收所述处理设备发送的所述待调试页面的脚本源码集合，其中，所述脚本源码集合是基于以下操作获得的：在所述处理设备基于所述第一设备发送的，携带所述加密标识信息的连接建立请求，完成对所述第一设备的身份验证后，由所述第一设备将所述脚本源码集合发送至所述处理设备。

可选的，所述接收处理设备发送的待调试页面的脚本源码集合之后，所述第二接收单元还用于：

接收所述处理设备发送的所述待调试页面的文档对象模型和样式数据；

若对所述文档对象模型中目标对象进行修改，则得到修改后的待更新目标对象后，将所述待更新目标对象发送至所述处理设备，以使所述处理设备将所述待更新目标对象发送至所述第一设备；

若对所述样式数据中目标数据进行修改，则得到修改后的待更新目标数据后，将所述待更新目标数据发送至所述处理设备，以使所述处理设备将所述待更新目标数据发送至所述第一设备。

可选的，所述接收所述处理设备发送的上下文变量信息之后，所述调试单元进一步用于：

向所述处理设备发送继续执行所述目标脚本源码集合的指示信息，以使所述处理设备将所述指示信息发送至所述第一设备，所述指示信息用于指示所述第一设备继续执行所述目标脚本源码集合。

可选的，完成所述待调试页面的调试后，进一步包括第二处理单元，所述第二处理单元用于：

接收所述处理设备发送的交互指令集合，并基于所述交互指令集合执行其他待调试页面的调试操作。

第六方面，本申请实施例提供的第三种页面调试装置，包括：

第三接收单元，接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，以使所述处理设备将所述脚本源码集合发送至所述第二设备；

第四接收单元，接收所述处理设备发送的目标脚本源码集合和与所述脚本源码集合对应的断点指示信息，其中，所述目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，所述断点指示信息是所述第二设备基于在所述脚本源码集合中标记的断点位置生成的；

匹配单元，每执行所述目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将所述一行脚本源码的位置与所述断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行所述目标脚本源码集合，并将当前的上下文变量信息发送至所述处理设备。

可选的，所述接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备时，所述第三接收单元用于：

接收第二设备发送的编码信息，其中，当所述第二设备将携带有待调试页面的地址信息的调试连接建立请求发送至处理设备后，由所述处理设备基于所述地址信息和对应所述地址信息生成的加密标识信息，生成所述编码信息，并将所述编码信息发送至所述第二设备；

识别所述编码信息，并获取所述编码信息中包括的加密标识信息和待调试页面的地址信息；

向所述处理设备发送携带有所述加密标识信息的连接建立请求，并确定基于所述加密标识信息在所述处理设备上完成身份验证后，将所述待调试页面的脚本源码集合发送至所述处理设备。

可选的，所述将所述待调试页面的脚本源码集合发送至处理设备之后，所述第三接收单元还用于：

向所述处理设备发送所述待调试页面的文档对象模型和样式数据，以使所述处理设备将所述文档对象模型和所述样式数据转发至所述第二设备；

若接收到所述处理设备发送的待更新目标对象，则基于所述待更新目标对象对所述文档对象模型中对应的对象进行更新，并将更新后的所述文档对象模型和所述样式数据发送至所述处理设备，其中，所述待更新目标对象是所述第二设备基于所述文档对象模型进行修改后，发送至所述处理设备的；

若接收到所述处理设备发送的待更新目标数据，则基于所述待更新目标数据对所述样式数据中对应的内容进行更新，并将更新后的所述文档对象模型和所述样式数据发送至所述处理设备，其中，所述待更新目标数据是所述第二设备基于所述样式数据进行修改后，发送至所述处理设备的。

可选的，所述将当前的上下文变量信息发送至所述处理设备之后，所述匹配单元进一步用于：

接收所述处理设备发送的继续执行所述目标脚本源码集合的指示信息，继续执行所述目标脚本源码集合，其中，所述指示信息是所述第二设备发送至所述处理设备的。

第七方面，本申请实施例中提供一种电子设备，其包括至少一个处理器和至少一个存储器，其中，所述存储器存储有程序代码，当所述程序代码被所述处理器执行时，使得所述至少一个处理器能够执行本申请实施例提供的页面调试方法。

第八方面，本申请实施例提供一种计算机可读存储介质，其包括程序代码，当程序产品在电子设备上运行时，所述程序代码用于使所述电子设备执行权利本申请实施例提供的页面调试方法。

本申请有益效果如下：

由于本申请实施例中，接收第一设备发送的待调试页面的脚本源码集合后，处理设备在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，得到处理后的目标脚本源码集合，使得在后续执行目标脚本源码集合时，能够根据实际配置需要，在任意位置中断执行目标脚本源码集合，以获得目标脚本源码集合运行的中间状态，进而能够保证对于待调试页面的调试效果，提高了调试结果的准确性。另外，在页面调试过程中，处理设备作为第一设备和第二设备之间通信传输的中间环节，分别与第一设备和第二设备建立了传输通道，使得相关数据能够借助于公共网络实现远程传输，进而实现了对于第一设备上的待调试页面的远程调试。

附图说明

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

图1为本申请实相关技术中的调试架构图；

图2a为本申请实施例中应用场景示意图；

图2b为本申请实施例中显示在第一设备上的页面示意图；

图2c为本申请实施例中显示在第二设备230上的页面示意图；

图3a为本申请实施例中处理设备执行页面调试的流程示意图；

图3b为本申请实施例中接收第一设备发送的待调试页面的脚本源码集合的流程示意图；

图3c为本申请实施例中获得目标脚本源码集合的流程示意图；

图3d为本申请实施例中添加有断点的脚本源码集合示意图；

图3e为本申请实施例中目标脚本源码集合示意图；

图3f为本申请实施例中接收第一设备上报的上下文信息后的操作示意图；

图4a为本申请实施例中第二设备在页面调试过程中的操作流程示意图；

图4b为本申请实施例中第二设备输入待调试页面的地址信息的示意图；

图4c为本申请实施例中第二设备获得处理设备发送的脚本源码集合的流程示意图；

图4d为本申请实施例中显示编码信息的页面示意图；

图4e为本申请实施例中在脚本源码集合中标记断点示意图；

图5a为本申请实施例中第一设备在页面调试过程中的操作流程示意图；

图5b为本申请实施例中发送脚本源码集合的流程示意图；

图6a为本申请实施例中页面调试过程的交互时序图；

图6b为本申请实施例中接收待调试数据及实时显示页面截图的时序图；

图7为本申请实施例提供的页面调试装置的逻辑结构示意图；

图8为本申请实施例提供的页面调试装置的逻辑结构示意图；

图9为本申请实施例提供的页面调试装置的逻辑结构示意图；

图10为应用本申请实施例的一种电子设备的一个硬件组成结构示意图；

图11为本申请实施例中的一个计算装置的结构示意图。

具体实施方式

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

下面对本申请实施例中涉及的部分概念进行介绍。

脚本源码集合：是指待调试页面的全部脚本源码的总称，本申请实施例中，脚本源码集合中至少包括对应待调试页面的全部脚本（JavaScript，JS）源码。

断点指示信息：用于指示在脚本源码中标记的断点的位置，用于记录标记的断点所在的文件及行号。

断点：是指在某一行代码的指定位置标记的中断运行的标志。

抽象语法树（Abstract Syntax Tree，AST）：用于对代码进行分析，生成树结构的形式。

HTML5：简称H5，是构建Web（World Wide Web，万维网）内容的一种语言描述方式。HTML5是互联网的下一代标准，是构建以及呈现互联网内容的一种语言方式，被认为是互联网的核心技术之一。

本申请涉及云技术（Cloud technology）领域，其中，云技术是指在广域网或局域网内将硬件、软件、网络等系列资源统一起来，实现数据的计算、储存、处理和共享的一种托管技术。

云技术（Cloud technology）基于云计算商业模式应用的网络技术、信息技术、整合技术、管理平台技术、应用技术等的总称，可以组成资源池，按需所用，灵活便利。云计算技术将变成重要支撑。技术网络***的后台服务需要大量的计算、存储资源，如视频网站、图片类网站和更多的门户网站。伴随着互联网行业的高度发展和应用，将来每个物品都有可能存在自己的识别标志，都需要传输到后台***进行逻辑处理，不同程度级别的数据将会分开处理，各类行业数据皆需要强大的***后盾支撑，只能通过云计算来实现。

下面对本申请实施例的设计思想进行简要介绍：

相关技术中，在对待调试页面进行调试时，通常采用诸如Weinre等调试技术，以实现通过调试设备对远端的移动终端进行调试。这样，需要保证调试设备、本地服务器，以及移动终端处于同一局域网下，且在调试过程中，只能获得移动终端上执行待调试页面的脚本源码集合后的最终结果，而无法在移动终端上执行待调试页面的脚本源码集合时的中间状态，获取相应的上下文信息，使得执行脚本源码集合过程中的潜在问题无法被及时发现，极大的影响了调试结果的准确性。

有鉴于此，本申请实施例中，调试服务器借助于公共网络，分别建立与调试设备和被调试的移动终端的通信连接，避免了现有技术下仅能在局域网内实现页面调试的弊端，且调试服务器在接收移动终端发送的待调试页面的脚本源码集合后，将脚本源码集合包含的各行脚本源码分别添加至对应的调试函数中，得到处理后的目标脚本源码集合，使得在后续执行目标脚本源码集合时，能够根据实际配置需要，在任意位置中断执行目标脚本源码集合，以获得目标脚本源码集合运行的中间状态，进而能够保证对于待调试页面的调试效果，提高了调试结果的准确性。

以下结合说明书附图对本申请的优选实施例进行说明，应当理解，此处所描述的优选实施例仅用于说明和解释本申请，并不用于限定本申请，并且在不冲突的情况下，本申请中的实施例及实施例中的特征可以相互组合。

参阅图2a所示，其为本申请实施例中应用场景示意图。该应用场景中包括第一设备210、处理设备220，以及第二设备230，可通过第一设备210打开页面211，以及可以通过第二设备230打开网页页面231，第一设备210与处理设备220之间，可以采用网页套接字websocket的方式进行信息交互，以及处理设备220与第二设备230之间，可以采用websocket的方式进行交互，以及第二设备上可能存在有多个功能模块，用于对获得的待调试数据进行调试、编辑控制台指令、查看网络信息等操作，第一设备中可能内置有JS脚本软件开发工具包（JavaScript Software Development Kit，JS SDK），用于执行调试过程中的操作。

本申请实施例中，第一设备210为被调试的移动终端，该被调试的移动终端中的待调试页面可以是H5页面，该移动终端可以是个人计算机、手机、平板电脑、笔记本、电子阅读器等设备，第一设备210可以借助于Socket双向通信的方式与处理设备220进行通信，在一种可选的实施方式中，通信网络可以是有线网络或无线网络，因此第一设备210与处理设备220可以通过有线或无线通信方式进行直接或间接连接。

页面211呈现在第一设备210上，参阅图2b所示，其为本申请实施例中显示在第一设备上的页面示意图，图2b中仅是示意性的列出了能够呈现在页面211上的内容，图2b所示意的页面呈现在移动端时，可以以弹窗的形式呈现，并呈现不同的功能菜单，使得通过触发相应的功能菜单，对应的显示第二设备发送的聊天信息的聊天区域，或者，显示当前调试连接状态的区域，或者，显示控制台console区域，以显示对于处理设备发送的指令的执行结果。

需要说明的是，本申请实施例中，处理设备220不参与第一设备210与第二设备230之间的待调试页面的地址信息的传输过程，但调试过程中，第一设备210发送的信息，必须经由处理设备220发送至第二设备230，同理，第二设备230发送的信息，必须经由处理设备220发送至第一设备210。

处理设备220，为调试服务器，该处理设备可以是独立的物理服务器，也可以是多个物理服务器构成的服务器集群或者分布式***，还可以是提供云服务、云数据库、云计算、云函数、云存储、网络服务、云通信、中间件服务、域名服务、安全服务、CDN、以及大数据和人工智能平台等基础云计算服务的云服务器。

第二设备230，为调试者所在的调试设备，该调试设备可以是个人计算机、平板电脑、笔记本等能够实现调试功能的电子设备，在调试过程中，第二设备230可以借助于通信网络与处理设备220进行通信，进而将交互信息经由处理设备220发送至第一设备210。

网页页面231呈现在第二设备230上，参阅图2c所示，其为本申请实施例中显示在第二设备230上的页面示意图，在该网页页面中，包括输入待调试页面的地址信息的输入框，以及显示当前连接状态的指示信息，如图2c所示意的，当前处于第一步开始调试的阶段。

需要说明的是，本申请实施例中，对应图2b和2c所示意的网页页面，在调试过程中存在调试平台应用，第一设备210和第二设备230上分别安装有相应的调试平台应用。不同权限的账户在调试平台应用的网页页面上完成登录后，呈现的页面完全不同，如，被调试账户在第一设备210上登录调试平台应用后，呈现如图2b所示意的网页页面，但无法与处理设备220建立通信连接；调试账户在第二设备230上登录调试平台应用后，完成与处理设备220之间的认证鉴权，并建立与处理设备220之间的通信连接，呈现图2c所示意的网页页面。其中，存在多个为调试平台应用提供服务的服务器，包括在调试过程中参与调试数据的转发和处理的处理设备220，以及为第一设备210和第二设备230之间提供其他信息交互的其他服务器。

本申请实施例中，对于提出的页面调试方法，可以应用于H5页面的远程调试场景中，在调试过程中，第一设备与处理设备之间、第二设备与处理设备之间，经由公共网络实现远程通信连接，第二设备上安装有用于进行H5页面调试的调试平台应用，使得调试人员在登录调试平台应用完成身份验证后，可以发起对于H5页面的调试连接建立请求，进而，处理设备将从第一设备接收的H5页面的待调试数据发送至第二设备，在第二设备上完成相关的调试操作，第二设备将调试过程中的指令信息和修改后的数据，经由处理设备发送至第一设备，以进行同步的显示呈现。

这样，在页面调试过程中，处理设备220作为第一设备210和第二设备230之间通信传输的中间环节，分别与第一设备210和第二设备230建立了传输通道，使得相关数据能够借助于公共网络实现远程传输，进而实现了对于第一设备上的待调试页面的远程调试，同时，考虑到相同地址信息的待调试页面在不同的第一设备中的呈现可能存在差异，在针对第一设备中的待调试页面进行调试时，基于第一设备运行时产生的数据进行相应的调试操作，能够有效保证调试的有效进行。

本申请一些可能的实施例中，对于页面调试的方法可以应用于测试场景中，进而实现对第二设备上的页面的远程测试，相关的处理操作类似，本申请在此不再赘述。

在一种可能的应用场景中，为了便于降低通信时延，可以在各个地区部署处理设备220，或为了负载均衡，可以由不同的处理设备220分别去服务各个第一设备210、第二设备230对应的地区。多个处理设备220以通过区块链实现数据的共享，多个处理设备220相当于多个服务器组成的数据共享***。例如第一设备210位于地点a，与处理设备220之间进行通信连接，第二设备230位于地点b，与其他处理设备220之间通信连接。

对于数据共享***中的每个处理设备220，均具有与该处理设备220对应的节点标识，数据共享***中的每个处理设备220均可以存储有数据共享***中其他处理设备220的节点标识，以便后续根据其他处理设备220的节点标识，将生成的区块广播至数据共享***中的其他处理设备220。每个处理设备220中可维护一个如下表所示的节点标识列表，将处理设备220名称和节点标识对应存储至该节点标识列表中。其中，节点标识可为网络之间互联的协议（InternetProtocol，IP）地址以及其他任一种能够用于标识该节点的信息，表1中仅以IP地址为例进行说明。

表1

下面结合上述描述的应用场景，参考附图来描述本申请示例性实施方式提供的对象轨迹识别方法，需要注意的是，上述应用场景仅是为了便于理解本申请的精神和原理而示出，本申请的实施方式在此方面不受任何限制。

下面结合附图，对本申请实施例中进行页面调试的流程进行说明：

参阅附图3a所示，其为本申请实施例中处理设备执行页面调试的流程示意图。下面结合附图3a，对处理设备执行页面调试的过程进行详细说明。

步骤301：处理设备接收第一设备发送的待调试页面的脚本源码集合，脚本源码集合是第一设备接收到第二设备发送的待调试页面的地址信息后发送的。

本申请实施例中，在第二设备将待调试页面的地址信息发送至第一设备之后，处理设备接收第一设备发送的待调试页面的脚本源码集合，其中，脚本源码集合中至少包括待调试页面的JS源码，待调试页面可以是H5页面。

需要说明的是，本申请实施例中，为保证处理设备与第一设备之间的安全交互，处理设备可以在接收到第一设备发送的脚本源码集合之前，对第一设备进行鉴权，以验证第一设备是否具有访问处理设备的权限。

在执行步骤301时，参阅附图3b，其为本申请实施例中接收第一设备发送的待调试页面的脚本源码集合的流程示意图，下面结合附图3b具体进行说明。

步骤3011：处理设备接收第二设备发送的调试连接建立请求，获取调试连接建立请求中携带的待调试页面的地址信息。

具体实施时，处理设备接收第二设备在意图对待调试页面进行调试时，发送的待调试页面的连接建立请求，并获取连接建立请求中携带的待调试页面的地址信息。

步骤3012：处理设备对应地址信息生成加密标识信息，并基于加密标识信息和地址信息生成待调试页面的编码信息。

具体实施时，处理设备接收第二设备发送的待调试页面的地址信息后，对应待调试页面的地址信息生成加密标识信息，其中，加密标识信息可以是随机生成的动态标识码，或者，可以是基于诸如当前的时间、会话标识（Identity，ID）生成的标识码。

需要说明的是，处理设备在生成加密标识信息时，也可以采用已有的验证码生成机制，生成能够用以验证第一设备的身份的加密标识信息，本申请在此不对生成加密标识信息的方式进行具体限定。

本申请一些可能的实施例中，处理设备生成加密标识信息后，可以针对加密标识信息设置关联的有效时长，并启动定时器进行倒计时，并到定时结束后删除对于加密标识信息的记录，使得只能在有效时长范围内，接收其他待验证设备发送的请求。

进而，处理设备基于加密标识信息和待调试页面的地址信息，生成待调试页面的编码信息，其中，编码信息具体可以是二维码、条形码，或者其他形式的可识别信息。

步骤3013：处理设备将编码信息发送至第二设备，以使第二设备将编码信息发送至第一设备。

处理设备对应待调试页面生成编码信息后，将编码信息发送至第二设备，以使第二设备将编码信息发送至第一设备。

需要说明的是，本申请实施例中，处理设备在对第一设备进行身份验证之前，无法直接向第一设备发送信息，故只能将生成的编码信息发送至第二设备，经由第二设备将编码信息发送至第一设备，其中，在调试过程中，第一设备与第二设备无法直接交互，且在调试之前，处理设备不参与第一设备与第二设备之间的交互。

步骤3014：处理设备接收第一设备发送的携带加密标识信息的连接建立请求，并基于加密标识信息对第一设备进行身份验证。

具体实施时，处理设备接收第一设备发送的携带加密标识信息的连接建立请求，并将接收的加密标识信息与对应待调试页面的地址信息生成的加密标识信息进行比对，获得对于加密标识信息的比对结果，并将获得的比对结果作为第一设备的身份验证结果。

步骤3015：处理设备判定第一设备身份验证是否通过，若是，执行步骤3016，否则，执行步骤3017。

处理设备确定获得的加密标识信息与保存的加密标识信息匹配成功，则判定第一设备身份验证通过，否则，判定第一设备身份验证不通过。

步骤3016：处理设备接收第一设备发送的待调试页面的脚本源码集合。

具体实施时，处理设备确定第一设备验证通过后，接受第一设备的连接建立请求，并接收第一设备发送的待调试页面的脚本源码集合。

步骤3017：处理设备拒绝第一设备发送的连接建立请求。

这样，处理设备通过生成的加密标识信息，能够对第一设备进行身份验证，保证了与第一设备之间信息交互的安全性，使得后续接收第一设备发送的调试数据的过程安全可靠，相当于建立了与第一设备之间安全的加密调试通道，一定程度上保证了第一设备的信息安全。

步骤302：处理设备将脚本源码集合发送至第二设备，并获取第二设备基于脚本源码集合返回的断点指示信息，以及在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合。

具体实施中，在执行步骤302时，参阅图3c所示，其为本申请实施例中获得目标脚本源码集合的流程示意图，下面结合附图3c，对获得目标脚本源码集合的流程进行说明：

步骤3021、处理设备将获得的脚本源码集合发送至第二设备。

步骤3022、处理设备接收第二设备基于脚本源码集合返回的断点指示信息。

处理设备在将获得的脚本源码集合发送至第二设备后，接收第二设备基于源码集合返回的断点指示信息，其中，断点指示信息用于指示断点的位置，用于表示断点所在的文件名以及对应的行数。

例如，获取地址信息为：http://webdebug.xx.com/demo/sdkSide/index.html的H5页面的JS源码后，将JS源码发送至第二设备，获得第二设备反馈的文件形式的断点指示信息，其中，断点指示信息对应的文件可以是对象简谱（JavaScript Object Notation，JSON）类型的文件，包括断点对应的文件名和断点行号。

又例如，参阅图3d所示，其为本申请实施例中添加有断点的脚本源码集合示意图，基于图3d所示意的断点的位置，处理设备得到的断点指示信息中包括以下内容：文件X-第二行、文件X-第四行、文件Y-第一行，以及文件Y-第二行。

步骤3023、处理设备在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合。

处理设备在基于脚本源码集合生成目标脚本源码集合时，按照脚本源码集合中各行脚本源码的编写顺序，依次获取各行脚本源码，其中，每获得一行脚本源码，将预设的调试函数添加至该行脚本源码中的指定位置，该指定位置可以是该行脚本源码之前或之后。

需要说明的是，本申请实施例中，一行脚本源码对应一个预设的调试函数，不同行的脚本源码中的指定位置添加的预设的调试函数可以相同。

例如，假设存在调试函数X，可以分别在每一行脚本源码前添加预设的调试函数X。

又例如，假设处理设备获得的一行脚本源码为：

var a = 1；//定义了一个变量a，并赋值为1

则将获得的一行脚本源码前添加预设的调试函数后，得到形如以下示意的目标脚本源码，其中下述伪代码仅为示意性说明：

withDebugger("/test.js"，X，isDebuggerStatement)； var a = 1；//withDebugger是预设的调试函数，用于判定/test.js文件中的第X行中，是否存在断点。

{//表示调试函数withDebugger的函数体的开始

var withBreakPoint = Breakpoints[file][line]||isDebuggerStatement；//当前行是否有断点或为debugger语句

if 有断点；

sendXHR()；//判断当前执行的一行目标脚本源码存在断点时，向处理设备发送携带上下文变量信息的XHR请求。

listenToXHR()；//监听xhr请求响应，收到响应继续执行目标脚本源码

else直接执行代码；

}//表示调试函数withDebugger的函数体的结束

需要说明的是，在判断当前执行的目标脚本源码前是否存在断点，是根据与当前执行的目标脚本源码对应的脚本源码集合中的行数作为判断依据的，以实现与断点指示信息相对应。

进而，处理设备基于添加有调试函数的每一行脚本源码，生成与脚本源码集合对应的目标脚本源码集合。

例如，参阅图3e所示，其为本申请实施例中目标脚本源码集合示意图，处理设备获得的脚本源码集合中，可能包含多个文件，每个文件中分别包括多行脚本源码，进而将每一个文件中的每一行脚本源码的指定位置，分别添加预设的调试函数，获得与脚本源码集合对应的目标脚本源码集合。

需要说明的是，本申请实施例中，对于步骤3021、步骤3022，以及步骤3023的操作顺序灵活，在本申请一些可能的实施例中，可以先执行步骤3023，再执行步骤3021和步骤3022；在本申请另一些可能的实施例中，可以先执行步骤3021，然后执行步骤3023，再执行步骤3022。

这样，处理设备重写了脚本源码集合中每一行脚本源码，生成目标脚本源码集合，使得每一行脚本源码对应目标脚本源码，与指定位置添加有预设的调试函数的脚本源码相对应，使得每一行目标脚本源码被执行之前或之后都会执行断点的判定语句，以便后续根据实际配置需要，实现在任意位置中断执行目标脚本源码。

步骤303：处理设备将目标脚本源码集合和断点指示信息，发送至第一设备，以使第一设备基于断点指示信息，上报中断执行目标脚本源码集合时的上下文变量信息。

处理设备对应脚本源码集合生成目标脚本源码集合，并获取第二设备发送的断点指示信息后，将目标脚本源码集合和断点指示信息发送至第一设备，以使第一设备在执行目标脚本源码集合时，在断点指示信息指示的每一个断点位置处，中断执行目标脚本源码集合，并上报中断指定目标脚本源码集合时的上下文变量信息。

步骤304：处理设备将上下文变量信息发送至第二设备，以使第二设备基于上下文变量信息对待调试页面进行调试。

处理设备接收第一设备发送的上下文变量信息后，将获得的上下文变量信息发送至第二设备，以使第二设备基于获得的上下文变量信息对待调试页面进行调试。

具体的，参阅图3f所示，其为本申请实施例中接收第一设备上报的上下文信息后的操作示意图。处理设备在执行步骤304时，在接收第一设备中断执行目标脚本源码集合时上报的上下文变量信息的过程中，每接收一次第一设备上报的上下文变量信息，执行以下操作：

步骤3041：处理设备将当前接收的上下文变量信息发送至第二设备，以使第二设备基于上下文变量信息对待调试页面进行调试，并显示第一设备的中断执行状态。

处理设备将当前接收的上下文变量信息发送至第二设备，以使第二设备基于上下文变量信息对待调试页面进行调试，并在第二设备上显示第一设备的中断状态。

步骤3042：处理设备响应于第二设备发送的继续执行目标脚本源码集合的指示信息，将指示信息发送至第一设备，以使第一设备继续执行目标脚本源码集合。

当第二设备发起继续执行目标脚本源码集合的指示信息后，处理设备响应于第二设备发送的继续执行目标脚本源码集合的指示信息，并将该指示信息发送至第一设备，以使第一设备继续执行目标脚本源码集合。

这样，处理设备在第一设备和第二设备之间建立了实时通信的传输通路，能够将第一设备上报的上下文变量信息发送至第二设备，以及能够接收第二设备发送的指示信息，指示第一设备继续执行目标脚本源码集合，保证了调试过程中数据的安全传输。

需要说明的是，本申请实施例中，处理设备在调试过程中从第一设备接收的待调试数据不限于待调试页面的脚本源码集合，还可能包括有文档对象模型（Document ObjectModel，DOM）、样式数据、网络请求、存储数据、设备环境数据，以及全局变量数据等待调试数据，其中，样式数据具体可以是层叠样式表（Cascading Style Sheets，CSS），存储数据具体可以是储存在用户本地终端上的数据（Cookie）、局部存储数据LocalStorage，以及会话存储述SessionStorge等等。

处理设备接收第一设备主动或被动发送的各类待调试数据，并将各类调试信息发送至第二设备上进行调试，其中，处理设备可以在接收其他待调试数据之后，接收待调试页面的脚本源码集合，也可以在接收其他调试信息之前，接收待调试页面的脚本源码集合。由于包括待调试页面的脚本源码集合在内的，各类调试信息之间相互独立，故可以根据实际配置需要配置接收各类待调试数据的先后顺序，本申请在此不做具体限定。

下面的叙述中将仅以接收第一设备发送的待调试页面的脚本源码集合之后，处理设备对待调试数据中的文档对象模型和样式数据的调试过程为例，进行示意性说明。

处理设备接收第一设备发送的待调试页面的文档对象模型和样式数据，并将文档对象模型和样式数据转发至第二设备。进而，针对第二设备发送的不同反馈数据，处理设备针对性的进行相应的处理，具体的，可能存在以下两种情况。

情况一、处理设备接收第二设备发送的，对文档对象模型中目标对象进行修改后得到的待更新目标对象。

具体实施时，处理设备接收到第二设备发送的，在对文档对象模型中目标对象进行修改后得到的待更新目标对象时，将待更新目标对象发送至第一设备。

进而，处理设备根据第一设备反馈的更新后的文档对象模型和样式数据，生成待调试页面的页面截图，并将页面截图发送至第二设备，其中，处理设备可以采用预设的绘图工具，基于更新后的文档对象模型和样式数据，得到待调试页面的页面截图，绘图工具可以是能够基于文档对象模型和样式数据生成页面的工具，如，画布canvas系列的绘图工具，具体如html2canvas等等。

情况二、处理设备接收第二设备发送的，对样式数据中的目标数据进行修改后得到的待更新目标数据。

具体实施时，处理设备接收到第二设备发送的，在对样式数据中目标数据进行修改后得到的待更新目标数据，则将待更新目标数据发送至第一设备。

进而，根据第一设备反馈的更新后的文档对象模型和样式数据，生成待调试页面的页面截图，并将页面截图发送至第二设备，其中，生成页面截图的工具可以与情况一中的工具相同，在此不再赘述。

这样，处理设备基于得到的更新后的文档对象模型和样式数据，得到对应的页面截图后，将页面截图发送至第二设备上显示，使得第二设备上能够实时预览修改后的文档对象模型或样式数据的呈现效果，能够辅助对待调试页面进行调试，保证对于文档对象模型和样式数据的调试效果。

本申请一些可能的实施例中，在完成待调试页面的调试后，处理设备可以根据与第二设备之间的各个交互指令，生成能够对待调试页面进行调试的交互指令集合，进而将交互指令集合发送至第二设备，以使所示第二设备参考交互指令集合执行其他待调试页面的调试操作。

具体实施时，处理设备可以记录在对待调试页面进行调试的整个过程中，接收的第二设备发送的全部指令信息，并基于获得的全部指令信息生成对应的交互指令集合，进而将生成的交互指令集合发送至第二设备，以供第二设备在对其他待调试页面调试时进行参考。

需要说明的是，本申请实施例中，处理设备将交互指令集合发送至第二设备交互指令集合，以供第二设备进行参考使用时，可以以功能模块的形式***第二设备中，以使第二设备在使用功能模块时可以自动的发起相应的调试指令。

这样，处理设备通过整合交互指令集合，使得能够实现调试功能的交互指令集合具有可移植性，有利于调试功能的***化和规则化，有助于简化调试过程的复杂度，保证待调试页面的调试效果。

基于同一发明构思，参阅图4a所示，其为本申请实施例中第二设备在页面调试过程中的操作流程示意图，下面结合附图4a，对本申请实施例中，第二设备执行页面调试的过程进行说明：

步骤401：第二设备接收处理设备发送的待调试页面的脚本源码集合，脚本源码集合是将待调试页面的地址信息发送至第一设备后，第一设备发送至处理设备的。

本申请一些可能的实施例中，第二设备向第一设备发送待调试页面的地址信息后，接收处理设备发送的待调试页面的脚本源码集合，其中，脚本源码集合是第一设备接收到待调试页面的地址信息后，将待调试页面的脚本源码集合发送至处理设备的。

例如，参阅图4b所示，其为本申请实施例中第二设备输入待调试页面的地址信息的示意图，第二设备在图4b所示意的网页页面中，前方标注有“调试链接”字样的输入框中，输入待调试页面的地址信息，地址信息的内容为：http://webdebug.xx.com/demo/sdkSide/index.html，进而触发向第一设备发送该地址信息，并接收第一设备将该地址信息对应的待调试页面的脚本源码集合发送至处理设备后，由处理设备发送的脚本源码集合。

本申请一些可能的实施例中，为了保证第一设备与处理设备之间的安全交互，第二设备可以协助处理设备实现对第一设备的身份验证。

下面结合附图，对存在对于第一设备的身份验证的情况下，第二设备接收待调试页面的脚本源码集合的过程进行说明：

参阅附图4c所示，其为本申请实施例中第二设备获得处理设备发送的脚本源码集合的流程示意图，下面结合附图4c，对接收处理设备发送的待调试页面的脚本源码集合的过程进行详细说明：

步骤4011：第二设备向处理设备发送调试连接请求，其中，调试连接请求中携带有待调试页面的地址信息。

例如，继续参阅图4b所示，第二设备在图4b所示意的网页页面中输入待调试页面的地址信息后，点击触发下一步的操作，第二设备向处理设备发送携带有待调试页面的地址信息的调试连接建立请求。

步骤4012：第二设备获取处理设备基于地址信息生成的编码信息，并将编码信息发送至第一设备，其中，编码信息是处理设备对应地址信息生成加密标识信息后，基于地址信息和加密标识信息生成的。

第二设备获取处理设备发送的编码信息后，将编码信息呈现在网页页面上，并将编码信息发送至第一设备，其中，编码信息可以是二维码、条形码，或者其他形式的可识别信息。

需要说明的是，本申请实施例中，第二设备向第一设备发送编码信息传输过程，不涉及处理设备的参与，在调试过程中，第二设备与第一设备之间的指令信息和待调试数据，全部都经由处理设备进行转发或处理。

例如，参阅图4d所示，其为本申请实施例中显示编码信息的页面示意图。第二设备在图4d所示意的网页页面中输入待调试页面的地址信息后，点击下一步，则触发将该地址信息发送至处理设备，并得到处理设备基于该地址信息生成的二维码，并呈现在图4d所示意的网页页面中。

步骤4013：第二设备接收处理设备发送的待调试页面的脚本源码集合。

第二设备将编码信息发送至第一设备之后，接收处理设备发送的待调试页面的脚本源码集合，其中，脚本源码集合是基于以下操作获得的：在处理设备基于第一设备发送的，携带加密标识信息的连接建立请求，完成对第一设备的身份验证后，由第一设备将脚本源码集合发送至处理设备。

这样，第二设备得到的脚本源码集合，是在处理设备对第一设备进行身份验证成功后发送的，相当于经由处理设备建立了与第一设备之间的双向传输通道，能够实现调试过程中的待调试数据的安全传输。

步骤402：第二设备在脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成脚本源码集合对应的断点指示信息，以及将断点指示信息发送至处理设备，以使处理设备将断点指示信息发送至第一设备。

具体实施时，第二设备接收处理设备发送的脚本源码集合后，根据实际的处理需要，在脚本源码集合中标记各个断点位置，进而基于标记完成后的各个断点所在的文件名和行数，生成与脚本源码集合对应的断点指示信息，并将生成的断点指示信息经由处理设备发送至第一设备。

需要说明的是，本申请实施例中，断点指示信息可以以JSON文件的形式存在，具体包括有断点所在的脚本源码文件，以及断点所在的脚本源码文件中的行数。

例如，参阅图4e，其为本申请实施例中在脚本源码集合中标记断点示意图，第二设备根据实际处理需要，在图4e所示意的脚本源码集合中的指定位置标记断点，进而得到与脚本源码集合对应的断点指示信息。其中，图4e中示意了第二设备（调试设备）与处理设备的连接状态，以及示意了第一设备（被调试的移动终端）与处理设备的连接状态，以及示意了第一设备的网络类型等信息。

步骤403：第二设备接收处理设备发送的上下文变量信息，并显示第一设备的中断执行状态，以及基于上下文变量信息对待调试页面进行调试，其中，上下文变量信息是第一设备基于断点指示信息，中断执行脚本源码集合后上报至处理设备的。

具体实施时，第二设备将断点指示信息经由处理设备发送至第一设备后，接收由处理设备转发的上下文变量信息，并显示当第一设备中断执行目标脚本源码集合的指示信息，其中，上下文变量信息是经由处理设备转发的，当第一设备执行至断点指示信息指示的断点位置处发送的上下文变量信息，其中，上下文变量信息可以是第一设备中断执行目标脚本源码集合时对应的环境变量信息。

本申请实施例中，第二设备可以根据实际的需要决定第一设备的执行状态，当第一设备中断执行目标脚本源码集合时，第二设备可以控制第一设备是否继续执行目标脚本源码集合。

具体的，第二设备接收处理设备发送的上下文变量信息之后，向处理设备发送继续执行目标脚本源码集合的指示信息，以使处理设备将指示信息发送至第一设备，指示信息用于指示第一设备继续执行目标脚本源码集合。

这样，第二设备在根据实际需要配置断点指示信息后，能够获得第一设备在执行目标脚本源码集合至标记有断点的位置时，上报的上下文变量信息，也就是获得了第一设备运行目标脚本源码集合时的中间状态，使得后续能够基于上下文变量信息对第一设备上的待调试页面进行调试时，能够实现精准调试，一定程度上提高了调试结果的准确性。而且，第二设备能够根据实际需要，经由处理设备指示第一设备是否继续执行目标脚本源码集合，使得调试过程的可控性很强，有助于对第一设备上的待调试页面进行准确调试。

需要说明的是，在调试第一设备上的待调试页面的过程中，可能存在包括脚本源码集合在内的多类待调试数据，诸如文档对象模型、样式数据、网络请求、存储数据、设备环境数据，以及全局变量数据等等。

对于其他待调试数据的获取，本申请一些可能的实施例中，第二设备可以主动发起获取请求，以获得处理设备转发的待调试数据，如，第二设备发送控制台指令。本申请另一些可能的实施例中，可以由第一设备主动上报至处理设备，并接收处理设备发送的待调试数据。

本申请实施例中，由于各类待调试数据之间彼此独立，故本申请不具体限定各类待调试数据的获取时机。

下面的叙述中将仅以第二设备接收处理设备发送的待调试页面的脚本源码集合之后，对文档对象模型和样式数据进行调试的过程为例，进行说明：

第二设备在接收待调试页面的脚本源码之后，可以接收处理设备发送的待调试页面的文档对象模型和样式数据，其中，第二设备在对文档对象模型和样式数据进行处理时，分为以下两种情况：

情况A、第二设备对文档对象模型中目标对象进行修改后得到待更新目标对象。

具体实施时，处理设备对文档对象模型中目标对象进行修改，得到修改后的待更新目标对象，进而将待更新目标对象发送至处理设备，以使处理设备将待更新目标对象发送至第一设备。

情况B、第二设备对样式数据中的目标数据进行修改后得到待更新目标数据。

具体实施时，处理设备对样式数据中目标数据进行修改，得到修改后的待更新目标数据，进而将待更新目标数据发送至处理设备，以使处理设备将待更新目标数据发送至第一设备。

需要说明的是，由于文档对象模型和样式数据是相互独立的待调试数据，且与待调试页面的呈现效果相对应，故本申请实施例中，为了使第二设备在进行调试时能够直观的看到调试后的待调试页面在第一设备上的呈现效果，可以接收处理设备处理得到的页面截图，并将页面截图呈现在网页页面上，其中，页面截图可以是实时呈现在第二设备的网页页面上的，第二设备对影响待调试页面在第一设备上的呈现效果的待调试数据进行修改后，同时触发对于页面截图的刷新操作，或者，第二设备可以设置页面截图的刷新周期，周期性的请求处理设备基于从第一设备处获得的文档对象模型和样式数据，重新生成页面截图，并呈现最新生成的页面截图，生成页面截图的方式已经在上述叙述中详细说明，在此不再赘述。

本申请一些可能的实施例中，当处理设备基于调试过程中的交互操作，生成交互指令集合时，第二设备可以接收处理设备发送的交互指令集合，并基于交互指令集合执行其他待调试页面的调试操作。

这样，第二设备在对其他第一设备上的待调试页面进行调试时，可以参考交互指令集合中的指令进行操作，使得能够将调试操作规范化，有助于调试过程的有效进行。

基于同一发明构思，参阅图5a所示，其为本申请实施例中第一设备在页面调试过程中的操作流程示意图，下面结合附图5a，对本申请实施例中，第一设备在页面调试过程中的操作进行说明：

步骤501：第一设备接收第二设备发送的待调试页面的地址信息，并将待调试页面的脚本源码集合发送至处理设备，以使处理设备将脚本源码集合发送至第二设备。

具体实施时，第一设备在接收到第二设备发送的待调试页面的地址信息后，将待调试页面的脚本源码集合发送至处理设备，使得处理设备将该脚本源码集合发送至第一设备，其中，处理设备的地址可以是预先配置给第一设备的，或者，处理设备的地址可以由相关人员在第一设备上输入。

需要说明的是，本申请实施例中，第一设备中可以预先内置有JS SDK，该JS SDK用于与处理设备、第二设备之间实现待调试页面的调试，且该JS SDK中可以保存有处理设备的地址，用以基于该地址向处理设备发送信息。

本申请一些可能的实施例中，为了保证与处理设备之间的安全传输，第一设备在将待调试页面的脚本源码集合发送至处理设备之前，可以先通过处理设备的身份验证。

参阅图5b所示，其为本申请实施例中发送脚本源码集合的流程示意图，下面集合附图5b，对发送脚本源码集合的流程进行说明：

步骤5011：第一设备接收第二设备发送的编码信息，其中，当第二设备将携带有待调试页面的地址信息的调试连接建立请求发送至处理设备后，由处理设备基于地址信息和对应地址信息生成的加密标识信息，生成编码信息，并将编码信息发送至第二设备。

第一设备接收第二设备发送的编码信息，其中，编码信息可以是二维码、条形码，或者其他可识别信息，编码信息的生成过程已将在前述的说明中进行了详细说明，在此将不再赘述。

需要说明的是，本申请实施例中，第一设备接收第二设备发送编码信息时，编码数据的传输不经过处理设备。

例如，参阅图2b所示意的，为实现对于待调试页面的调试，可以安装调试平台应用，第一设备在登录调试平台应用后，能够在聊天交互页面上接收第二设备发送的编码信息。

步骤5012：第一设备识别编码信息，并获取编码信息中包括的加密标识信息和待调试页面的地址信息。

具体实施时，第一设备接收编码信息后，识别该编码信息，并获取该编码信息中包括的加密标识信息和待调试页面的地址信息。

例如，假设编码信息为二维码信息，第一设备可以采用诸如浏览器中识别二维码的方式，识别二维码信息，得到该二维码信息中包括的加密标识信息和待调试页面的地址信息。

步骤5013：第一设备向处理设备发送携带有加密标识信息的连接建立请求，并确定基于加密标识信息在处理设备上完成身份验证后，将待调试页面的脚本源码集合发送至处理设备。

具体实施时，第一设备获得加密标识信息和待调试页面的地址信息后，向处理设备发送携带有加密标识信息的连接建立请求，以实现基于该加密标识信息在处理设备上完成身份验证。进而在完成身份验证后，将该地址信息对应的待调试页面的脚本源码集合，发送至处理设备。

这样，第一设备在基于加密标识信息在处理设备上完成身份验证后，才会将待调试的脚本源码集合发送至处理设备，保证了调试过程的安全进行。

步骤502：第一设备接收处理设备发送的目标脚本源码集合和与脚本源码集合对应的断点指示信息，其中，目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，断点指示信息是第二设备基于在脚本源码集合中标记的断点位置生成的。

第一设备将待调试页面的脚本源码集合发送至处理设备后，接收处理设备将该脚本源码集合中的各行脚本源码的指定位置，分别添加预设的调试函数后获得的目标调试脚本源码，以及接收处理设备转发的第二设备生成的断点指示信息，其中，目标调试脚本集合和断点指示信息的生成，已经在上述的内容中进行详细说明，在此不再赘述。

步骤503：第一设备每执行目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将一行脚本源码的位置与断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行目标脚本源码集合，并将当前的上下文变量信息发送至处理设备。

第一设备接收目标脚本源码集合后，每执行与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将该脚本源码在脚本源码集合中的位置，与断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行该行目标脚本源码，以及目标脚本源码集合中后续的目标脚本源码，并上报当前中断运行状态下的上下文变量信息至处理设备。

这样，借助于处理设备处理得到的目标脚本源码集合，以及用于指示中断位置的中断指示信息，第一设备能够在任意指定的中断位置处，中断执行目标脚本源码集合，并上报对应的中断运行状态下的上下文变量信息，使得能够上报运行目标脚本源码时的中间状态，使得调试过程中能够得到中间状态的信息，一定程度上提高了页面调试的准确性。

进而，第一设备接收处理设备发送的继续执行目标脚本源码集合的指示信息，继续执行目标脚本源码集合，其中，指示信息是第二设备发送至处理设备的。

本申请实施例中，第一设备中断执行目标脚本源码集合后，待接收到继续执行目标脚本源码集合的指示信息后，继续执行该目标脚本源码集合，其中，指示第一设备继续执行目标脚本源码的指令是第二设备发起，由处理设备转发的。

这样，对于调试过程中的被调试的移动终端（第一设备）和调试设备（第二设备）来说，第二设备可以控制调试过程的进展，经由处理设备间接指示第一设备对于目标脚本源码集合的执行，使得调试过程更加灵活。

需要说明的是，本申请实施例中，对于第一设备上的待调试页面来说，存在有包括脚本源码集合在内的多类待调试数据，且各类待调试数据之间相互独立，第一设备将各类待调试数据发送至处理设备的顺序很灵活。

下面将以第一设备将待调试页面的脚本源码集合发送至处理设备之后，发送文档对象模型和样式数据为例，对第一设备发送其它类型的待调试数据的过程进行说明。

第一设备向处理设备发送待调试页面的文档对象模型和样式数据，以使处理设备将文档对象模型和样式数据转发至第二设备。

本申请一些可能的实施例中，第一设备接收到处理设备发送的待更新目标对象时，基于待更新目标对象对文档对象模型中对应的对象进行更新，并将更新后的文档对象模型和样式数据发送至处理设备，其中，待更新目标对象是第二设备基于文档对象模型进行修改后，发送至处理设备的。

本申请另一些可能的实施例中，第一设备接收到处理设备发送的待更新目标数据时，基于待更新目标数据对述样式数据中对应的内容进行更新，并将更新后的述文档对象模型和样式数据发送至处理设备，其中，待更新目标数据是第二设备基于样式数据进行修改后，发送至处理设备的。

这样，第一设备能够接收修改后的文档对象模型和样式数据，进而完成相应内容的更新，保证了调试过程的有效进行。

基于同一发明构思，参阅图6a所示，其为本申请实施例中页面调试过程的交互时序图。下面结合附图6a，对本申请实施例中进行页面调试时，被调试的移动终端(第一设备)、调试设备（第二设备），以及调试服务器（处理设备）之间的交互流程进行说明。

步骤601：调试设备将待调试页面的URL发送至调试服务器。

调试设备获取待调试页面的统一资源定位信息（Uniform Resource Locator，URL），并将URL信息发送送至调试服务器。

步骤602：调试服务器基于URL和加密标识信息，生成编码信息。

具体实施时，调试服务器为获得的待调试页面的地址信息，生成加密标识信息，记为token，进而调试服务器基于URL和token生成编码信息，其中，编码信息可以是二维码、条形码，或者其他可识别的信息。

步骤603：调试服务器将编码信息发送至调试设备。

步骤604：调试设备将编码信息发送至被调试的移动终端。

需要说明的是，本申请实施例中，调试设备将编码信息发送至待调试设备时，调试服务器不参与编码信息的传输过程。

步骤605：被调试的移动终端向调试服务器发送携带加密标识信息的websocket请求。

具体实施时，待调试设备扫描编码信息获得加密标识信息后，待调试设备内部的JS SDK在检测到加密标识信息后，发起与待调试设备的网页套接字websocket通信。

步骤606：调试服务器基于加密标识信息对被调试的移动终端进行身份验证。

步骤607：调试服务器向待调试设备发送建立websocket通信的连接指示。

步骤608：被调试的移动终端将URL对应的页面的脚本源码集合发送至调试服务器。

步骤609：调试服务器将URL对应的页面的脚本源码集合发送至调试设备。

步骤610：调试服务器将脚本源码集合重写为目标脚本源码集合。

具体实施时，调试服务器通过AST源码分析，将每一行脚本源码分别添加至对应的一个调试函数中，进而基于添加有脚本源码的各个调试函数，得到重写后的目标脚本源码集合。

步骤611：调试服务器将重写后的目标脚本源码集合发送至被调试的移动终端。

步骤612：调试设备将断点指示信息发送至调试服务器。

具体实施时，相关人员在调试设备上，根据实际的处理需要。在脚本源码集合中各个对应的位置添加断点后，调试设备生成对应脚本源码集合的断点指示信息，用于记录各个断点所在的文件及行号。

步骤613：调试服务器将断点标识信息发送至被调试的移动终端。

步骤614：被调试的移动终端读取断点指示信息，并执行目标脚本源码集合。

步骤615：待调试设备将终端执行目标脚本源码集合时的局部变量发送至调试服务器。

具体实施时，待调试设备执行重写后的目标脚本源码集合，其中，每执行一行目标脚本源码，与内存中的断点指示信息进行匹配，若确定匹配成功，则向调试服务器发送一个同步（XMLHttpRequest，XHR）请求，并中断执行目标脚本源码集合，以及发送当前上下文局部变量至调试服务器，其中，XHR请求是一种创建异步 JavaScript 和 XML（AsynchronousJavascript And XML，AJAX）请求的JavaScript API，它提供了在浏览器和服务器之间的发送请求的能力。反之，若匹配不成功则继续读取目标脚本源码集合。

步骤616：待调试服务器将中断执行目标脚本源码集合时的局部变量发送至调试设备。

本申请实施例中，调试服务器收到待调试设备发送的XHR请求之后，则在调试设备上显示当前待调试设备处于运行中断状态，并显示局部变量，以及等待接收继续运行目标脚本源码集合的指令。

步骤617：调试设备将继续执行目标脚本源码集合的指令发送至调试服务器。

步骤618：调试服务器将继续执行目标脚本源码集合的指令发送至待调试设备。

基于同一发明构思，参阅图6b所示，其为本申请实施例中接收待调试数据及实时显示页面截图的时序图。

步骤1：调试设备将待调试数据获取指令发送至调试服务器。

需要说明的是，调试数据获取指令具体可以是编辑的控制台指令，或者，可以是基于对部分内容的修改和调试所触发的操作。

步骤2：调试服务器将待调试数据获取指令发送至被调试的移动终端。

步骤3：调试设备将相应的待调试数据发送至调试服务器。

需要说明的是，本申请实施例中，待调试数据可以是网络请求、DOM结构、cookie数据、设备环境信息，以及脚本源码集合等等。

步骤4、调试服务器将待调试数据发送至调试设备。

步骤5：调试设备将修改后的文本对象模型或样式数据发送至调试服务器。

步骤6：调试服务器将修改后的文本对象模型或样式数据发送至被调试的移动终端。

步骤7：被调试的移动终端将最新的文本对象模型和样式数据发送致调试服务器。

需要说明的是，对于步骤7的执行来说，被调试的移动终端可以是响应于由处理设备转发的，调试设备发送的页面刷新请求，进行的相关操作。

步骤8：调试服务器基于最新的文本对象模型和样式数据，绘制页面截图。

步骤9：调试服务器将页面截图发送至调试设备。

基于同一的发明构思，本申请实施例还提供了一种页面调试装置，用于上述装置解决问题的原理与处理设备侧的页面调试方法相同，因此上述装置的实施可以参见方法的实施，重复之处不再赘述。

参阅图7所示，其本申请实施例提供的一种页面调试装置的逻辑结构示意图，页面调试装置700可以包括：

第一接收单元701，用于接收第一设备发送的待调试页面的脚本源码集合，脚本源码集合是第一设备接收到第二设备发送的待调试页面的地址信息后发送的；

获取单元702，用于将脚本源码集合发送至第二设备，并获取第二设备基于脚本源码集合返回的断点指示信息，以及在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合；

第一发送单元703，用于将目标脚本源码集合和断点指示信息，发送至第一设备，以使第一设备基于断点指示信息，上报中断执行目标脚本源码集合时的上下文变量信息；

第二发送单元704，将上下文变量信息发送至第二设备，以使第二设备基于上下文变量信息对待调试页面进行调试。

可选的，接收第一设备发送的待调试页面的脚本源码集合时，接收单元701用于：

接收第二设备发送的调试连接建立请求，获取调试连接建立请求中携带的待调试页面的地址信息；

对应地址信息生成加密标识信息，并基于加密标识信息和地址信息生成待调试页面的编码信息；

将编码信息发送至第二设备，以使第二设备将编码信息发送至第一设备；

接收第一设备发送的携带加密标识信息的连接建立请求，并基于加密标识信息对第一设备进行身份验证；

若确定验证通过，则接收第一设备发送的待调试页面的脚本源码集合。

可选的，在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合时，获取单元702用于：

按照脚本源码集合中各行脚本源码的编写顺序，依次获取各行脚本源码，其中，每获得一行脚本源码，将预设的调试函数添加至一行脚本源码中的指定位置；

基于添加有调试函数的每一行脚本源码，生成与脚本源码集合对应的目标脚本源码集合。

可选的，接收第一设备发送的待调试页面的脚本源码集合之后，获取单元702还用于：

接收第一设备发送的待调试页面的文档对象模型和样式数据，并将文档对象模型和样式数据转发至第二设备；

若接收到第二设备发送的，在对文档对象模型中目标对象进行修改后得到的待更新目标对象，则将待更新目标对象发送至第一设备，并根据第一设备反馈的更新后的文档对象模型和样式数据，生成待调试页面的页面截图，并将页面截图发送至第二设备；

若接收到第二设备发送的，在对样式数据中目标数据进行修改后得到的待更新目标数据，则将待更新目标数据发送至第一设备，并根据第一设备反馈的更新后的文档对象模型和样式数据，生成待调试页面的页面截图，并将页面截图发送至第二设备。

可选的，在接收第一设备中断执行目标脚本源码集合时上报的上下文变量信息的过程中，第一发送单元703用于：

每接收一次第一设备上报的上下文变量信息，执行以下操作：

将当前接收的上下文变量信息发送至第二设备，以使第二设备基于上下文变量信息对待调试页面进行调试，并显示第一设备的中断执行状态；

响应于第二设备发送的继续执行目标脚本源码集合的指示信息，将指示信息发送至第一设备，以使第一设备继续执行目标脚本源码集合。

可选的，完成待调试页面的调试后，进一步包括第一处理单元，第一处理单元705用于：

根据与第二设备之间的各个交互指令，生成能够对待调试页面进行调试的交互指令集合；

将交互指令集合发送至第二设备，以使所示第二设备参考交互指令集合执行其他待调试页面的调试操作。

基于同一发明构思，本申请实施例还提供了一种页面调试装置，由于上述装置解决问题的原理与第二设备侧的页面调试方法相似，因此上述装置的实施可以参见方法的实施，重复之处不再赘述。

参阅图8所示，其为本申请实施例提供的页面调试装置的逻辑结构示意图，页面调试装置800可以包括：

第二接收单元801，接收处理设备发送的待调试页面的脚本源码集合，脚本源码集合是将待调试页面的地址信息发送至第一设备后，第一设备发送至处理设备的；

生成单元802，在脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成脚本源码集合对应的断点指示信息，以及将断点指示信息发送至处理设备，以使处理设备将断点指示信息发送至第一设备；

调试单元803，接收处理设备发送的上下文变量信息，并显示第一设备的中断执行状态，以及基于上下文变量信息对待调试页面进行调试，其中，上下文变量信息是第一设备基于断点指示信息，中断执行脚本源码集合后上报至处理设备的。

可选的，接收处理设备发送的待调试页面的脚本源码集合时，第二接收单元801用于：

向处理设备发送调试连接请求，其中，调试连接请求中携带有待调试页面的地址信息；

获取处理设备基于地址信息生成的编码信息，并将编码信息发送至第一设备，其中，编码信息是处理设备对应地址信息生成加密标识信息后，基于地址信息和加密标识信息生成的；

接收处理设备发送的待调试页面的脚本源码集合，其中，脚本源码集合是基于以下操作获得的：在处理设备基于第一设备发送的，携带加密标识信息的连接建立请求，完成对第一设备的身份验证后，由第一设备将脚本源码集合发送至处理设备。

可选的，接收处理设备发送的待调试页面的脚本源码集合之后，第二接收单元801还用于：

接收处理设备发送的待调试页面的文档对象模型和样式数据；

若对文档对象模型中目标对象进行修改，则得到修改后的待更新目标对象后，将待更新目标对象发送至处理设备，以使处理设备将待更新目标对象发送至第一设备；

若对样式数据中目标数据进行修改，则得到修改后的待更新目标数据后，将待更新目标数据发送至处理设备，以使处理设备将待更新目标数据发送至第一设备。

可选的，接收处理设备发送的上下文变量信息之后，调试单元803进一步用于：

向处理设备发送继续执行目标脚本源码集合的指示信息，以使处理设备将指示信息发送至第一设备，指示信息用于指示第一设备继续执行目标脚本源码集合。

可选的，完成待调试页面的调试后，进一步包括第二处理单元804，第二处理单元804用于：

接收处理设备发送的交互指令集合，并基于交互指令集合执行其他待调试页面的调试操作。

基于同一发明构思，本申请实施例中还提供一种页面调试装置，由于上述装置解决技术问题的原理与第一设备侧的页面调试方法相同，因此上述装置的实施可以参见方法的实施，重复之处不再赘述。

参阅图9所示，其为本申请实施例提供的页面调试装置的逻辑结构示意图，页面调试装置900可以包括：

第三接收单元901，接收第二设备发送的待调试页面的地址信息，并将待调试页面的脚本源码集合发送至处理设备，以使处理设备将脚本源码集合发送至第二设备；

第四接收单元902，接收处理设备发送的目标脚本源码集合和与脚本源码集合对应的断点指示信息，其中，目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，断点指示信息是第二设备基于在脚本源码集合中标记的断点位置生成的；

匹配单元903，每执行目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将一行脚本源码的位置与断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行目标脚本源码集合，并将当前的上下文变量信息发送至处理设备。

可选的，接收第二设备发送的待调试页面的地址信息，并将待调试页面的脚本源码集合发送至处理设备时，第三接收单元901用于：

接收第二设备发送的编码信息，其中，当第二设备将携带有待调试页面的地址信息的调试连接建立请求发送至处理设备后，由处理设备基于地址信息和对应地址信息生成的加密标识信息，生成编码信息，并将编码信息发送至第二设备；

识别编码信息，并获取编码信息中包括的加密标识信息和待调试页面的地址信息；

向处理设备发送携带有加密标识信息的连接建立请求，并确定基于加密标识信息在处理设备上完成身份验证后，将待调试页面的脚本源码集合发送至处理设备。

可选的，将待调试页面的脚本源码集合发送至处理设备之后，第三接收单元901还用于：

向处理设备发送待调试页面的文档对象模型和样式数据，以使处理设备将文档对象模型和样式数据转发至第二设备；

若接收到处理设备发送的待更新目标对象，则基于待更新目标对象对文档对象模型中对应的对象进行更新，并将更新后的文档对象模型和样式数据发送至处理设备，其中，待更新目标对象是第二设备基于文档对象模型进行修改后，发送至处理设备的；

若接收到处理设备发送的待更新目标数据，则基于待更新目标数据对样式数据中对应的内容进行更新，并将更新后的文档对象模型和样式数据发送至处理设备，其中，待更新目标数据是第二设备基于样式数据进行修改后，发送至处理设备的。

可选的，将当前的上下文变量信息发送至处理设备之后，匹配单元进一步903用于：

接收处理设备发送的继续执行目标脚本源码集合的指示信息，继续执行目标脚本源码集合，其中，指示信息是第二设备发送至处理设备的。

为了描述的方便，以上各部分按照功能划分为各模块（或单元）分别描述。当然，在实施本申请时可以把各模块（或单元）的功能在同一个或多个软件或硬件中实现。

所属技术领域的技术人员能够理解，本申请的每个方面可以实现为***、方法或程序产品。因此，本申请的每个方面可以具体实现为以下形式，即：完全的硬件实施方式、完全的软件实施方式（包括固件、微代码等），或硬件和软件方面结合的实施方式，这里可以统称为“电路”、“模块”或“***”。

在一些可能的实施方式中，本申请实施例还提供一种电子设备，参阅图10所示，其为本申请实施例的一种电子设备的一个硬件组成结构示意图，电子设备1000可以至少包括至少一个处理器1001、以及至少一个存储器1002。其中，存储器1002存储有程序代码，当程序代码被处理器1001执行时，使得处理器1001执行本说明书上述描述的根据本申请各种示例性实施方式的页面显示方法中的步骤，例如，处理器1001可以执行如图3a-3c、3f、4a、4c、5a-5b中所示的步骤。

在一些可能的实施方式中，本申请实施例还提供一种计算装置，可以至少包括至少一个处理单元、以及至少一个存储单元。其中，存储单元存储有程序代码，当程序代码被处理单元执行时，使得处理单元执行本说明书上述描述的根据本申请各种示例性实施方式的数据页面显示中的步骤，例如，处理器1001可以执行如图3a-3c、3f、4a、4c、5a-5b中所示的步骤。

下面参照图11来描述根据本申请的这种实施方式的计算装置1100。图11的计算装置1100仅仅是一个示例，不应对本申请实施例的功能和使用范围带来任何限制。

如图11，其为本申请实施例中的一个计算装置的结构示意图。计算装置1100以通用计算装置的形式表现。计算装置1100以通用计算装置的形式表现。计算装置1100的组件可以包括但不限于：上述至少一个处理单元1101、上述至少一个存储单元1102、连接不同***组件（包括存储单元1102和处理单元1101）的总线1103。

总线1103表示几类总线结构中的一种或多种，包括存储器总线或者存储器控制器、***总线、处理器或者使用多种总线结构中的任意总线结构的局域总线。

存储单元1102可以包括易失性存储器形式的可读介质，例如随机存取存储器（RAM）11021和/或高速缓存存储单元11022，还可以进一步包括只读存储器（ROM）11023。

存储单元1102还可以包括具有一组（至少一个）程序模块11024的程序/实用工具11025，这样的程序模块11024包括但不限于：操作***、一个或者多个应用程序、其它程序模块以及程序数据，这些示例中的每一个或某种组合中可能包括网络环境的实现。

计算装置1100也可以与一个或多个外部设备1104（例如键盘、指向设备等）通信，还可与一个或者多个使得用户能与计算装置1100交互的设备通信，和/或与使得该计算装置1100能与一个或多个其它计算装置进行通信的任何设备（例如路由器、调制解调器等等）通信。这种通信可以通过输入/输出（I/O）接口1105进行。并且，计算装置1100还可以通过网络适配器1106与一个或者多个网络（例如局域网（LAN），广域网（WAN）和/或公共网络，例如因特网）通信。如图所示，网络适配器1106通过总线1103与用于计算装置1100的其它模块通信。应当理解，尽管图中未示出，可以结合计算装置1100使用其它硬件和/或软件模块，包括但不限于：微代码、设备驱动器、冗余处理器、外部磁盘驱动阵列、RAID***、磁带驱动器以及数据备份存储***等。

在一些可能的实施方式中，本申请提供的页面显示方法的每个方面还可以实现为一种程序产品的形式，其包括程序代码，当程序产品在计算机设备上运行时，程序代码用于使计算机设备执行本说明书上述描述的根据本申请各种示例性实施方式的页面显示方法中的步骤，例如，计算机设备可以图3a-3c、3f、4a、4c、5a-5b中所示的步骤。

程序产品可以采用一个或多个可读介质的任意组合。可读介质可以是可读信号介质或者可读存储介质。可读存储介质例如可以是但不限于电、磁、光、电磁、红外线、或半导体的***、装置或器件，或者任意以上的组合。可读存储介质的更具体的例子（非穷举的列表）包括：具有一个或多个导线的电连接、便携式盘、硬盘、随机存取存储器（RAM）、只读存储器（ROM）、可擦式可编程只读存储器（EPROM或闪存）、光纤、便携式紧凑盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。

尽管已描述了本申请的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例做出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本申请范围的所有变更和修改。

显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。

Claims (15)

1.一种页面调试方法，其特征在于，应用于处理设备，该方法包括：

接收第一设备发送的待调试页面的脚本源码集合，所述脚本源码集合是所述第一设备接收到第二设备发送的所述待调试页面的地址信息后发送的；

将所述脚本源码集合发送至所述第二设备，并获取所述第二设备基于所述脚本源码集合返回的断点指示信息，以及在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合；

将所述目标脚本源码集合和所述断点指示信息，发送至所述第一设备，以使所述第一设备基于所述断点指示信息，上报中断执行所述目标脚本源码集合时的上下文变量信息；

将所述上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试。

2.如权利要求1所述的方法，其特征在于，所述接收第一设备发送的待调试页面的脚本源码集合，包括：

接收第二设备发送的调试连接建立请求，获取所述调试连接建立请求中携带的待调试页面的地址信息；

对应所述地址信息生成加密标识信息，并基于所述加密标识信息和所述地址信息生成所述待调试页面的编码信息；

将所述编码信息发送至所述第二设备，以使所述第二设备将所述编码信息发送至第一设备；

接收所述第一设备发送的携带所述加密标识信息的连接建立请求，并基于所述加密标识信息对所述第一设备进行身份验证；

若确定验证通过，则接收所述第一设备发送的所述待调试页面的脚本源码集合。

3.如权利要求1所述的方法，其特征在于，所述在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合，包括：

按照所述脚本源码集合中各行脚本源码的编写顺序，依次获取所述各行脚本源码，其中，每获得一行脚本源码，将预设的调试函数添加至所述一行脚本源码中的指定位置；

基于添加有调试函数的每一行脚本源码，生成与所述脚本源码集合对应的目标脚本源码集合。

4.如权利要求1-3任一项所述的方法，其特征在于，所述接收第一设备发送的待调试页面的脚本源码集合之后，还包括：

接收所述第一设备发送的所述待调试页面的文档对象模型和样式数据，并将所述文档对象模型和所述样式数据转发至所述第二设备；

若接收到所述第二设备发送的，在对所述文档对象模型中目标对象进行修改后得到的待更新目标对象，则将所述待更新目标对象发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备；

若接收到所述第二设备发送的，在对所述样式数据中目标数据进行修改后得到的待更新目标数据，则将所述待更新目标数据发送至所述第一设备，并根据所述第一设备反馈的更新后的所述文档对象模型和所述样式数据，生成所述待调试页面的页面截图，并将所述页面截图发送至所述第二设备。

5.如权利要求1-3任一项所述的方法，其特征在于，在接收所述第一设备中断执行所述目标脚本源码集合时上报的上下文变量信息的过程中，包括：

每接收一次所述第一设备上报的上下文变量信息，执行以下操作：

将当前接收的上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试，并显示所述第一设备的中断执行状态；

响应于所述第二设备发送的继续执行所述目标脚本源码集合的指示信息，将所述指示信息发送至所述第一设备，以使所述第一设备继续执行所述目标脚本源码集合。

6.如权利要求1-3任一项所述的方法，其特征在于，完成所述待调试页面的调试后，进一步包括：

根据与所述第二设备之间的各个交互指令，生成能够对待调试页面进行调试的交互指令集合；

将所述交互指令集合发送至所述第二设备，以使所示第二设备参考所述交互指令集合执行其他待调试页面的调试操作。

7.一种页面调试方法，其特征在于，应用于第二设备，该方法包括：

接收处理设备发送的待调试页面的脚本源码集合，所述脚本源码集合是将待调试页面的地址信息发送至第一设备后，所述第一设备发送至所述处理设备的；

在所述脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成所述脚本源码集合对应的断点指示信息，以及将所述断点指示信息发送至所述处理设备，以使所述处理设备将所述断点指示信息发送至所述第一设备；

接收所述处理设备发送的上下文变量信息，并显示所述第一设备的中断执行状态，以及基于所述上下文变量信息对所述待调试页面进行调试，其中，所述上下文变量信息是所述第一设备基于所述断点指示信息，中断执行所述脚本源码集合后上报至所述处理设备的。

8.如权利要求7所述的方法，其特征在于，所述接收处理设备发送的待调试页面的脚本源码集合，包括：

向处理设备发送调试连接请求，其中，所述调试连接请求中携带有待调试页面的地址信息；

获取所述处理设备基于所述地址信息生成的编码信息，并将所述编码信息发送至第一设备，其中，所述编码信息是所述处理设备对应所述地址信息生成加密标识信息后，基于所述地址信息和所述加密标识信息生成的；

接收所述处理设备发送的所述待调试页面的脚本源码集合，其中，所述脚本源码集合是基于以下操作获得的：在所述处理设备基于所述第一设备发送的，携带所述加密标识信息的连接建立请求，完成对所述第一设备的身份验证后，由所述第一设备将所述脚本源码集合发送至所述处理设备。

9.一种页面调试方法，其特征在于，应用于第一设备，该方法包括：

接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，以使所述处理设备将所述脚本源码集合发送至所述第二设备；

接收所述处理设备发送的目标脚本源码集合和与所述脚本源码集合对应的断点指示信息，其中，所述目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，所述断点指示信息是所述第二设备基于在所述脚本源码集合中标记的断点位置生成的；

每执行所述目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将所述一行脚本源码的位置与所述断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行所述目标脚本源码集合，并将当前的上下文变量信息发送至所述处理设备。

10.如权利要求9所述的方法，其特征在于，所述接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，包括：

接收第二设备发送的编码信息，其中，当所述第二设备将携带有待调试页面的地址信息的调试连接建立请求发送至处理设备后，由所述处理设备基于所述地址信息和对应所述地址信息生成的加密标识信息，生成所述编码信息，并将所述编码信息发送至所述第二设备；

识别所述编码信息，并获取所述编码信息中包括的加密标识信息和待调试页面的地址信息；

向所述处理设备发送携带有所述加密标识信息的连接建立请求，并确定基于所述加密标识信息在所述处理设备上完成身份验证后，将所述待调试页面的脚本源码集合发送至所述处理设备。

11.一种页面调试装置，其特征在于，该装置包括：

第一接收单元，用于接收第一设备发送的待调试页面的脚本源码集合，所述脚本源码集合是所述第一设备接收到第二设备发送的所述待调试页面的地址信息后发送的；

获取单元，用于将所述脚本源码集合发送至所述第二设备，并获取所述第二设备基于所述脚本源码集合返回的断点指示信息，以及在所述脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数，获得目标脚本源码集合；

第一发送单元，用于将所述目标脚本源码集合和所述断点指示信息，发送至所述第一设备，以使所述第一设备基于所述断点指示信息，上报中断执行所述目标脚本源码集合时的上下文变量信息；

第二发送单元，将所述上下文变量信息发送至所述第二设备，以使所述第二设备基于所述上下文变量信息对所述待调试页面进行调试。

12.一种页面调试装置，其特征在于，该装置包括：

第二接收单元，接收处理设备发送的待调试页面的脚本源码集合，所述脚本源码集合是将待调试页面的地址信息发送至第一设备后，所述第一设备发送至所述处理设备的；

生成单元，在所述脚本源码集合中标记断点位置，并基于标记的各个断点位置，生成所述脚本源码集合对应的断点指示信息，以及将所述断点指示信息发送至所述处理设备，以使所述处理设备将所述断点指示信息发送至所述第一设备；

调试单元，接收所述处理设备发送的上下文变量信息，并显示所述第一设备的中断执行状态，以及基于所述上下文变量信息对所述待调试页面进行调试，其中，所述上下文变量信息是所述第一设备基于所述断点指示信息，中断执行所述脚本源码集合后上报至所述处理设备的。

13.一种页面调试装置，其特征在于，该装置包括：

第三接收单元，接收第二设备发送的待调试页面的地址信息，并将所述待调试页面的脚本源码集合发送至处理设备，以使所述处理设备将所述脚本源码集合发送至所述第二设备；

第四接收单元，接收所述处理设备发送的目标脚本源码集合和与所述脚本源码集合对应的断点指示信息，其中，所述目标脚本源码集合是在脚本源码集合包含的各行脚本源码中的指定位置，分别添加预设的调试函数后获得的，所述断点指示信息是所述第二设备基于在所述脚本源码集合中标记的断点位置生成的；

匹配单元，每执行所述目标脚本源码集合中，与脚本源码集合中的一行脚本源码对应的一行目标脚本源码，将所述一行脚本源码的位置与所述断点指示信息中的断点位置进行匹配，并在确定匹配成功后，中断执行所述目标脚本源码集合，并将当前的上下文变量信息发送至所述处理设备。

14.一种电子设备，其特征在于，其包括处理器和存储器，其中，所述存储器存储有程序代码，当所述程序代码被所述处理器执行时，使得所述处理器执行权利要求1~6中任一所述方法的步骤，或使得所述处理器执行权利要求7~8中任一所述方法的步骤，或使得所述处理器执行权利要求9~10任一项所述方法的步骤。

15.一种计算机可读存储介质，其特征在于，其包括程序代码，当程序产品在电子设备上运行时，所述程序代码用于使所述电子设备执行权利要求1~6中任一所述方法的步骤，或使所述电子设备执行权利要求7~8中任一所述方法的步骤，或使所述电子设备执行权利要求9~10任一项所述方法的步骤。

Images