Webpage debugging method and device, electronic equipment and storage medium

By receiving and updating web code files in a web browser and combining AI technology to analyze and debug error reports, the problem of poor efficiency and flexibility of existing web debugging tools is solved, and efficient and flexible web debugging and development is achieved.

CN120029885APending Publication Date: 2025-05-23GUANGZHOU FAISCO INFORMATON TECH
View PDF 0 Cites 0 Cited by

Patent Information

Application Number
CN202510113673.6
Authority / Receiving Office
CN · China
Patent Type
Applications(China)
Current Assignee / Owner
Filing Date
2025-01-24
Publication Date
2025-05-23

AI Technical Summary

Technical Problem

The existing web debugging tools are poor in efficiency and flexibility, lack recording functions, inconvenient operation, difficult to modify code in real time, and single functions, which cannot meet the needs of fast updates and efficient debugging.

Method used

A web debugging method is proposed, which can realize code debugging and real-time preview by receiving web code files in a web browser, generating code update files and dynamically transmitting them through browser plug-ins, and optimize code files by combining AI technology to analyze and debug error information.

Benefits of technology

It improves the efficiency and flexibility of web page debugging, realizes dynamic code updates and real-time debugging, and combines AI technology to quickly locate and solve problems, greatly improving the efficiency of web page development.

✦ Generated by Eureka AI based on patent content.

Smart Images

  • Figure CN120029885A_ABST
    Figure CN120029885A_ABST
Patent Text Reader

Abstract

The invention discloses a webpage debugging method and device, electronic equipment and a storage medium, and the method comprises the steps: responding to a webpage access operation carried out in a webpage browser, and receiving a webpage code file corresponding to a target webpage; in response to a code updating instruction for the webpage code file, generating a corresponding code updating file, and transmitting the code updating file to the webpage browser through a browser plug-in; and responding to a code debugging instruction, analyzing the code updating file through the webpage browser, and receiving a webpage debugging result returned by the webpage browser. The webpage code can be dynamically updated, webpage dynamic debugging is achieved, the webpage debugging efficiency and flexibility are improved, and the webpage debugging method and device can be widely applied to the technical field of the internet.
Need to check novelty before this filing date? Find Prior Art

Description

Technical Field

[0001] The present application relates to the field of Internet technology, and in particular to a web page debugging method, device, electronic device and storage medium. Background Art

[0002] With the comprehensive and in-depth development of Internet technology, more and more online applications are implemented based on web pages. Large Internet platforms, especially some portal websites and live broadcast websites, involve a large number of pages to be developed, operated and maintained. The time for development and testing is often relatively tight, and the web pages must be updated quickly, which inevitably puts huge pressure on web page testers.

[0003] Traditional web debugging tools are mainly based on the debugging tools that come with web browsers, and the debugging tools that come with web browsers have platform differences. Although the debugging tools between various web browsers have been unified as much as possible, there are still certain differences in fact. The existing debugging tools have many disadvantages, as follows:

[0004] 1) There is no record of debugging. Each new debugging will overwrite the old debugging. The debugging action is temporary and easy to forget, which is not conducive to problem analysis and troubleshooting.

[0005] 2) The operation is not convenient enough, the debugging content and debugging results are not intuitive enough, it is easy to get confused, the event debugging is limited, and the plane is not three-dimensional enough;

[0006] 3) It is difficult to modify the code in real time. It is not possible to modify, adjust and view the code at the same time, which is inconvenient to troubleshoot problems and is time-consuming and laborious.

[0007] 4) The debugging function is relatively simple, not rich and comprehensive enough, with few iterations, basically no changes, and cannot be expanded.

[0008] Therefore, the efficiency and flexibility of web page debugging are poor when using the debugging tools provided by the web page browser. Summary of the invention

[0009] The main purpose of the embodiments of the present application is to provide a web page debugging method, device, electronic device and storage medium, which can improve the efficiency and flexibility of web page debugging.

[0010] On the one hand, an embodiment of the present application provides a web page debugging method, the method comprising the following steps:

[0011] In response to a web page access operation performed in a web browser, receiving a web page code file corresponding to a target web page;

