CN108076123B - 网页调试方法、装置及系统 - Google Patents

Abstract

本发明公开了一种网页调试方法、装置及系统，属于网络技术领域。该方法应用于远程服务器，远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，远程服务器与第二终端连接于同一网络，第一终端为用户终端，第二终端为网页开发者使用的终端，方法包括：接收第一终端发送的内核数据，将内核数据发送给第二终端，由第二终端根据内核数据生成并发送调试指令；接收第二终端发送的调试指令，将调试指令发送至第一终端，由第一终端执行调试指令实现网页调试。本发明前端开发者可以通过远程服务器的中转能力获取到第一终端的内核数据，进而精确定位故障原因数据，节省了大量的人力物力，适用范围较广，智能性较优。

Description

网页调试方法、装置及系统

技术领域

本发明涉及网络技术领域，特别涉及一种网页调试方法、装置及系统。

背景技术

随着智能手机、平板电脑等终端处理能力的不断提升，为了增强用户体验，基于浏览器的网络应用日益增多。在使用网络应用过程中最重要的一个环节便是网页调试，即针对网页包含的页面数据进行调试，以在出现不能进行网页渲染、网页加载堵塞或崩溃等网页故障时提供解决途径。其中，页面数据通常基于HTML(HyperText Markup Language，超级文本标记语言)、CSS(Cascading Style Sheets，层叠样式表)、JavaScript等脚本语言实现。

参见图1，目前主流的网页调试方法为：在第一终端与网页开发者使用的第二终端通过近距离通信媒介连接后，第一终端通过操作系统中提供的通信工具，与第二终端之间建立物理链路。其中，第一终端为用户终端，近距离通信媒介可诸如USB(Universal SerialBus，通用串行总线)线等。若上述操作系统为安卓系统，则通信工具指代ADB(AndroidDebug Bridge，安卓调试桥)。这样在网页出现故障需要进行网页调试时，借助于已建立的物理链路，第一终端便可将内核数据发送至第二终端。之后，网页开发者在基于内核数据进行故障排查并基于故障原因数据触发第二终端生成调试指令后，第二终端再向第一终端发送该调试指令，以使第一终端在接收到该调试指令后执行该调试指令从而实现网页调试。

在实现本发明的过程中，发明人发现至少存在以下问题：

针对上述网页调试方法来说，仅可通过近距离通信媒介将第一终端与第二终端相连，由于近距离通信媒介的通信距离有限，因此第二终端无法与远程用户的第一终端相连接，这样在网页出现故障时，由于前端开发者无法获取到内核数据，所以只能猜测可能出现的问题或模拟问题现场，这不但将消耗大量的人力物力，且存在无法精准定位网页故障原因的缺陷，因此该种网页调试方式的适用范围较为局限，效果不佳、智能性不好。

发明内容

为了解决现有技术的问题，本发明实施例提供了一种网页调试方法、装置及系统。所述技术方案如下：

第一方面，提供了一种网页调试方法，所述方法应用于远程服务器，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述方法包括：

接收所述第一终端发送的内核数据，将所述内核数据发送给所述第二终端，由所述第二终端根据所述内核数据生成并发送调试指令；

接收所述第二终端发送的所述调试指令，将所述调试指令发送至所述第一终端，由所述第一终端执行所述调试指令实现网页调试。

第二方面，提供了一种网页调试方法，所述方法应用于第二终端，所述第二终端与远程服务器连接于同一网络，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述方法包括：

接收所述远程服务器发送的内核数据，所述内核数据由所述第一终端发送给所述远程服务器；

根据所述内核数据生成调试指令；

将所述调试指令发送至所述远程服务器，由所述远程服务器在接收到所述第二终端发送的所述调试指令后，将所述调试指令发送至所述第一终端，由所述第一终端执行所述调试指令实现网页调试。

第三方面，提供了一种网页调试方法，所述方法包括：

第一终端向远程服务器发送内核数据；

所述远程服务器在接收所述内核数据后，将所述内核数据发送给第二终端；

所述第二终端在接收到所述内核数据后，根据所述内核数据生成调试指令；

所述第二终端将所述调试指令发送给所述远程服务器；

所述远程服务器在接收到所述调试指令后，将所述调试指令发送至所述第一终端；

所述第一终端在接收到所述调试指令后，执行所述调试指令实现网页调试；

其中，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与所述第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端。

第四方面，提供了一种网页调试装置，所述装置应用于远程服务器，所述装置应用于远程服务器，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述装置包括：

第一接收模块，用于接收所述第一终端发送的内核数据；

第一发送模块，用于将所述内核数据发送给所述第二终端，由所述第二终端根据所述内核数据生成并发送调试指令；

第二接收模块，用于接收所述第二终端发送的所述调试指令；

第二发送模块，用于将所述调试指令发送至所述第一终端，由所述第一终端执行所述调试指令实现网页调试。

第五方面，提供了一种网页调试装置，所述装置应用于第二终端，所述装置应用于第二终端，所述第二终端与远程服务器连接于同一网络，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述装置包括：

接收模块，用于接收所述远程服务器发送的内核数据，所述内核数据由所述第一终端发送给所述远程服务器；

生成模块，用于根据所述内核数据生成调试指令；

发送模块，用于将所述调试指令发送至所述远程服务器，由所述远程服务器在接收到所述第二终端发送的所述调试指令后，将所述调试指令发送至所述第一终端，由所述第一终端执行所述调试指令实现网页调试。

本发明实施例提供的技术方案带来的有益效果是：

通过远程服务器将第一终端与第二终端间接相连，由于远程服务器对通信距离不进行限制，因此通过远程服务器第二终端可以与远程用户的第一终端进行数据传输，这样在网页出现故障时，网页开发者便可以通过远程服务器的中转能力获取到第一终端的内核数据，进而可以根据内核数据精确定位网页故障原因数据，实现快速有效地确定故障网页的问题所在，避免了因网页开发者无法与远程用户的第一终端相连接，而造成的不能获取到内核数据进而只能猜测可能出现的问题或模拟问题现场，致使需消耗大量人力物力的缺陷，该种网页调试方式的适用范围较为广泛，效果较佳，智能性较优。

