CN113505070A - 一种代码调试方法、移动终端和计算机设备 - Google Patents

Abstract

本公开涉及一种代码调试方法、移动终端和计算机设备，其中代码调试方法包括在前端代码需要在所述移动终端中进行调试的情况下，获取计算机设备提供的连接相关信息；经由所述连接相关信息与所述计算机设备建立数据连接，并通过所述数据连接接收所述计算机设备发送的调试相关数据；基于所述调试相关数据进行页面调试。通过本公开的代码调试方法移动终端直接与计算机设备建立数据连接，移动终端直接接收计算机设备发送的调试相关数据，由此实现前端代码的调试，从而极大提高了代码调试的效率。

Description

一种代码调试方法、移动终端和计算机设备

技术领域

本公开涉及计算机技术，更具体地，涉及一种代码调试方法、移动终端和计算机设备。

背景技术

前端开发：一般是指PC和移动端网页或者H5页面开发。

移动端：手机端或者Pad等移动设备。

开发调试：指开发的过程对代码进行调试的过程，通过调试可以快速定位到问题。

当前移动端前端功能开发和调试，大致有两种方案：

方案一：页面直接部署到服务端，移动端直接加载服务端的网页资源，然后展示。但存在的问题是：页面展示效率低速度慢问题也较为突出，页面每次加载都要把当前加载页面所需要的所有资源通过网络进行加载后展示，体验不好。

方案二：通过把前端资源进行打包，然后通过内置到移动端App或者放到服务端通过预加载的方式，是当前比较好的方案。但是当前方案也带来了开发调试不方便的问题。但开发的过程中如果需要在设备上进行调试，需要把功能部署到服务器上，然后移动端通过网络把资源包进行加载到本地，再由移动端WebView进行加载展示；或者把打好的前端资源包手动拷贝到移动端相关目录，由移动端主动加载展示。但此方案的主要问题是开发调试比较麻烦，通过网络加载的方式需要的时间较长，手动拷贝包的方案每次需要操作的步骤很多，都很不方便。

发明内容

旨在提供一种代码调试方法、移动终端和计算机设备，用以实现快速调试移动前端页面，提高前端代码的开发效率。

在第一方面，本公开的实施例提供了一种代码调试方法，应用于移动终端侧，包括：在前端代码需要在所述移动终端中进行调试的情况下，获取计算机设备提供的连接相关信息；经由所述连接相关信息与所述计算机设备建立数据连接，并通过所述数据连接接收所述计算机设备发送的调试相关数据；基于所述调试相关数据进行页面调试。

在第二方面，本公开的实施例提供了一种代码调试方法，应用于计算机设备侧，包括：在前端代码需要在移动终端中进行调试的情况下，向所述移动终端提供自身的连接相关信息；在经由所述连接相关信息与所述移动终端建立数据连接之后，通过所述数据连接向所述移动终端发送调试相关数据。

在第三方面，本公开的实施例提供了一种移动终端，包括：所述移动终端包括第一处理器、第一存储器及第一通信总线；所述第一通信总线被配置为实现所述第一处理器和所述第一存储器之间的连接通信；所述第一处理器被配置为执行所述第一存储器中存储的一个或者多个计算机程序，以实现前述的代码调试方法的步骤。

在第四方面，本公开的实施例提供了一种计算机设备，包括：所述移动终端包括第二处理器、第二存储器及第二通信总线；所述第二通信总线被配置为实现所述第二处理器和所述第二存储器之间的连接通信；所述第二处理器被配置为执行所述第二存储器中存储的一个或者多个计算机程序，以实现前述的代码调试方法的步骤。

利用根据本公开的各个实施例的一种代码调试方法、移动终端和计算机设备，通过移动终端直接与计算机设备建立数据连接，通过计算机设备向移动终端直接发送调试相关数据，由此可以解决仅通过移动终端进行调试加载数据出现的需要把当前加载页面所需要的所有资源通过网络进行加载后展示，从而导致的体验不好的问题。也能够解决移动端通过网络把资源包进行加载到本地，再由移动端WebView进行加载展示，过程中出现的等待时间长的问题。

附图说明

在不一定按比例绘制的附图中，相同的附图标记可以在不同的视图中描述相似的部件。具有字母后缀或不同字母后缀的相同附图标记可以表示相似部件的不同实例。附图大体上通过举例而不是限制的方式示出各种实施例，并且与说明书以及权利要求书一起用于对所公开的实施例进行说明。这样的实施例是例证性的，而并非旨在作为本装置或方法的穷尽或排他实施例。