[0012] In response to a code update instruction for the webpage code file, generating a corresponding code update file, and dynamically transmitting the code update file to the webpage browser via a browser plug-in;

[0013] In response to the code debugging instruction, the code update file is parsed by the web browser, and a web page debugging result returned by the web browser is received.

[0014] In some embodiments, the method further comprises:

[0015] Determine whether the webpage debugging result includes debugging error information;

[0016] Analyze and process the debugging error information to generate corresponding code optimization information, and modify the code update file according to the code optimization information to generate a corresponding code optimization file;

[0017] The code optimization file is dynamically transmitted to the web browser through the browser plug-in, and the web browser is used to parse the code optimization file and generate a corresponding preview page.

[0018] In some embodiments, in response to a web page access operation performed in a web browser, receiving a web page code file corresponding to a target web page specifically includes:

[0019] In response to the webpage access operation, obtaining the webpage code file through the browser plug-in;

[0020] Receiving the web page code file transmitted by the browser plug-in;

[0021] The webpage code file is parsed to generate corresponding multiple code blocks and multiple event blocks.

[0022] In some embodiments, in response to the code debugging instruction, parsing the code update file by the web browser and receiving the web debugging result returned by the web browser specifically includes:

[0023] In response to the code debugging instruction, the code update file is parsed by the web browser, and a web page debugging result returned by the web browser is received by the browser plug-in;

[0024] Receive the webpage debugging result returned by the browser plug-in.

[0025] In some embodiments, the analyzing and processing the debugging error information to generate corresponding code optimization information, and modifying the code update file according to the code optimization information to generate a corresponding code optimization file specifically includes:

[0026] Calling a code correction interface, locating a corresponding code block to be corrected in the code update file according to the debugging error information, analyzing and optimizing the code block to be corrected, and generating a corresponding plurality of optimized code blocks;

[0027] In response to a code block selection instruction, the corresponding target optimized code block is determined from the plurality of optimized code blocks, and the code block to be corrected in the code update file is replaced with the target optimized code block to generate the corresponding code optimized file.

[0028] In some embodiments, in response to the code update instruction for the webpage code file, generating a corresponding code update file, and dynamically transmitting the code update file to the webpage browser via a browser plug-in specifically includes:

[0029] In response to the code update instruction, determining a number of corresponding code blocks to be updated from the plurality of code blocks;

[0030] In response to a code update operation on each of the to-be-updated code blocks, generating an updated code block corresponding to each of the to-be-updated code blocks;

[0031] The code block to be updated in the webpage code file is replaced with the corresponding updated code block to generate the code update file.

[0032] In some embodiments, the method further comprises:

[0033] The web page debugging result, the web page code file, the code update file and the code optimization file are bound to generate and store corresponding web page debugging record information.

[0034] On the other hand, an embodiment of the present application provides a web page debugging device, the device comprising:

[0035] The first module is used to receive a web page code file corresponding to a target web page in response to a web page access operation performed in a web browser;

[0036] A second module is used to generate a corresponding code update file in response to a code update instruction for the webpage code file, and dynamically transmit the code update file to the webpage browser through a browser plug-in;

[0037] The third module is used to respond to the code debugging instruction, parse the code update file through the web browser, and receive the web debugging result returned by the web browser.

[0038] On the other hand, an embodiment of the present application provides an electronic device, which includes a memory and a processor, wherein the memory stores a computer program, and the processor implements the web page debugging method described above when executing the computer program.

[0039] On the other hand, an embodiment of the present application provides a computer-readable storage medium, wherein the computer-readable storage medium stores a computer program, and when the computer program is executed by a processor, the web page debugging method described above is implemented.

[0040] The embodiments of the present application include at least the following beneficial effects: the present application provides a web page debugging method, device, electronic device and storage medium, which receives the web page code file corresponding to the target web page in response to the web page access operation performed in the web browser, generates the corresponding code update file in response to the code update instruction for the web page code file, and dynamically transmits the code update file to the web browser through the browser plug-in, and parses the code update file through the web browser in response to the code debugging instruction, and receives the web page debugging result returned by the web browser. The present application can dynamically update the web page code and realize dynamic debugging of the web page, thereby improving the efficiency and flexibility of web page debugging. BRIEF DESCRIPTION OF THE DRAWINGS