附图说明

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

图1是背景技术提供的一种网页调试方法所涉及的系统结构示意图；

图2是本发明实施例提供的一种网页调试方法所涉及的系统结构示意图；

图3是本发明实施例提供的一种网页调试方法的流程示意图；

图4是本发明实施例提供的一种网页调试方法的整体工作流程图；

图5A是本发明实施例提供的一种网页调试方法的流程图；

图5B是本发明实施例提供的一种通信连接的结构示意图；

图6是本发明实施例提供的一种网页调试装置的结构示意图；

图7是本发明实施例提供的一种网页调试装置的结构示意图；

图8是本发明实施例提供的一种网页调试装置的结构示意图；

图9是本发明实施例提供的一种远程服务器的结构示意图。

具体实施方式

为使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明实施方式作进一步地详细描述。

在对本发明实施例进行详细的解释说明之前，先对本发明实施例提供的网页调试方法所涉及的系统结构进行简单介绍。

参见图2，该系统结构由三部分组成，分别为第一终端、远程服务器和第二终端。其中，第一终端为用户终端，第二终端为网页开发者即前端开发者使用的终端，远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，远程服务器与第二终端连接于同一网络。其中前端指代在浏览器上展示出来的一系列页面，一般可通过HTML(Hyper TextMark-up Language，超文本标记语言)、CSS(Cascading Style Sheet，层叠样式表单)以及Javascript(脚本语言)等方式实现；远程服务器使得网页开发者使用的第二终端与用户使用的第一终端之间数据传输成为可能；正是因为远程服务器的存在，所以即便第一终端为远程用户的设备，网页开发者的第二终端也可通过远程服务器与第一终端进行数据传输，从而实现排查远程用户的第一终端上页面故障的原因，并进行网页调试。其中，第一终端安装的浏览器的内核中嵌入有数据收集装置，该数据收集装置用于收集浏览器内核中的内核数据，并负责将这些内核数据转发给远程服务器，远程服务器再将这些内核数据转发给网页开发者使用的第二终端，网页开发者根据这些内核数据便可进行页面故障原因的分析和定位，进而依据页面故障原因进行网页调试。此外，第一终端还可通过远程服务器接收网页开发者的第二终端发送的调试指令，并传递到浏览器的内核中，第一终端通过执行该调试指令，实现对浏览器内核的操作，完成网页调试。

在另一个实施例中，网页开发者操作与用户操作之间的交互参见图3所示，当第一终端上安装的浏览器发生故障无法正常显示网页时，用户可申请网页调试，网页开发者在接收到用户的网页调试申请(对应后续提到的请求调试指令)后，会将调试URL(UniformResource Locator，统一资源定位符)发送给用户，以此等待用户连接；用户在接收到调试URL后，打开调试URL便完成对前端开发者的网页调试授权；之后，网页开发者便可获取有关于第一终端的调试页面，进而执行网页调试。此外，网页开发者在接收到用户的网页调试申请后，还可向用户发送诸如二维码等的图形标识码，以此等待用户连接，并通过图形标识码完成为网页开发者的连接授权过程，本发明实施例对此不进行具体限定。其中，上述调试URL和图形标识码对应后续文中提及的第一连接请求。

以第二终端的角度为例，图4示出了本发明实施例所涉及的网页调试方法的整体工作流程图。在图4中，网页开发者在接收到用户的请求调试指令后，会向用户使用的第一终端申请连接，并等待第一终端接入。若第一终端在预设的超时时长内接入成功，则远程服务器与第一终端进行HTTP(Hyper Text Transfer Protocol，超文本传输协议)通道配对，也即远程服务器通过一次接收过程接收到第一终端中浏览器全部的内核数据，并将内核数据发送给网页开发者的第二终端，此时网页开发者仅可看到第一终端的浏览器当前显示的页面，但是不能执行调试操作；若第一终端在预设的超时时长内未接入，则本次调试操作失败，并结束本次操作。其中，判断第一终端在上述超时时长内是否接入，可采取下述方式实现：第二终端在申请连接后，立即进行计时，以计算当前等待的时长，并判断当前等待的时长是否大于上述超时时长；如果当前等待的时长大于上述超时时长，则证明第一终端接入失败。如果当前等待的时长小于上述超时时长，则继续等待。在第一终端接入成功后，网页开发者会向第一终端申请新连接，当第一终端接收到新连接请求后，与远程服务器进行连接，也即第一终端与远程服务器进行WebSocket(全双工的网络通信协议)通道配对，这样网页开发者便可对第一终端进行常规调试，此时网页开发者不仅可看到第一终端的浏览器当前显示的页面，还能对其执行调试操作。其中，WebSocket通道配对保证了第二终端在调试过程中可通过多次的发送过程向第一终端发送调试指令。

图5A是本发明实施例提供的一种网页调试方法的流程图，交互主体包括远程服务器、第一终端和第二终端，参见图5A，包括以下步骤：

501、第一终端在检测到用户的请求调试操作后，生成请求调试指令，并发送至远程服务器；之后，远程服务器将该请求调试指令发送至第二终端。

在本发明实施例中，第一终端会在故障页面提供可点击的请求调试按键，当第一终端检测到用户对该请求调试按键的触发操作后，会生成请求调试指令，并将该请求调试指令发送至远程服务器。例如，若用户用浏览器打开游戏A的游戏页面时，浏览器发生故障，以致不能正常显示该游戏的游戏页面，这时在该故障页面便会提供一个请求调试按键；当用户点击了该请求调试按键后，第一终端便会生成上述请求调试指令。