图1示出根据本公开实施例的在移动终端侧的代码调试方法基本流程示意图。

图2示出根据本公开实施例的在移动终端与计算机设备建立TCP连接的流程示意图。

图3示出根据本公开实施例的在计算机设备侧的代码调试方法基本流程示意图。

具体实施方式

为使本领域技术人员更好的理解本公开的技术方案，下面结合附图和具体实施方式对本公开作详细说明。下面结合附图和具体实施例对本公开的实施例作进一步详细描述，但不作为对本公开的限定。

本公开中使用的“第一”、“第二”以及类似的词语并不表示任何顺序、数量或者重要性，而只是用来区分。“包括”或者“包含”等类似的词语意指在该词前的要素涵盖在该词后列举的要素，并不排除也涵盖其他要素的可能。

本公开的实施例提供了一种代码调试方法，应用于移动终端侧，在前端代码需要在所述移动终端中进行调试的情况，如图1所示，本公开实施例始于步骤S101、获取计算机设备提供的连接相关信息。也即本示例中，终端在进行代码调试之前，需要首先与计算机设备建立连接。本示例中的计算机设备可以是PC、笔记本电脑、PDA、工作站等具备代码调试功能的运算设备。移动终端可以是智能手机、平板电脑、具备显示屏的智能手表、智能手环等。然后，S102、经由所述连接相关信息与所述计算机设备建立数据连接。接着步骤S103、通过所述数据连接接收所述计算机设备发送的调试相关数据。本示例中所描述的移动终端与计算机设备建立的数据连接可以是有线或者无线的连接方式。也即可以利用所建立的数据连接实现移动终端能够通过数据连接接收计算机设备发送的调试相关数据即可，具体的连接方式在此不做限定。最后移动终端在接收到调试相关数据之后，步骤S104、基于所述调试相关数据进行页面调试。也即移动终端可以直接基于获取到的调试相关数据进行代码调试，由此实现无需通过网络从服务器加载资源包，再由移动端WebView进行加载展示的复杂过程。由于计算机设备中实时在进行页面资源的调试，而移动终端仅接收相应的调试相关数据，因此实质的调试工作可以通过计算机设备实时完成，避免了仅通过移动终端进行代码调试时，需要加载所有的资源所带来的体验差的问题。

在一实施方式中，所述获取计算机设备提供的连接相关信息包括：通过扫描所述计算机设备提供的二维码信息获取所述连接相关信息；其中，所述连接相关信息包括所述计算机设备的IP地址、端口号和页面关联数据。本示例中，可以通过移动终端的扫描功能来扫描计算机设备提供的二维码信息。也即计算机设备可以将连接相关信息整合为二维码的形式向移动终端进行展示。由此移动终端可以通过扫描的方式快速获取到连接相关信息，进一步提高代码调试的效率。在一示例中，计算机设备可以在整合生成二维码信息之后，以图片或者链接的形式发送给移动终端，移动终端在收到链接的情况下，可以通过链接获取相应的包含二维码信息的图片。由此移动终端可以直接利用自身的屏幕扫描功能来获取到连接相关信息。

例如可以在APP内设置有多个子模块，不同的子模块下包含若干个页面。因此本示例中，移动终端获取到的获取连接相关信息可以包括所述计算机设备的IP地址、端口号和页面关联数据。页面关联数据可以包括目标调试模块，目标调试页面以及对应的页面的链接信息。也即本示例中移动终端可以根据IP地址和端口号实现与计算机设备的连接。而移动终端通过页面关联数据可以快速地跳转到所要进行调试的目标APP以及相应的页面。由此极大提高代码调试的效率。