[0041] The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the invention and, together with the description, serve to explain the principles of the invention.

[0042] In order to more clearly illustrate the embodiments of the present invention or the technical solutions in the prior art, the drawings required for use in the embodiments or the description of the prior art will be briefly introduced below. Obviously, for ordinary technicians in this field, other drawings can be obtained based on these drawings without paying any creative labor.

[0043] Figure 1 is a flow chart of a web page debugging method provided by an embodiment of the present application;

[0044] Figure 2 It is a structural diagram of a web page debugging architecture in an embodiment of the present application;

[0045] Figure 3 It is a structural diagram of a web page debugging device provided in an embodiment of the present application;

[0046] Figure 4 It is a schematic diagram of the hardware structure of an electronic device provided in an embodiment of the present application. DETAILED DESCRIPTION

[0047] In order to make the purpose, technical solutions and advantages of the present application clearer, the present application is further described in detail below in conjunction with the accompanying drawings and examples. It should be understood that the specific embodiments described herein are only used to explain the present application and are not intended to limit the present application. When the following description refers to the drawings, unless otherwise indicated, the same numbers in different drawings represent the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with the embodiments of the present application. They are only examples of devices and methods consistent with some aspects of the embodiments of the present application as detailed in the attached claims.

[0048] It is understood that the terms "first", "second", etc. used in this application can be used to describe various concepts in this article, but unless otherwise specified, these concepts are not limited by these terms. These terms are only used to distinguish one concept from another concept. For example, without departing from the scope of the embodiment of the present application, the first information may also be referred to as the second information, and similarly, the second information may also be referred to as the first information. Depending on the context, the words "if" and "if" as used herein can be interpreted as "at the time of" or "when" or "in response to determination".

[0049] The terms "at least one", "multiple", "each", "any", etc. used in this application, at least one includes one, two or more, multiple includes two or more, each refers to each of the corresponding multiple, and any refers to any one of the multiple.

[0050] Unless otherwise defined, all technical and scientific terms used herein have the same meaning as those commonly understood by those skilled in the art to which this application belongs. The terms used herein are only for the purpose of describing the embodiments of this application and are not intended to limit this application.

[0051] Reference Figure 1 , Figure 1 This is an optional flowchart of a web page debugging method provided in an embodiment of the present application. The method may include but is not limited to steps S101 to S103:

[0052] Step S101, in response to a web page access operation performed in a web browser, receiving a web page code file corresponding to a target web page;

[0053] Step S102, in response to the code update instruction for the webpage code file, generating a corresponding code update file, and dynamically transmitting the code update file to the webpage browser via the browser plug-in;

[0054] Step S103, in response to the code debugging instruction, parsing the code update file through the web browser, and receiving the web debugging result returned by the web browser.

[0055] In some embodiments, the web page debugging method is implemented by a web page debugging architecture, referring to Figure 2 , Figure 2 It is an optional structural diagram of a web page debugging architecture in an embodiment of the present application. The web page debugging architecture includes a debugging system, a web browser, a web server, a browser plug-in, an AI interface and a database. The modules in the web page debugging architecture interact with each other to jointly implement the above-mentioned web page debugging method, and the AI ​​interface is integrated in the debugging system.

[0056] Optionally, the debugging system includes related functions such as a visual debugging code interface, generating debugging history records, real-time code modification, code decompression and compression, and AI analysis of error information; the browser plug-in includes functions such as transmitting data from the web browser to the debugging system, receiving data analyzed by the debugging system and then transmitting it back to the web browser, and transmitting the web browser's web debugging results to the debugging system.

[0057] In some embodiments, the web page debugging method may further include steps S201 to S203:

[0058] Step S201, determining whether the web page debugging result includes debugging error information;

[0059] Step S202, analyzing and processing the debugging error information to generate corresponding code optimization information, and modifying the code update file according to the code optimization information to generate a corresponding code optimization file;