其中，第一终端在将上述请求调试指令发送至第二终端时，也是需通过远程服务器进行发送。如图5B所示，远程服务器共提供了四个端口，其中第一端口和第四端口用于远程服务器与第一终端进行数据传输，第二端口和第三端口用于远程服务器与第二终端进行数据传输。由于第一终端和第二终端是归属于不同的网络的，因此上述第一端口和第四端口、第二端口和第三端口所采取的网络协议是不同的，即第一端口和第四端口为第一网络协议端口，而第二端口和第三端口为第二网络协议端口，其中第一网络协议和第二网络协议分别为第一终端所在网络支持的协议和第二终端所在网络支持的协议。即，本文中使用不同网络协议的端口是要保证第一终端发送的数据可以被第二终端正确解析，第二终端发送的数据也可以被第一终端正确解析，不会因为网络的不同造成数据不能够被正确解析。其中，第一终端在向远程服务器发送请求调试指令时，是需要向远程服务器的第一端口发送的，这里第一终端之所以能够通过第一端口向远程服务器发送请求调试指令，是因为远程服务器与第一终端之间是建立了一个通信连接的。这个通信连接的建立过程可通过第一终端发送连接请求和远程服务器发送响应包的方式实现。需要说明的是，第一终端在这里与远程服务器建立的通信连接与下述步骤中提及的第一通信连接和第二通信连接均不相同。其中，第一终端在这里与远程服务器建立的连接只用于将第一终端生成的请求调试指令发送给第二终端，对于后续提及的调试指令等其他指令并不适用。

其中，远程服务器在接收到上述请求调试指令后，会根据请求调试指令确定与第一端口匹配的第二端口。其中，本发明实施例基于保证数据安全性等因素的考量，会通过不同的端口传输不同的数据。比如，图5B中的第一端口和第二端口可用于传输内核数据，但是却不能进行调试指令的传输。而第三端口和第四端口便可进行调试指令的传输。具体哪一个端口用来传输何种数据，可由远程服务器预先进行设置。这样，远程服务器在接收到不同类型的数据后，便可知晓使用何种端口进行传输。即，远程服务器在接收到上述请求调试指令并根据上述请求调试指令中携带的类型信息确定其为请求调试指令后，便可根据上述预先设置确定应该通过与第二终端进行数据传输的第二端口将上述请求调试指令发送给第二终端，而不是通过第三端口。

502、第二终端在接收到请求调试指令后，获取第一连接请求信息，并发送至远程服务器；远程服务器在接收到第一连接请求信息后，将该第一连接请求信息发送至第一终端。

根据第一终端的类型不同，获取到的第一连接信息的形式也可不同。例如，若第一终端为手机，则第二终端可生成一个图形标识码形式的第一连接请求信息，其中该图形标识码可为二维码或条形码；若第一终端为平板电脑，则第二终端可生成一个网址链接形式的第一连接请求信息。

在本发明实施例中，第二终端在发送第一连接请求信息时，也是向第二端口发送的，第二端口可负责请求调试指令的发送和第一连接请求信息的接收。即，将第二终端生成的第一连接请求信息发送给第一终端的详细过程为：远程服务器通过图5B所示的第二端口接收第二终端发送的第一连接请求信息，并通过第一端口将该第一请求信息发送至第一终端。

503、第一终端在接收到的第一连接请求信后，生成第一确认连接响应，并将第一确认连接响应发送到远程服务器，完成第一通信连接的建立，第一终端基于该第一通信连接将内核数据发送至远程服务器；远程服务器将接收到的内核数据发送给第二终端。

在本发明实施例中，第一终端在接收到第一连接请求信息后，会向远程服务器的第一端口发送针对第一连接请求信息的第一确认连接响应，进而完成第一通信连接的建立，实现第一端口与第二端口的绑定。需要说明的是，仅在第一通信连接建立后，方可通过第一端口和第二端口实现内核数据的传输。

其中，第一终端会通过浏览器将该第一连接请求信息展示给用户，并基于用户对该第一连接信息的操作向远程服务器发送第一确认连接响应。例如，若第一终端为手机，第一连接请求信息通常为图形标识码的形式，则第一终端通过浏览器将上述图形标识码展示给用户；当检测到用户执行对该图形标识码的识别操作后，确认用户授权，则向远程服务器发送第一确认连接响应，以建立第一通信连接；若第一终端为平板电脑，第一连接请求信息通常为网址链接的形式，则第一终端通过浏览器将上述网址链接展示给用户；当检测到用户执行对该网址链接的触发操作后，确认用户授权，则向远程服务器发送第一确认连接响应，以建立第一通信连接。

需要说明的是，继续以第一连接请求信息的形式为图形标识码或网址链接为例，若第一终端未检测到用户的识别操作或触发操作，则确认用户未授权，不与远程服务器建立第一通信连接，因为第一通信连接未建立，所以第一终端不会将浏览器的内核数据发送至远程服务器；而第二终端在预设时长内未接收到第一终端发送的内核数据，则将再次通过远程服务器向第一终端发送第一连接请求信息，以申请再次连接。本发明实施例对第二终端发送第一连接请求信息的次数不进行具体限定。

从端口的角度来讲，在第一通信连接建立后，方可通过第一端口和与第一端口绑定的第二端口进行内核数据的传输，第二终端通过远程服务器提供的相互绑定的第一端口和第二端口的协助，可从第一终端获取到内核数据。另一个角度，第一通信连接实质为第一终端对远程服务器的授权过程，在第一通信连接建立成功后，也即第一终端确认对远程服务器进行授权后，远程服务器才有权限接收到第一终端发送的浏览器中的内核数据；否则，第一终端不会将浏览器的内核数据发送至远程服务器，之后的网页调试操作便无法正常进行。其中，在第一通信连接建立后，远程服务器通过第一端口接收到第一终端发送的内核数据，进一步地远程服务器在向第二终端发送内核数据时，是通过第二端口实现的。