在一实施方式中，所述基于所述连接相关信息与所述计算机设备建立数据连接包括：基于所述连接相关信息通过局域网，向所述计算机设备发送TCP连接请求，并响应于所述计算机设备返回的连接确认信息与所述计算机设备建立TCP连接。本示例中可以通过将移动终端和计算机设备设置在同一网络环境下，从而移动终端可以与计算机设备建立数据连接。本示例中以建立TCP连接为例进行举例说明。如图2所示，在移动终端与计算机设备的连接建立阶段：第一次握手：移动终端的应用进程可以主动打开，并向PC发出请求报文段。其首部中：SYN＝1，seq＝x，示例性的，SYN表示同步序列编号，seq表示TCP序列号，seq＝x表示的是发送方(移动终端)的初始序号。第二次握手：PC应用进程可以被动打开。若同意客户端的请求，则发回确认报文，其首部中：SYN＝1(不变)，ACK＝1，ack＝x+1，seq＝y，其中ACK表示确认消息，其否定响应为NAK。seq＝y表示接收方(PC)的初始序号，ack表示下一次握手期望的发送方(移动终端)的seq序列号，如图2中第三次握手终端发送的seq＝x+1。第三次握手：移动终端收到确认报文之后，通知上层应用进程连接已建立，并向PC发出确认报文，其首部：ACK＝1，seq＝x+1，ack＝y+1。当PC收到客户端的确认报文之后，也通知其上层应用进程连接已建立。当然在移动终端与计算机设备不在同一局域网环境下的时候，移动终端也可以根据计算机设备提供的连接信息，通过HTTP与计算机设备建立数据连接。在局域网环境下建立TCP连接的方式可以便于开发者或者调试者，在没有佩带数据线的情况下，通过计算机设备基于任意的移动终端实现前端页面代码调试。从而可以实现随时随地进行代码调试。

作为另外一种可选的实施方式，移动终端与PC还可以通过USB接口与所述计算机设备建立所述数据连接。通过直接的数据直连也可以快速与计算机设备建立数据连接。直接连接的方式数据传输稳定，调试效率高。

在一实施方式中，判定前端代码需要在所述移动终端中进行调试的流程可以包括如下步骤，在与计算机设备建立连接之后，接收到计算机设备发送的预调试信号，由此移动终端设备可以根据该预调试信号进入调试状态，例如打开调试界面，等待计算机设备发送调试相关数据。又比如移动终端可以对当前建立的局域网连接进行检测，判定当前建立的连接是否为TCP连接，在确定所建立的连接为TCP连接的情况下，跳转至调试页面。还可以在建立USB连接之后，进入USB调试模式，检测是否收到计算机设备通过USB数据线发送的调试请求，可以基于该调试请求，进入相应的调试页面。

在一实施方式中，在基于所述调试数据进行页面调试之后，所述代码调试方法还包括：实时展示页面调试结果。具体的说，可以在移动终端中实时展示页面调试的进度调试的结果等信息，从而给调试者给予有效的信息反馈。也即本申请中通过计算机设备将正在进行调试的页面资源进行打包成调试相关数据，由此调试者可以便捷利用计算机设备的调试性能并通过移动终端实时反映出调试结果，从而有效提高前端代码的调试效率。

在一实施方式中，在所述计算机设备更新所述调试相关数据的情况下，通过所述数据连接接收所述计算机设备发送的调试更新数据。具体的说，本示例中可以通过移动终端对整个前端代码调试的过程进行展示，在计算机设备存在更新调试相关数据的时候，可以基于在先建立的数据连接接收调试更新数据，并执行步骤S105、基于调试更新数据进行页面调试并实时展示，由此达到实时调试的目的，极大提高移动终端前端页面的调试效率。

在第二方面，本公开的实施例提供了一种代码调试方法，应用于计算机设备侧，在前端代码需要在移动终端中进行调试的情况下。计算机设备在进行代码调试之前，需要首先与移动终端建立连接。本示例中的计算机设备可以是PC、笔记本电脑、PDA、工作站等具备代码调试功能的运算设备。移动终端可以是智能手机、平板电脑、具备显示屏的智能手表、智能手环等。如图3所示，本公开的代码调试方法可以包括：步骤301、向所述移动终端提供自身的连接相关信息。计算机设备向移动终端提供自身的连接相关信息，以便于移动终端可以根据该连接相关信息连接到本计算机设备。步骤302、经由所述连接相关信息与所述移动终端建立数据连接。本示例中所描述的计算机设备与移动终端建立的数据连接可以是有线或者无线的连接方式。也即可以利用所建立的数据连接向移动终端发送调试相关数据即可，具体的连接方式在此不做限定。最后步骤303、通过所述数据连接向所述移动终端发送调试相关数据。也即计算机设备可以将正在进行调试的页面资源打包为调试相关数据，并将调试相关数据发送给移动终端，从而实现移动终端也可以基于调试相关数据实时进行页面调试和展示。由此本公开实施例的代码调试方法提高了开发调试的效率。