[0060] Step S203: dynamically transmit the code optimization file to the web browser via the browser plug-in, and use the web browser to parse the code optimization file and generate a corresponding preview page.

[0061] In some embodiments, for example, the debugging error information includes error information (error description and the number of lines of code causing the error) and warning information (warning description and the number of lines of code causing the warning) thrown by the web browser when generating a debugging preview page based on the code update file, wherein the error information may include but is not limited to syntax errors, code logic errors, and runtime errors, etc., and the warning information may include but is not limited to code usage warnings, etc.

[0062] In some embodiments, step S101 may include but is not limited to steps S301 to S303:

[0063] Step S301, in response to a web page access operation, obtaining a web page code file through a browser plug-in;

[0064] Step S302, receiving the web page code file transmitted by the browser plug-in;

[0065] Step S303: parse the web page code file to generate corresponding multiple code blocks and multiple event blocks.

[0066] In some embodiments, in response to a web page access operation performed in a web browser, the web browser requests a web server to obtain the above-mentioned web page code file, and then uses a browser plug-in to transfer the web page code file to a debugging system. The debugging system receives the web page code file corresponding to the target web page. A code parsing tool is integrated in the debugging system. The code parsing tool is used to parse the web page code file, analyze specific comments in the web page code, obtain corresponding multiple code blocks and multiple event blocks, mark the code blocks and event blocks with blocks of different colors, and present them in a visual debugging interface.

[0067] In some embodiments, step S102 may include but is not limited to steps S401 to S403:

[0068] Step S401, in response to a code update instruction, determining a number of corresponding code blocks to be updated from a plurality of code blocks;

[0069] Step S402, in response to the code update operation on each code block to be updated, generating an updated code block corresponding to each code block to be updated;

[0070] Step S403: replace the code block to be updated in the web page code file with the corresponding updated code block to generate a code update file.

[0071] In some embodiments, the operator can edit the web page code file online in the debugging system. Optionally, the operator determines a number of corresponding code blocks to be updated from multiple code blocks through a visual debugging interface, edits the code blocks to be updated, generates corresponding updated code blocks, and uses the corresponding updated code blocks to replace the code blocks to be updated in the web page code file, dynamically generates a code update file, and then, a code packaging tool is integrated in the debugging system, and the operator uses the code packaging tool to package and compress the code update file, and transmits the code update file to the web browser through a browser plug-in.

[0072] In some embodiments, step S103 may include but is not limited to steps S501 to S502:

[0073] Step S501, in response to the code debugging instruction, parsing the code update file through the web browser, and receiving the web debugging result returned by the web browser through the browser plug-in;

[0074] Step S502, receiving the web page debugging result returned by the browser plug-in.

[0075] In some embodiments, the web browser receives the code update file transmitted by the debugging system through the browser plug-in, parses the code update file through the web browser, obtains the corresponding code block, executes the relevant debugging instructions, debugs the code block, generates the web page debugging result, and returns the corresponding web page debugging result to the debugging system through the browser plug-in.

[0076] In some embodiments, step S202 may include but is not limited to steps S601 to S602:

[0077] Step S601, calling the code correction interface, locating the corresponding code block to be corrected in the code update file according to the debugging error information, analyzing and optimizing the code block to be corrected, and generating a number of corresponding optimized code blocks;

[0078] Step S602, in response to the code block selection instruction, determining a corresponding target optimized code block from a plurality of optimized code blocks, using the target optimized code block to replace the code block to be corrected in the code update file, and generating a corresponding code optimization file.

[0079] In some embodiments, exemplarily, a code correction interface, such as an AI interface, is integrated into the debugging system, the code correction interface is called, and the corresponding AI big model, such as a GPT model or a pre-trained code optimization big model, is connected. The AI ​​big model finds the code causing the error and the code block to be corrected where the code causing the error is located according to the corresponding line number of the error code in the debugging error information. Then, the AI ​​big model analyzes the debugging error information and automatically generates multiple optimized code blocks for the operator to choose. The operator determines the corresponding target optimized code block from the multiple optimized code blocks. The debugging system obtains the target optimized code block, and uses the target optimized code block to replace the code block to be corrected in the code update file, generates a corresponding code optimization file, and transmits the packaged code optimization file to the web browser through the browser plug-in.