504、第二终端在接收到内核数据后，根据接收到的内核数据生成调试页面，若检测到网页开发者对调试页面上确认调试选项的触发操作，则将第二连接请求信息发送至远程服务器，远程服务器将该第二连接请求发送给第一终端。

其中，内核数据为页面发生故障时浏览器内核中当前的网页数据信息，本发明实施例通过在浏览器中内嵌一个数据收集装置来收集浏览器中的内核数据，之后第一终端将收集到的内核数据发送给远程服务器。

第二终端在接收到内核数据后，会根据接收到的内核数据生成调试页面，该调试页面上包括诸如“开始调试”的按键作为确认调试选项，同时调试页面上还会显示第一终端已经连接到远程服务器上的连接提示信息，而且在该调试页面上网页开发者还可以看到第一终端上浏览器当前打开的页面信息。当第二终端检测到网页开发者触发“开始调试”的按键时，则将第二连接请求信息发送至远程服务器。例如，若用户用浏览器打开游戏A的游戏页面时，浏览器发生故障，则该调试页面将显示用户所用浏览器的故障页面，并在该调试页面上提供“开始调试”的按键。需要说明的是，若第二终端未检测到网页开发者对确认调试选项的触发操作，则生成调试失败信息，并通过远程服务器将调试失败信息发送给第一终端，本次调试操作至此结束。

参见图5B，第二终端向远程服务器发送第二连接请求信息时，是向远程服务器的第三端口发送的，远程服务器在通过第三端口接收到第二连接请求信息后，根据所述第二连接请求确定与第三端口匹配的第四端口，并将第二连接请求信息通过第四端口发送给第一终端。其中，第四端口的确定过程与上述步骤501类似，此处不再赘述。

505、第一终端在接收到第二连接请求信息后，生成第二确认连接响应，并将第二确认连接响应发送到远程服务器，完成第二通信连接的建立。

其中，远程服务器通过图5B所示的第四端口接收第一终端发送的针对第二连接请求信息的第二确认连接响应，之后远程服务器通过第三端口将第二确认连接响应发送给第二终端，以此完成第二通信连接的建立，实现第三端口与第四端口的绑定。需要说明的是，仅在第二通信连接建立后，方可通过第三端口和第四端口实现内核数据的传输。其中，从端口的角度来讲，在第二通信连接建立后，方可通过第三端口和与第三端口绑定的第四端口进行调试指令的传输，第二终端通过远程服务器提供的相互绑定的第三端口和第四端口的协助，可向第一终端发送调试指令，以便实现网页调试。另一个角度，第二通信连接实质为第二终端告知第一终端即将执行具体网页调试操作的过程，在第二通信连接建立成功后，用户授权前端开发者进行网页调试的具体过程，也即第一终端确认第二终端可执行具体网页调试操作后，第二终端才可以继续具体的网页调试操作。

506、第二终端根据定位得到的故障原因数据生成调试指令，并将调试指令发送给远程服务器。

第二终端在接收到远程服务器通过第三端口发送的内核数据后，会根据内核数据生成并在显示屏幕上显示调试页面，网页开发者在该调试页面上可看到故障页面，即可以看到问题现场，从而根据问题现场定位得到页面故障的故障原因数据，在完成第二通信连接的建立后，网页开发者便可依据上述故障原因数据在调试页面进行相应调试，其中进行相应调试的过程实质上为网页开发者根据故障原因数据在调试页面上执行调试操作，触发第二终端生成调试指令，比如触发第二终端生成一个断点指令。之后，第二终端将调试指令发送至远程服务器，其中远程服务器基于第三端口接收第二终端发送的调试指令。

507、远程服务器基于第二通信连接将接收到的调试指令发送给第一终端，之后第一终端执行接收到的调试指令，实现网页调试。

远程服务器基于第三端口接收第二终端发送的调试指令，并基于第四端口将上述调试指令发送至第一终端。其中，远程服务器在向第一终端发送调试指令时，也可根据第一终端类型的不同，而将调试指令进行数据格式转换。以第一终端为手机为例，则由于操作系统的不同，支持的数据格式可能不同，因此若远程服务器发现接收到的调试指令的数据格式与第一终端可支持的数据格式不同，则可将调试指令转换成第一终端支持的数据格式，本发明实施例对此不进行具体限定。其中，在上述向第一终端发送第一连接请求信息和第二连接请求信息时也可进行上述处理，本发明实施例对此不进行具体限定。

需要说明的是，在一次接收到第一终端发送的请求调试指令并在执行网页调试的过程中，若第一终端的浏览器中又发生页面故障，则可无需再次发送请求调试指令，可直接基于当前建立的连接进行内核数据的获取，进而采取上述步骤所述类似的方式继续进行网页调试。

除了本发明所示的获取内核数据的方式外，现有技术还提出了通过在浏览器中注入调试脚本的方式获取第一终端的浏览器中的内核数据的方式，但是该方式需要用户重新打开加入了调试脚本的修复页面，但重新打开修复页面后可能问题已经不复存在了，这样便错过了真正的问题现场。同时，由于第一终端的碎片化，使得第一终端所搭载的浏览器不一定相同，而且不同浏览器的内核特性是不同的，因此向浏览器注入脚本的方式无法获取浏览器内核中的许多特殊内核数据，从而无法达到实时调试的效果。例如，调试脚本无法让浏览器中的程序中断在需要的地方实现断点功能，而且调试脚本无法分析出具体DOM(Document Object Model，文件对象模型)节点的最终样式是根据哪部分样式文件作用而成的，而本发明实施例提供的远程服务器更好地避免了上述可能出现的问题，高效率地实现了网页调试。