在一实施方式中，所述连接相关信息包括所述计算机设备的IP地址、端口号和页面关联数据，所述向所述移动终端提供自身的连接相关信息包括：基于所述连接相关信息生成二维码信息，并向所述移动终端展示所述二维码信息。本示例中计算机设备可以将自身的连接相关信息打包然后生成二维码信息。移动终端可以通过扫描功能来扫描计算机设备提供的二维码信息，并获取该连接相关信息。当然作为另外一种示例，计算机设备在生成二维码信息之后直接将包含二维码信息的图片发送至移动终端，或者，极端情况下也可以不通过打包生成二维码的方式，直接将连接相关信息发送给移动终端。由此移动终端可以输入相应的连接相关信息，从而计算机设备与移动终端之间建立数据连接。

在一实施方式中，所述基于所述连接相关信息与所述移动终端建立数据连接包括：在接收所述移动终端基于所述连接相关信息通过局域网发送的TCP连接请求后，向所述移动终端发送连接确认信息；或者，在监测所述移动终端接入USB接口的情况下，通过所述USB接口与所述移动终端建立所述数据连接。具体的采用TCP的方式还是HTTP的方式可以根据计算机设备与移动终端所处的网络环境决定，具体的建立TCP连接的过程参见前述，在此不再赘述。通过TCP的方式或者HTTP的方式能够让调试者在多种场合下完成终端页面的前端代码的调试，方便快捷。本示例中计算机设备还可以监测USB接口的状态，在监测到移动终端接入USB接口的情况下，可以直接通过USB与移动终端建立有线的数据连接。相比TCP连接，USB有线的连接数据传输更加稳定。

在一实施方式中，向所述移动终端发送调试相关数据之后，所述调试方法还包括：实时展示页面调试结果。本示例中计算机设备对正在进行调试的前端代码或者网页资源在计算机设备中进行展示。具体的说，可以在计算机设备中实时展示页面调试的进度调试的结果等信息，同时也可以在移动终端中对正在进行调试的页面进行实时展示，从而给调试者给予有效的信息反馈。在计算机设备更新所述调试相关数据的情况下，执行步骤304、通过所述数据连接向所述移动终端发送调试更新数据，由此达到实时调试的目的，极大提高移动终端前端页面的调试效率。

在第三方面，本公开的实施例提供了一种移动终端，包括：所述移动终端包括第一处理器、第一存储器及第一通信总线；所述第一通信总线被配置为实现所述第一处理器和所述第一存储器之间的连接通信；所述第一处理器被配置为执行所述第一存储器中存储的一个或者多个计算机程序，以实现前述的代码调试方法的步骤。

在第四方面，本公开的实施例提供了一种计算机设备，包括：所述移动终端包括第二处理器、第二存储器及第二通信总线；所述第二通信总线被配置为实现所述第二处理器和所述第二存储器之间的连接通信；所述第二处理器被配置为执行所述第二存储器中存储的一个或者多个计算机程序，以实现前述的代码调试方法的步骤。

在根据本公开的实施例中，第一处理器和第二处理器均可以是包括一个以上通用处理设备的处理设备，诸如微处理器、中央处理单元(CPU)、图形处理单元(GPU)等。更具体地，该处理器可以是复杂指令集计算(CISC)微处理器、精简指令集计算(RISC)微处理器、超长指令字(VLIW)微处理器、运行其他指令集的处理器或运行指令集的组合的处理器。该处理器还可以是一个以上专用处理设备，诸如专用集成电路(ASIC)、现场可编程门阵列(FPGA)、数字信号处理器(DSP)、片上系统(SoC)等。处理器1012可以通信地耦合到存储器并且被配置为执行存储在其上的计算机可执行指令，以执行诸如根据本公开各实施例的对生物样品进行三维成像的方法。