[0080] In some embodiments, the code optimization file or the code update file is parsed through a web browser, and a corresponding preview page is generated and corresponding debugging results are generated.

[0081] In some embodiments, the web page debugging method may further include step S701:

[0082] Step S701, binding the web page debugging result, web page code file, code update file and code optimization file, generating and storing corresponding web page debugging record information.

[0083] In some embodiments, exemplarily, the debugging system requests a database, binds the web page debugging results, web page code files, code update files, and code optimization files, and attaches debugging-related note information (including text, video, or pictures, etc.), generates corresponding web page debugging record information, and then stores the web page debugging record information in the database, wherein the debugging-related note information is uploaded to the debugging system by the operator.

[0084] In some embodiments, the web page debugging method has the following beneficial effects:

[0085] 1) Debugging visual operations to achieve visual display of code blocks and event blocks;

[0086] 2) Web page debugging results can be traced back, and different web page debugging results can be analyzed and compared;

[0087] 3) Web page code can be modified dynamically and instant preview can be achieved;

[0088] 4) Intelligent and convenient, combining AI to quickly and accurately solve errors encountered during page preview and code running;

[0089] 5) Scalability and customizability: By communicating with the web browser through browser plug-ins, the debugging system can be expanded and implement different functions.

[0090] The above web page debugging method is simple and efficient, which can greatly facilitate programmers to complete web page development work, break the temporary nature of traditional web page debugging, record the relevant results of web page debugging for a long time, break through the bottlenecks and limitations of traditional debugging tools, and combine with AI technology to locate error codes more quickly and provide corresponding solutions, greatly improving web page development efficiency.

[0091] Reference Figure 3 , Figure 3 : is an optional structural diagram of a web page debugging device provided in an embodiment of the present application. The device is used to implement the above web page debugging method. The device may include:

[0092] The first module is used to receive a web page code file corresponding to a target web page in response to a web page access operation performed in a web browser;

[0093] The second module is used to generate a corresponding code update file in response to a code update instruction for a webpage code file, and dynamically transmit the code update file to the webpage browser through a browser plug-in;

[0094] The third module is used to respond to the code debugging instruction, parse the code update file through the web browser, and receive the web page debugging result returned by the web browser.

[0095] It can be understood that the contents of the above method embodiments are all applicable to the present device embodiments, the functions specifically implemented by the present device embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0096] The embodiment of the present application also provides an electronic device, the electronic device includes a memory and a processor, the memory stores a computer program, and the processor implements the above web page debugging method when executing the computer program. The electronic device can be any smart terminal including a tablet computer.

[0097] It can be understood that the contents of the above method embodiments are all applicable to the present device embodiments, the functions specifically implemented by the present device embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0098] See also Figure 4 , Figure 4 The hardware structure of an electronic device of another embodiment is illustrated, and the electronic device includes:

[0099] The processor 901 may be implemented by a general-purpose CPU (Central Processing Unit), a microprocessor, an application-specific integrated circuit (Application Specific Integrated Circuit, ASIC), or one or more integrated circuits, and is used to execute relevant programs to implement the technical solutions provided in the embodiments of the present application;

[0100] The memory 902 can be implemented in the form of a read-only memory (ROM), a static storage device, a dynamic storage device, or a random access memory (RAM). The memory 902 can store an operating system and other application programs. When the technical solution provided in the embodiment of this specification is implemented by software or firmware, the relevant program code is stored in the memory 902, and the processor 901 calls and executes the webpage debugging method of the embodiment of this application;

[0101] Input / output interface 903, used to implement information input and output;

[0102] Communication interface 904, used to realize communication interaction between the device and other devices, which can be realized by wired mode (such as USB, network cable, etc.) or wireless mode (such as mobile network, WIFI, Bluetooth, etc.);