此外，针对近距离连接第一终端与网页开发者的第二终端的场景，由于第一终端的碎片化问题，会出现很多网页开发者无法正常将第二终端与第一终端连接的情况。而本发明实施例由于远程服务器的存在，其协助第一终端与第二终端进行数据传输，因此很好地解决了这一问题。另外，用户在协助调试的过程中通常仅需通过打开一个网址链接或者做一个扫码动作完成授权，即为用户提供了便利还确保了用户的个人隐私安全。

本发明实施例提供的方法，通过远程服务器将第一终端与第二终端间接相连，由于远程服务器对通信距离不进行限制，因此通过远程服务器第二终端可以与远程用户的第一终端进行数据传输，这样在网页出现故障时，网页开发者便可以通过远程服务器的中转能力获取到第一终端的内核数据，进而可以根据内核数据精确定位网页故障原因数据，实现快速有效地确定故障网页的问题所在，避免了因网页开发者无法与远程用户的第一终端相连接，而造成的不能获取到内核数据进而只能猜测可能出现的问题或模拟问题现场，致使需消耗大量人力物力的缺陷，该种网页调试方式的适用范围较为广泛，效果较佳，智能性较优。

图6是本发明实施例提供的一种网页调试装置的结构示意图。参见图6，本发明实施例提供的装置应用于远程服务器，包括第一接收模块601、第一发送模块602、第二接收模块603和第二接收模块604。

第一接收模块601，用于接收第一终端发送的内核数据；

第一发送模块602，用于将内核数据发送给第二终端，由第二终端根据内核数据生成并发送调试指令；

第二接收模块603，用于接收第二终端发送的调试指令；

第二发送模块604，用于将调试指令发送至第一终端，由第一终端执行调试指令实现网页调试。

在另一个实施例中，该装置还包括：

第一接收模块601，用于通过第一端口接收第一终端发送的请求调试指令，

第一确定模块605，用于根据请求调试指令确定与第一端口匹配的第二端口，第一端口为第一网络协议端口，第二端口为第二网络协议端口；

第一发送模块602，用于通过第二端口将请求调试指令转发给第二终端，由第二终端根据请求调试指令发送第一连接请求；

第二接收模块603，用于通过第二端口接收第二终端发送的第一连接请求；

第二发送模块604，用于通过第一端口向第一终端发送第一连接请求；

第一接收模块601，还用于通过第一端口接收第一终端发送的第一确认连接响应，完成第一通信连接的建立，实现第一端口与第二端口的绑定。

在另一个实施例中，第一接收模块601，还用于通过第一端口接收第一终端发送的内核数据；

第一发送模块602，还用于通过第二端口将内核数据发送给第二终端。

在另一个实施例中，该装置还包括：

第二接收模块603，用于通过第三端口接收第二终端发送的第二连接请求；

第二确定模块606，用于根据第二连接请求确定与第三端口匹配的第四端口，第三端口为第二网络协议端口，第四端口为第一网络协议端口；

第二发送模块604，还用于通过第四端口向第一终端发送第二连接请求；

第一接收模块601，还用于通过第四端口接收第一终端发送的第二确认连接响应，完成第二通信连接的建立，实现第三端口与第四端口的绑定。

在另一个实施例中，第二接收模块603，还用于通过第三端口接收第二终端发送的调试指令；

第二发送模块604，还用于通过第四端口将调试指令发送给第一终端。

本发明实施例提供的装置，通过远程服务器将第一终端与第二终端间接相连，由于远程服务器对通信距离不进行限制，因此通过远程服务器第二终端可以与远程用户的第一终端进行数据传输，这样在网页出现故障时，网页开发者便可以通过远程服务器的中转能力获取到第一终端的内核数据，进而可以根据内核数据精确定位网页故障原因数据，实现快速有效地确定故障网页的问题所在，避免了因网页开发者无法与远程用户的第一终端相连接，而造成的不能获取到内核数据进而只能猜测可能出现的问题或模拟问题现场，致使需消耗大量人力物力的缺陷，该种网页调试方式的适用范围较为广泛，效果较佳，智能性较优。

图7是本发明实施例提供的一种网页调试装置的结构示意图。参见图7，本发明实施例提供的装置应用于第二终端，包括接收模块701，生成模块702和发送模块703。

该接收模块701，用于接收远程服务器发送的内核数据，内核数据由第一终端发送给远程服务器；

该生成模块702，用于根据内核数据生成调试指令；

该发送模块703，用于将调试指令发送至远程服务器，由远程服务器在接收到第二终端发送的调试指令后，将调试指令发送至第一终端，由第一终端执行调试指令实现网页调试。

在另一个实施例中，该接收模块701，还用于接收远程服务器通过第二端口发送的请求调试指令，请求调试指令由远程服务器通过第一端口接收到，请求调试指令由第一终端发送给远程服务器，第一端口与第二端口匹配，第一端口为第一网络协议端口，第二端口为第二网络协议端口；

该发送模块703，还用于获取第一连接请求，将第一连接请求发送至远程服务器的第二端口，由远程服务器在接收到第一连接请求后，通过第一端口将第一连接请求发送至第一终端，以在远程服务器通过第一端口接收到第一终端发送的第一确认连接响应后，完成第一通信连接的建立，实现第一端口与第二端口的绑定。

在另一个实施例中，该接收模块701，还用于接收远程服务器通过第二端口发送的内核数据；其中，内核数据由远程服务器通过第一端口接收到。

在另一个实施例中，该发送模块，还用于获取第二连接请求，将第二连接请求发送至远程服务器的第三端口，由远程服务器通过第四端口将第二连接请求发送至第一终端，以在接收到第一终端通过第四端口发送的第二确认连接响应后，完成第二通信连接的建立，实现第三端口与第四端口的绑定；

其中，第三端口与第四端口匹配，第三端口为第二网络协议端口，第四端口为第一网络协议端口。

在另一个实施例中，该发送模块703，还用于将调试指令发送至远程服务器的第三端口，由远程服务器在接收到第二终端发送的调试指令后，通过第四端口将调试指令发送至第一终端。