在一些实施例中，第一存储器/储存器、第二存储器/储存器均可以是非暂时性计算机可读的介质，诸如只读存储器(ROM)、随机存取存储器(RAM)、相变随机存取存储器(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、电可擦除可编程只读存储器(EEPROM)、其他类型的随机存取存储器(RAM)、闪存盘或其他形式的闪存、缓存、寄存器、静态存储器、光盘只读存储器(CD-ROM)、数字通用光盘(DVD)或其他光学存储器、盒式磁带或其他磁存储设备，或被用于储存能够被计算机设备访问的信息或指令的任何其他可能的非暂时性的介质等。

此外，尽管已经在本文中描述了示例性实施例，其范围包括任何和所有基于本公开的具有等同元件、修改、省略、组合(例如，各种实施例交叉的方案)、改编或改变的实施例。权利要求书中的元件将被基于权利要求中采用的语言宽泛地解释，并不限于在本说明书中或本申请的实施期间所描述的示例，其示例将被解释为非排他性的。因此，本说明书和示例旨在仅被认为是示例，真正的范围和精神由以下权利要求以及其等同物的全部范围所指示。

以上描述旨在是说明性的而不是限制性的。例如，上述示例(或其一个或更多方案)可以彼此组合使用。例如本领域普通技术人员在阅读上述描述时可以使用其它实施例。另外，在上述具体实施方式中，各种特征可以被分组在一起以简单化本公开。这不应解释为一种不要求保护的公开的特征对于任一权利要求是必要的意图。相反，本公开的主题可以少于特定的公开的实施例的全部特征。从而，以下权利要求书作为示例或实施例在此并入具体实施方式中，其中每个权利要求独立地作为单独的实施例，并且考虑这些实施例可以以各种组合或排列彼此组合。本发明的范围应参照所附权利要求以及这些权利要求赋权的等同形式的全部范围来确定。

以上实施例仅为本公开的示例性实施例，不用于限制本发明，本发明的保护范围由权利要求书限定。本领域技术人员可以在本公开的实质和保护范围内，对本发明做出各种修改或等同替换，这种修改或等同替换也应视为落在本发明的保护范围内。

Claims (10)

1.一种代码调试方法，其特征在于，应用于移动终端侧，包括：

在前端代码需要在所述移动终端中进行调试的情况下，获取计算机设备提供的连接相关信息；

经由所述连接相关信息与所述计算机设备建立数据连接，并通过所述数据连接接收所述计算机设备发送的调试相关数据；

基于所述调试相关数据进行页面调试。

2.如权利要求1所述的代码调试方法，其特征在于，所述获取计算机设备提供的连接相关信息包括：

通过扫描所述计算机设备提供的二维码信息获取所述连接相关信息；

其中，所述连接相关信息包括所述计算机设备的IP地址、端口号和页面关联数据。

3.如权利要求2所述的代码调试方法，其特征在于，所述基于所述连接相关信息与所述计算机设备建立数据连接包括：

基于所述连接相关信息通过局域网，向所述计算机设备发送TCP连接请求，并响应于所述计算机设备返回的连接确认信息与所述计算机设备建立TCP连接；或者，

通过USB接口与所述计算机设备建立所述数据连接。

4.如权利要求1所述的代码调试方法，其特征在于，在基于所述调试数据进行页面调试之后，所述代码调试方法还包括：

实时展示页面调试结果；以及，

在所述计算机设备更新所述调试相关数据的情况下，通过所述数据连接接收所述计算机设备发送的调试更新数据。

5.一种代码调试方法，其特征在于，应用于计算机设备侧，包括：

在前端代码需要在移动终端中进行调试的情况下，向所述移动终端提供自身的连接相关信息；

在经由所述连接相关信息与所述移动终端建立数据连接之后，基于所述数据连接向所述移动终端发送调试相关数据。

6.如权利要求5所述的代码调试方法，其特征在于，所述连接相关信息包括所述计算机设备的IP地址、端口号和页面关联数据，所述向所述移动终端提供自身的连接相关信息包括：

基于所述连接相关信息生成二维码信息，并向所述移动终端展示所述二维码信息。

7.如权利要求6所述的代码调试方法，其特征在于，所述基于所述连接相关信息与所述移动终端建立数据连接包括：

在接收所述移动终端基于所述连接相关信息通过局域网发送的TCP连接请求后，向所述移动终端发送连接确认信息；或者，

在监测所述移动终端接入USB接口的情况下，通过所述USB接口与所述移动终端建立所述数据连接。

8.如权利要求5所述的代码调试方法，其特征在于，向所述移动终端发送调试相关数据之后，所述调试方法还包括：

实时展示页面调试结果；以及，

在更新所述调试相关数据的情况下，通过所述数据连接向所述移动终端发送调试更新数据。

9.一种移动终端，其特征在于，包括：所述移动终端包括第一处理器、第一存储器及第一通信总线；

所述第一通信总线被配置为实现所述第一处理器和所述第一存储器之间的连接通信；

所述第一处理器被配置为执行所述第一存储器中存储的一个或者多个计算机程序，以实现如权利要求1-4中任一项所述的代码调试方法的步骤。

10.一种计算机设备，其特征在于，包括：所述移动终端包括第二处理器、第二存储器及第二通信总线；

所述第二通信总线被配置为实现所述第二处理器和所述第二存储器之间的连接通信；

所述第二处理器被配置为执行所述第二存储器中存储的一个或者多个计算机程序，以实现如权利要求5-8中任一项所述的代码调试方法的步骤。

Images