[0103] A bus 905 that transmits information between various components of the device (e.g., the processor 901, the memory 902, the input / output interface 903, and the communication interface 904);

[0104] The processor 901 , the memory 902 , the input / output interface 903 and the communication interface 904 are connected to each other in communication within the device via a bus 905 .

[0105] The embodiment of the present application also provides a computer-readable storage medium, which stores a computer program. When the computer program is executed by a processor, the above-mentioned web page debugging method is implemented.

[0106] It can be understood that the contents of the above method embodiments are all applicable to the present storage medium embodiments, the functions specifically implemented by the present storage medium embodiments are the same as those of the above method embodiments, and the beneficial effects achieved are also the same as those achieved by the above method embodiments.

[0107] The memory, as a non-transient computer-readable storage medium, can be used to store non-transient software programs and non-transient computer executable programs. In addition, the memory may include a high-speed random access memory, and may also include a non-transient memory, such as at least one disk storage device, a flash memory device, or other non-transient solid-state storage device. In some embodiments, the memory may optionally include a memory remotely disposed relative to the processor, and these remote memories may be connected to the processor via a network. Examples of the above-mentioned network include, but are not limited to, the Internet, an intranet, a local area network, a mobile communication network, and combinations thereof.

[0108] The embodiments of the present application provide a web page debugging method, device, electronic device, and storage medium, which can dynamically update web page codes and implement dynamic web page debugging, thereby improving the efficiency and flexibility of web page debugging.

[0109] The embodiments described in the embodiments of the present application are intended to more clearly illustrate the technical solutions of the embodiments of the present application and do not constitute a limitation on the technical solutions provided in the embodiments of the present application. Those skilled in the art will appreciate that with the evolution of technology and the emergence of new application scenarios, the technical solutions provided in the embodiments of the present application are also applicable to similar technical problems.

[0110] Those skilled in the art will appreciate that the technical solutions shown in the figures do not constitute a limitation on the embodiments of the present application, and may include more or fewer steps than shown in the figures, or a combination of certain steps, or different steps.

[0111] The device embodiments described above are merely illustrative, and the units described as separate components may or may not be physically separated, that is, they may be located in one place or distributed on multiple network units. Some or all of the modules may be selected according to actual needs to achieve the purpose of the solution of this embodiment.

[0112] Those skilled in the art will appreciate that all or some of the steps in the methods disclosed above, and the functional modules / units in the systems and devices may be implemented as software, firmware, hardware, or a suitable combination thereof.

[0113] The terms "first", "second", "third", "fourth", etc. (if any) in the specification of the present application and the above-mentioned drawings are used to distinguish similar objects, and are not necessarily used to describe a specific order or sequence. It should be understood that the data used in this way can be interchangeable where appropriate, so that the embodiments of the present application described herein can be implemented in an order other than those illustrated or described herein. In addition, the terms "including" and "having" and any of their variations are intended to cover non-exclusive inclusions, for example, a process, method, system, product or device comprising a series of steps or units is not necessarily limited to those steps or units clearly listed, but may include other steps or units that are not clearly listed or inherent to these processes, methods, products or devices.

[0114] It should be understood that in the present application, "at least one (item)" means one or more, and "plurality" means two or more. "And / or" is used to describe the association relationship of associated objects, indicating that three relationships may exist. For example, "A and / or B" can mean: only A exists, only B exists, and A and B exist at the same time, where A and B can be singular or plural. The character " / " generally indicates that the objects associated before and after are in an "or" relationship. "At least one of the following" or similar expressions refers to any combination of these items, including any combination of single or plural items. For example, at least one of a, b or c can mean: a, b, c, "a and b", "a and c", "b and c", or "a and b and c", where a, b, c can be single or multiple.

[0115] In the several embodiments provided in the present application, it should be understood that the disclosed devices and methods can be implemented in other ways. For example, the device embodiments described above are only schematic. For example, the division of the above units is only a logical function division. There may be other division methods in actual implementation, such as multiple units or components can be combined or integrated into another system, or some features can be ignored or not executed. Another point is that the mutual coupling or direct coupling or communication connection shown or discussed can be through some interfaces, indirect coupling or communication connection of devices or units, which can be electrical, mechanical or other forms.