在另一个实施例中，该生成模块702，还用于根据内核数据生成调试页面，调试页面上包括确认调试选项和故障页面；显示调试页面；在检测到确认调试选项的触发操作后，根据故障原因数据生成调试指令，故障原因数据基于故障页面定位得到。

本发明实施例提供的装置，通过远程服务器将第一终端与第二终端间接相连，由于远程服务器对通信距离不进行限制，因此通过远程服务器第二终端可以与远程用户的第一终端进行数据传输，这样在网页出现故障时，网页开发者便可以通过远程服务器的中转能力获取到第一终端的内核数据，进而可以根据内核数据精确定位网页故障原因数据，实现快速有效地确定故障网页的问题所在，避免了因网页开发者无法与远程用户的第一终端相连接，而造成的不能获取到内核数据进而只能猜测可能出现的问题或模拟问题现场，致使需消耗大量人力物力的缺陷，该种网页调试方式的适用范围较为广泛，效果较佳，智能性较优。

图8是本发明实施例提供的一种网页调试装置的结构示意图。参见图8，本发明实施例提供的装置应用于第一终端，包括发送模块801、接收模块802和执行模块803。

该发送模块801，用于将内核数据发送至远程服务器，由远程服务器将内核数据发送给第二终端，由第二终端在接收到内核数据后，根据内核数据生成调试指令，将调试指令发送至远程服务器；

该接收模块802，用于接收远程服务器发送的调试指令；

该执行模块803，用于执行调试指令实现网页调试。

在另一个实施例中，该接收模块802，还用于在将请求调试指令发送至远程服务器的第一端口后，接收远程服务器通过第一端口发送的第一连接请求，第一连接请求由第二终端在接收到远程服务器通过第二端口发送的请求调试指令后，发送给远程服务器，第一端口与第二端口匹配，第一端口为第一网络协议端口，第二端口为第二网络协议端口；

该发送模块801，还用于向远程服务器的第一端口发送第一确认连接响应，完成第一通信连接的建立，实现第一端口和第二端口的绑定。

在另一个实施例中，该发送模块801，用于将内核数据发送至远程服务器的第一端口，由远程服务器通过第二端口将内核数据发送给第二终端。

在另一个实施例中，该接收模块802，还用于在将内核数据发送至远程服务器的第四端口后，接收远程服务器通过第四端口发送的第二连接请求，第二连接请求由第二终端在通过远程服务器的第三端口接收到内核数据后，发送给远程服务器的第三端口，第三端口与第四端口匹配，第三端口为第二网络协议端口，第四端口为第一网络协议端口；

该发送模块801，还用于向远程服务器的第四端口发送第二确认连接响应，完成第二信连接的建立，实现第三端口和第四端口的绑定；

该接收模块802，还用于接收远程服务器通过第四端口发送的调试指令。

本发明实施例提供的装置，通过远程服务器将第一终端与第二终端间接相连，由于远程服务器对通信距离不进行限制，因此通过远程服务器第二终端可以与远程用户的第一终端进行数据传输，这样在网页出现故障时，网页开发者便可以通过远程服务器的中转能力获取到第一终端的内核数据，进而可以根据内核数据精确定位网页故障原因数据，实现快速有效地确定故障网页的问题所在，避免了因网页开发者无法与远程用户的第一终端相连接，而造成的不能获取到内核数据进而只能猜测可能出现的问题或模拟问题现场，致使需消耗大量人力物力的缺陷，该种网页调试方式的适用范围较为广泛，效果较佳，智能性较优。

需要说明的是：上述实施例提供的网页调试装置在进行网页调试时，仅以上述各功能模块的划分进行举例说明，实际应用中，可以根据需要而将上述功能分配由不同的功能模块完成，即将装置的内部结构划分成不同的功能模块，以完成以上描述的全部或者部分功能。另外，上述实施例提供的网页调试装置与网页调试方法实施例属于同一构思，其具体实现过程详见方法实施例，这里不再赘述。

图9是根据一示例性实施例示出的一种服务器，该服务器可以用于实施上述任一示例性实施例示出的远程服务器所执行的网页调试方法。具体来讲：参见图9，该服务器900可因配置或性能不同而产生比较大的差异，可以包括一个或一个以上中央处理器(CentralProcessing Unit，CPU)922(例如，一个或一个以上处理器)和存储器932，一个或一个以上存储应用程序942或数据944的存储介质930(例如一个或一个以上海量存储设备)。其中，存储器932和存储介质930可以是短暂存储或持久存储。存储在存储介质930的程序可以包括一个或一个以上模块(图示没标出)。

服务器900还可以包括一个或一个以上电源928，一个或一个以上有线或无线网络接口950，一个或一个以上输入输出接口958，和/或，一个或一个以上操作系统941，例如Windows ServerTM，Mac OS XTM，UnixTM,LinuxTM，FreeBSDTM等等。一个或者一个以上程序存储于存储器中，且经配置以由一个或者一个以上处理器执行上述一个或者一个以上程序包含用于执行网页调试方法的指令。

本领域普通技术人员可以理解实现上述实施例的全部或部分步骤可以通过硬件来完成，也可以通过程序来指令相关的硬件完成，所述的程序可以存储于一种计算机可读存储介质中，上述提到的存储介质可以是只读存储器，磁盘或光盘等。

以上所述仅为本发明的较佳实施例，并不用以限制本发明，凡在本发明的精神和原则之内，所作的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。

Claims (12)

1.一种网页调试方法，其特征在于，所述方法应用于远程服务器，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述第一终端安装的浏览器中嵌入有数据收集装置，所述数据收集装置用于收集内核中的内核数据，所述方法包括：

通过第一端口接收所述第一终端发送的请求调试指令，根据所述请求调试指令确定与所述第一端口匹配的第二端口；

通过所述第二端口将所述请求调试指令转发给所述第二终端，由所述第二终端根据所述请求调试指令发送第一连接请求；