[0116] The preferred embodiments of the present invention are described above with reference to the accompanying drawings, but the scope of the rights of the present invention is not limited thereto. Any modification, equivalent substitution and improvement made by a person skilled in the art without departing from the scope and essence of the present invention should be within the scope of the rights of the present invention.

Claims

1. A web page debugging method, characterized in that: The method comprises the following steps: In response to a web page access operation performed in a web browser, receiving a web page code file corresponding to a target web page; In response to a code update instruction for the webpage code file, generating a corresponding code update file, and dynamically transmitting the code update file to the webpage browser via a browser plug-in; In response to the code debugging instruction, the code update file is parsed by the web browser, and a web page debugging result returned by the web browser is received.

2. The web page debugging method according to claim 1, characterized in that: The method further comprises: Determine whether the webpage debugging result includes debugging error information; Analyze and process the debugging error information to generate corresponding code optimization information, and modify the code update file according to the code optimization information to generate a corresponding code optimization file; The code optimization file is dynamically transmitted to the web browser through the browser plug-in, and the web browser is used to parse the code optimization file and generate a corresponding preview page.

3. The web page debugging method according to claim 1, characterized in that: The step of receiving a webpage code file corresponding to a target webpage in response to a webpage access operation performed in a webpage browser specifically includes: In response to the webpage access operation, obtaining the webpage code file through the browser plug-in; Receiving the web page code file transmitted by the browser plug-in; The webpage code file is parsed to generate corresponding multiple code blocks and multiple event blocks.

4. The web page debugging method according to claim 1, characterized in that: The step of parsing the code update file by the web browser in response to the code debugging instruction and receiving the web debugging result returned by the web browser specifically includes: In response to the code debugging instruction, the code update file is parsed by the web browser, and a web page debugging result returned by the web browser is received by the browser plug-in; Receive the webpage debugging result returned by the browser plug-in.

5. The web page debugging method according to claim 2, characterized in that: The analyzing and processing the debugging error information to generate corresponding code optimization information, and correcting the code update file according to the code optimization information to generate a corresponding code optimization file specifically includes: Calling a code correction interface, locating a corresponding code block to be corrected in the code update file according to the debugging error information, analyzing and optimizing the code block to be corrected, and generating a corresponding plurality of optimized code blocks; In response to a code block selection instruction, the corresponding target optimized code block is determined from the plurality of optimized code blocks, and the code block to be corrected in the code update file is replaced with the target optimized code block to generate the corresponding code optimized file.

6. The web page debugging method according to claim 3, characterized in that: The generating of a corresponding code update file in response to a code update instruction for the webpage code file, and dynamically transmitting the code update file to the webpage browser via a browser plug-in specifically includes: In response to the code update instruction, determining a number of corresponding code blocks to be updated from the plurality of code blocks; In response to a code update operation on each of the to-be-updated code blocks, generating an updated code block corresponding to each of the to-be-updated code blocks; The code block to be updated in the webpage code file is replaced with the corresponding updated code block to generate the code update file.

7. The web page debugging method according to claim 2, characterized in that: The method further comprises: The web page debugging result, the web page code file, the code update file and the code optimization file are bound to generate and store corresponding web page debugging record information.

8. A web page debugging device, characterized in that: The device comprises: The first module is used to receive a web page code file corresponding to a target web page in response to a web page access operation performed in a web browser; A second module is used to generate a corresponding code update file in response to a code update instruction for the webpage code file, and dynamically transmit the code update file to the webpage browser through a browser plug-in; The third module is used to respond to the code debugging instruction, parse the code update file through the web browser, and receive the web debugging result returned by the web browser.

9. An electronic device, characterized in that: The electronic device comprises a memory and a processor, the memory stores a computer program, and the processor implements the webpage debugging method according to any one of claims 1 to 7 when executing the computer program.

10. A computer-readable storage medium storing a computer program, characterized in that: When the computer program is executed by a processor, the web page debugging method according to any one of claims 1 to 7 is implemented.