通过所述第二端口接收所述第二终端发送的第一连接请求，通过所述第一端口向所述第一终端发送所述第一连接请求；

通过所述第一端口接收所述第一终端发送的第一确认连接响应，完成第一通信连接的建立，实现所述第一端口与所述第二端口的绑定；

通过所述第一端口接收所述第一终端发送的内核数据，通过所述第二端口将所述内核数据发送给所述第二终端，由所述第二终端根据所述内核数据生成调试页面，所述调试页面上包括确认调试选项、故障页面、指示所述第一终端已经连接到所述远程服务器的连接提示信息、所述浏览器当前打开的页面信息；显示所述调试页面；在检测到所述确认调试选项的触发操作后，根据故障原因数据生成调试指令，所述故障原因数据基于所述故障页面定位得到；

通过第三端口接收所述第二终端发送的所述调试指令，若所述调试指令的数据格式与所述第一终端支持的数据格式不一致，则将所述调试指令转换成所述第一终端支持的数据格式，通过第四端口将转换后的所述调试指令发送至所述第一终端，由所述第一终端执行转换后的所述调试指令实现网页调试；

其中，所述第一端口和所述第四端口匹配，且均为第一网络协议端口；所述第二端口和所述第三端口匹配，且均为第二网络协议端口。

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

通过第三端口接收所述第二终端发送的第二连接请求，根据所述第二连接请求确定与所述第三端口匹配的第四端口；

通过所述第四端口向所述第一终端发送所述第二连接请求；

通过所述第四端口接收所述第一终端发送的第二确认连接响应，完成第二通信连接的建立，实现所述第三端口与所述第四端口的绑定。

3.一种网页调试方法，其特征在于，所述方法应用于第二终端，所述第二终端与远程服务器连接于同一网络，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述第一终端安装的浏览器中嵌入有数据收集装置，所述数据收集装置用于收集内核中的内核数据，所述方法包括：

接收所述远程服务器通过第二端口发送的请求调试指令，所述请求调试指令由所述远程服务器通过第一端口接收到，所述请求调试指令由所述第一终端发送给所述远程服务器；

获取第一连接请求，将所述第一连接请求发送至所述远程服务器的所述第二端口，由所述远程服务器在接收到所述第一连接请求后，通过所述第一端口将所述第一连接请求发送至所述第一终端，以在所述远程服务器通过所述第一端口接收到所述第一终端发送的第一确认连接响应后，完成第一通信连接的建立，实现所述第一端口与所述第二端口的绑定；

接收所述远程服务器通过第二端口发送的内核数据，所述内核数据由所述第一终端发送，且由所述远程服务器通过所述第一端口接收到；

根据所述内核数据生成调试页面，所述调试页面上包括确认调试选项、故障页面、指示所述第一终端已经连接到所述远程服务器的连接提示信息、所述浏览器当前打开的页面信息；显示所述调试页面；在检测到所述确认调试选项的触发操作后，根据故障原因数据生成所述调试指令，所述故障原因数据基于所述故障页面定位得到；

将所述调试指令发送至所述远程服务器，由所述远程服务器在通过第三端口接收到所述第二终端发送的所述调试指令后，若所述调试指令的数据格式与所述第一终端支持的数据格式不一致，则将所述调试指令转换成所述第一终端支持的数据格式，通过第四端口将转换后的所述调试指令发送至所述第一终端，由所述第一终端执行转换后的所述调试指令实现网页调试；

其中，所述第一端口和所述第四端口匹配，且均为第一网络协议端口；所述第二端口和所述第三端口匹配，且均为第二网络协议端口。

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

获取第二连接请求，将所述第二连接请求发送至所述远程服务器的第三端口，由所述远程服务器通过第四端口将所述第二连接请求发送至所述第一终端，以在接收到所述第一终端通过所述第四端口发送的第二确认连接响应后，完成第二通信连接的建立，实现所述第三端口与所述第四端口的绑定。

5.根据权利要求3所述的方法，其特征在于，所述将所述调试指令发送至所述远程服务器，由所述远程服务器在接收到所述第二终端发送的所述调试指令后，将所述调试指令发送至所述第一终端，包括：

将所述调试指令发送至所述远程服务器的所述第三端口，由所述远程服务器在接收到所述第二终端发送的所述调试指令后，通过所述第四端口将所述调试指令发送至所述第一终端。

6.一种网页调试方法，其特征在于，所述方法包括：

通过第一端口向远程服务器发送请求调试指令，以使所述服务器根据所述请求调试指令确定与所述第一端口匹配的第二端口，通过所述第二端口将所述请求调试指令转发给第二终端，由所述第二终端根据所述请求调试指令向所述远程服务器发送第一连接请求；

通过所述第一端口接收所述远程服务器发送的第一连接请求，生成第一确认连接响应，以在所述远程服务器通过所述第一端口接收到第一确认连接响应后，完成第一通信连接的建立，实现所述第一端口与所述第二端口的绑定；

第一终端向远程服务器发送内核数据；

所述远程服务器在通过第一端口接收所述内核数据后，通过第二端口将所述内核数据发送给第二终端；

所述第二终端 在接收到所述内核数据后，根据所述内核数据生成调试页面，所述调试页面上包括确认调试选项、故障页面、指示所述第一终端已经连接到所述远程服务器的连接提示信息、浏览器当前打开的页面信息；显示所述调试页面；在检测到所述确认调试选项的触发操作后，根据故障原因数据生成调试指令，所述故障原因数据基于所述故障页面定位得到；

所述第二终端将所述调试指令发送给所述远程服务器；

所述远程服务器在通过第三端口接收到所述调试指令后，若判断出所述调试指令的数据格式与所述第一终端支持的数据格式不一致，则将所述调试指令转换成所述第一终端支持的数据格式，通过第四端口将转换后的所述调试指令发送至所述第一终端；

所述第一终端在接收到转换后的所述调试指令后，执行转换后的所述调试指令实现网页调试；

其中，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与所述第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述第一终端安装的浏览器中嵌入有数据收集装置，所述数据收集装置用于收集内核中的内核数据，所述第一端口和所述第四端口匹配，且均为第一网络协议端口；所述第二端口和所述第三端口匹配，且均为第二网络协议端口。

7.一种网页调试装置，其特征在于，所述装置应用于远程服务器，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述远程服务器与第二终端连接于同一网络，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述第一终端安装的内核中嵌入有数据收集装置，所述数据收集装置用于收集内核中的内核数据，所述装置包括：

第一接收模块，用于通过第一端口接收所述第一终端发送的请求调试指令，

第一确定模块，用于根据所述请求调试指令确定与所述第一端口匹配的第二端口，所述第一端口为第一网络协议端口，所述第二端口为第二网络协议端口；

第一发送模块，用于通过所述第二端口将所述请求调试指令转发给所述第二终端，由所述第二终端根据所述请求调试指令发送第一连接请求；

第二接收模块，用于通过所述第二端口接收所述第二终端发送的第一连接请求；

第二发送模块，用于通过所述第一端口向所述第一终端发送所述第一连接请求；

所述第一接收模块，还用于通过所述第一端口接收所述第一终端发送的第一确认连接响应，完成第一通信连接的建立，实现所述第一端口与所述第二端口的绑定；

第一接收模块，用于通过第一端口接收所述第一终端发送的内核数据；

第一发送模块，用于通过第二端口将所述内核数据发送给所述第二终端，由所述第二终端根据所述内核数据生成调试页面，所述调试页面上包括确认调试选项、故障页面、指示所述第一终端已经连接到所述远程服务器的连接提示信息、浏览器当前打开的页面信息；显示所述调试页面；在检测到所述确认调试选项的触发操作后，根据故障原因数据生成调试指令，所述故障原因数据基于所述故障页面定位得到；

第二接收模块，用于通过第三端口接收所述第二终端发送的所述调试指令；若所述调试指令的数据格式与所述第一终端支持的数据格式不一致，则将所述调试指令转换成所述第一终端支持的数据格式，

第二发送模块，用于通过第四端口将转换后的所述调试指令发送至所述第一终端，由所述第一终端执行转换后的所述调试指令实现网页调试；

其中，所述第一端口和所述第四端口匹配，且均为第一网络协议端口；所述第二端口和所述第三端口匹配，且均为第二网络协议端口。

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

所述第二接收模块，用于通过第三端口接收所述第二终端发送的第二连接请求；

第二确定模块，用于根据所述第二连接请求确定与所述第三端口匹配的第四端口，所述第三端口为第二网络协议端口，所述第四端口为第一网络协议端口；

所述第二发送模块，还用于通过所述第四端口向所述第一终端发送所述第二连接请求；

所述第一接收模块，还用于通过所述第四端口接收所述第一终端发送的第二确认连接响应，完成第二通信连接的建立，实现所述第三端口与所述第四端口的绑定。

9.一种网页调试装置，其特征在于，所述装置应用于第二终端，所述第二终端与远程服务器连接于同一网络，所述远程服务器与第一终端位于不同网络，且基于互联网建立通信连接，所述第一终端为用户终端，所述第二终端为网页开发者使用的终端，所述第一终端安装的浏览器中嵌入有数据收集装置，所述数据收集装置用于收集内核中的内核数据，所述装置包括：

发送模块，还用于获取第一连接请求，将所述第一连接请求发送至所述远程服务器的第二端口，由所述远程服务器在接收到所述第一连接请求后，通过第一端口将所述第一连接请求发送至所述第一终端，以在所述远程服务器通过所述第一端口接收到所述第一终端发送的第一确认连接响应后，完成第一通信连接的建立，实现所述第一端口与所述第二端口的绑定；

接收模块，用于接收所述远程服务器通过第二端口发送的内核数据，所述内核数据由所述第一终端发送，且由所述远程服务器通过所述第一端口接收到；

生成模块，用于根据所述内核数据生成调试页面，所述调试页面上包括确认调试选项、故障页面、指示所述第一终端已经连接到所述远程服务器的连接提示信息、所述浏览器当前打开的页面信息；显示所述调试页面；在检测到所述确认调试选项的触发操作后，根据故障原因数据生成调试指令，所述故障原因数据基于所述故障页面定位得到；

发送模块，用于将所述调试指令发送至所述远程服务器，由所述远程服务器在通过第三端口接收到所述第二终端发送的所述调试指令后，若判断出所述调试指令的数据格式与所述第一终端支持的数据格式不一致，则将所述调试指令转换成所述第一终端支持的数据格式，通过第四端口将转换后的所述调试指令发送至所述第一终端，由所述第一终端执行转换后的所述调试指令实现网页调试；

其中，所述第一端口和所述第四端口匹配，且均为第一网络协议端口；所述第二端口和所述第三端口匹配，且均为第二网络协议端口。

10.根据权利要求9所述的装置，其特征在于，所述发送模块，还用于获取第二连接请求，将所述第二连接请求发送至所述远程服务器的第三端口，由所述远程服务器通过第四端口将所述第二连接请求发送至所述第一终端，以在接收到所述第一终端通过所述第四端口发送的第二确认连接响应后，完成第二通信连接的建立，实现所述第三端口与所述第四端口的绑定。

11.一种远程服务器，其特征在于，所述服务器包括一个或一个以上处理器和存储器，所述存储器存储有一个或一个以上程序，所述一个或一个以上程序由所述处理器执行以实现如权利要求1至2中任一项权利要求所述的网页调试方法。

12.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有一个或一个以上程序，所述一个或一个以上程序由处理器执行以实现如权利要求1至2中任一项权利要求所述的网页调试方法。

Images