Intelligent serial port debugging system and method, and computer storage medium

Abstract

The application discloses an intelligent serial port debugging system and method and a computer storage medium, and relates to the field of embedded system development, and aims to provide an intelligent serial port debugging solution which is cross-platform compatible, rich in functions, flexible in configuration, easy to deploy, and has good popularization and application value.

Description

Technical Field

[0001] This invention relates to the field of communication technology, and in particular to an intelligent serial port debugging system, method, and computer storage medium. Background Technology

[0002] Serial communication is a common debugging method in embedded system development and debugging. Developers need to communicate with microcontrollers, sensors, and other devices via serial ports to send commands, receive data, and view status information. However, traditional serial debugging tools suffer from problems such as strong platform dependence, limited functionality, weak data visualization capabilities, and inflexible configuration.

[0003] Desktop-based dedicated debugging software, such as Putty, SecureCRT, and Tera Term, suffers from strong platform dependence, weak data visualization capabilities, and outdated interfaces. These software programs are typically developed for specific operating systems, requiring different versions for Windows, Linux, macOS, etc., and some even support only a single operating system, resulting in poor cross-platform compatibility. They primarily provide basic serial port transmission and reception functions, including serial port parameter configuration, data transmission and reception display, and simple data logging. For complex data frame protocols, users need to manually view HEX data and analyze the meaning of data byte by byte according to the protocol documentation, which is inefficient and prone to errors. Traditional tools can only display raw data in text or HEX format and cannot convert serial port data into visual charts in real time. For applications requiring real-time monitoring of analog quantities such as voltage, current, temperature, and pressure, developers need to manually record data and use third-party tools to draw charts, severely impacting debugging efficiency. Traditional tools lack flexible custom parsing capabilities for different data frame protocols. Supporting new protocols typically requires writing complex scripts or purchasing expensive professional debugging software, resulting in high learning costs and long development cycles. Furthermore, the interface design of many traditional serial port tools remains at the level of more than a decade ago, with complex operations that do not meet the interaction design standards and user experience requirements of modern software. Advanced functions such as firmware upgrades, environment variable management, and rule configuration are rarely seen in traditional tools, or are not implemented well enough, requiring the use of additional tools to complete them.

[0004] Specialized hardware debugging equipment, such as logic analyzers and oscilloscopes, has limited functionality and can only be used for debugging in specific fields. Furthermore, it is expensive, inconvenient to carry, and unsuitable for on-site debugging and mobile work. The learning curve for such equipment is steep, requiring users to possess specialized operating knowledge and skills, thus placing a high level of technical demand on them. Summary of the Invention

[0005] In view of the shortcomings of the prior art, the technical problem to be solved by the present invention is to provide a feature-rich, cross-platform compatible intelligent serial port debugging system, method and computer storage medium based on Web technology.

[0006] To solve the above-mentioned technical problems, one technical solution adopted by the present invention is to provide an intelligent serial port debugging system, comprising: The serial communication management module is used to establish and manage serial communication connections with external target devices. The data frame parsing module is used to parse the received serial port data according to predefined data frame format rules; The data visualization module is used to visually display the parsed and valid data; and The rule configuration module is used to configure and save custom data frame format rules. The rules include at least the frame header sequence, data payload length, and configuration information for one or more data fields.

[0007] Furthermore, the serial communication management module includes: The serial port event listening unit is used to listen for connection and disconnection events of serial port devices and provide visual feedback on the device connection status. A parameter configuration unit is used to configure communication parameters, including baud rate, data bits, stop bits, and parity bits. The data flow management unit is used to asynchronously process serial port events, maintain receive and transmit buffers, and prevent memory overflow. The display switching unit is used to switch the display mode of the data transmission and reception interface according to the user's selection. The display modes include text display, hexadecimal display, and binary display; and / or The statistics unit is used to count the number of bytes sent, bytes received, frames sent, and frames received in real time.

[0008] Furthermore, the data frame parsing module includes: The frame header identification unit is used to search for the user-configured frame header byte sequence in the receive buffer and identify the start position of the data frame; The frame tail identification unit is used to locate the frame tail position according to the data payload length in the data frame format rules, and to verify whether the frame tail bytes match the configured frame tail sequence. The verification unit is used to verify the data frame according to the configured verification algorithm after the frame tail is matched. The data extraction unit is used to extract valid data fields from the data frame after the verification is passed.

[0009] Furthermore, the data visualization module includes: The chart management unit is used to dynamically create and destroy chart instances based on the enabling status of data fields. Each enabled data field corresponds to an independent visualization component. Numerical panel cells are used to display the latest value, historical maximum value, historical minimum value, historical average value and / or unit for each field; Multi-axis display unit is used to create independent numerical axes for multiple data fields in the same chart, with the color of each numerical axis associated with the color of the corresponding data field. Chart theme adaptive unit, used to automatically adjust chart colors and styles according to the system theme; and / or The data update unit is used to update chart data in real time and retain a preset number of historical data points.

[0010] Furthermore, the rule configuration module includes: The frame structure configuration unit is used to configure the frame parameters of the data frame, including the frame header sequence, frame tail sequence, data payload length, and verification algorithm type. The field management unit is used to manage the fields in the data frame, and supports dynamically adding, deleting, and editing fields; A rule validation unit is used to validate the completeness and legality of rules; and / or The rule template unit provides rule templates for commonly used protocols, allowing users to quickly create rule configurations based on these templates.

[0011] Furthermore, it also includes: Firmware upgrade module, used to perform online firmware upgrades on target devices via serial port; The firmware upgrade module includes: The file upload unit is used to support users in selecting firmware files; The block transmission unit is used to calculate the block size and the number of blocks according to the size of the firmware file and the size of the receive buffer of the target device, and to divide the firmware file into multiple data blocks according to the block size and send them to the target device block by block; A progress display unit is used to display the firmware upgrade progress in real time; and / or The upgrade verification unit is used to verify the integrity of the firmware transmission and the upgrade result.

[0012] Furthermore, it also includes: The environment variable management module is used to read environment variable configurations from the target device, display them on the web interface, edit the environment variables, and save the modified environment variables back to the target device. The theme management module is used to dynamically switch between dark and light themes; and / or The log management module is used to record and export logs, including data logs, event logs, parsing logs, and operation logs.

[0013] Furthermore, it also includes: The responsive layout module is used to automatically adapt to different screen sizes and device types using responsive design. A professional color scheme module is used to provide color schemes for the system interface, including status indicator color schemes and theme color schemes; and / or The data export module is used to export the raw serial port data, parsed valid data, and / or log data.

[0014] To solve the above-mentioned technical problems, another technical solution adopted by the present invention is: to provide an intelligent serial port debugging method, implemented based on the aforementioned intelligent serial port debugging system, comprising the following steps: Establish a serial communication connection with an external target device through a web-based serial communication interface; Load user-defined data frame format rules; Receive raw serial data from the target device and store it in the receive buffer; Frame identification is performed on the data in the receive buffer according to the data frame format rules; Extract valid data fields from the identified data frames and convert them into corresponding physical quantity values; The physical quantity values ​​of each data field are displayed in real time in the chart, and each data field has an independent visualization graphic component.

[0015] To solve the above-mentioned technical problems, another technical solution adopted by the present invention is to provide a computer storage medium on which a computer program is stored, wherein the computer program is executed by a processor to implement the intelligent serial port debugging method.

[0016] The intelligent serial port debugging system, method, and computer storage medium of the present invention have at least the following beneficial effects: (i) This invention is based on Web technology and can run as long as the browser supports the Web Serial API. It is compatible with mainstream operating systems such as Windows, Linux, and macOS, and there is no need to develop different versions for different platforms. It is a pure front-end implementation. You only need to copy the file to the Web server or open the HTML file locally to use it. No software or driver needs to be installed. It is simple to deploy and has low maintenance costs. All dependent files and project files are very small. After copying them to the local machine, they can be used without a network connection, which is suitable for on-site debugging and environments without network.

[0017] (ii) Supports custom data frame formats, allowing flexible configuration of the meaning of each byte in the data frame according to the actual project. Parameters such as frame header, data length, frame tail, verification method, and data fields can be flexibly configured, adapting to different communication protocols without writing code. Each field can be independently configured with attributes such as name, start position, data type, byte order, unit conversion factor, unit name, and display color, offering flexible configuration and strong adaptability. It supports saving configured rules as JSON format files to the local machine or loading saved rules from local files, facilitating the sharing and synchronization of rule configurations among team members and improving collaboration efficiency.

[0018] (III) Real-time data visualization is achieved by converting serial port data into intuitive line charts, making it easy for users to observe data trends. A numerical panel is provided to display real-time data, including statistical information such as current value, maximum value, minimum value, and average value. Dark and light themes can be switched, allowing users to choose a suitable theme based on their environment and personal preferences. The system features visualized, modern, and interactive firmware upgrade, environment variable configuration, and log management functions to meet common serial port function requirements. A responsive page design is implemented, automatically supporting screens of various sizes. Attached Figure Description

[0019] The accompanying drawings, which are included to provide a further understanding of this application and form part of this application, illustrate exemplary embodiments and are used to explain this application, but do not constitute an undue limitation of this application. In the drawings: Figure 1 This is a system block diagram of one embodiment of the intelligent serial port debugging system of the present invention.

[0020] Figure 2 This is a schematic diagram illustrating the workflow of one implementation of the serial communication management module.

[0021] Figure 3 This is a schematic diagram illustrating the workflow of one implementation of the data frame parsing module.

[0022] Figure 4 This is a schematic diagram of the online firmware upgrade process.

[0023] Figure 5 This is a schematic diagram of the overall architecture of one embodiment of the intelligent serial port debugging system of the present invention.

[0024] Figure 6 This is a flowchart of one embodiment of the intelligent serial port debugging method of the present invention. Detailed Implementation This solution adopts a modular architecture design and runs in a browser environment. It realizes serial communication with external target devices through a web-based serial communication interface, which is the Web Serial API. Users only need to open the page in a browser that supports the Web Serial API to use it.

[0025] Please see Figure 1 The intelligent serial port debugging system of the present invention includes a serial port communication management module 000, a data frame parsing module 100, a data visualization module 200, and a rule configuration module 300. The serial port communication management module 000 is used to establish and manage serial port communication connections with external target devices. The data frame parsing module 100 is used to parse received serial port data according to predefined data frame format rules. The data visualization module 200 is used to visualize the parsed valid data. The rule configuration module 300 is used to configure and save custom data frame format rules, wherein the rules include at least a frame header sequence, data payload length, and configuration information for one or more data fields.

[0026] The serial communication management module 000 establishes a serial communication connection with an external target device through a web-based serial communication interface. In this embodiment, the web-based serial communication interface is the Web Serial API. The serial connection management module uses async / await to handle asynchronous operations, avoiding blocking the main thread and providing visual feedback on the connection status, thus improving the user experience. Furthermore, it handles various error conditions, such as unauthorized serial port, connection failure, read errors, and write errors, providing detailed error logs and error messages. Specifically, the serial communication management module 000 includes a serial event listening unit, a parameter configuration unit, a data stream management unit, a display switching unit, and / or a statistics unit. The serial event listening unit is used to listen for connection and disconnection events of the serial port device, providing visual feedback on the device connection status. When a user inserts or removes a serial port device, the browser triggers the corresponding connection or disconnection event. The serial event listening unit captures these events and automatically updates the connection status indicator in the interface, eliminating the need for the user to manually refresh the device list.

[0027] The parameter configuration unit is used to configure communication parameters, including baud rate, data bits, stop bits, and parity bits. For example, the system defaults to a baud rate of 115200, 8 data bits, 1 stop bit, and no parity. When establishing a serial port connection, the system uses these parameters to call the serial communication interface opening method provided by the browser to complete the establishment of the communication link.

[0028] The data stream management unit is used to asynchronously process serial port events, maintain receive and send buffers, and prevent memory overflow. The data stream management unit uses ReadableStream and WritableStream for asynchronous read and write operations on streaming data. Data reception employs a loop-based reading method; whenever data arrives, the system appends the received byte stream to the receive buffer. Data transmission uses a Writer object to write data to the serial port. To prevent the buffers from growing indefinitely and causing memory overflow, the data stream management unit sets a maximum buffer size limit, such as 64KB. When the data volume exceeds the threshold, overflow detection is automatically triggered, and the oldest data is cleaned up, ensuring the stability of the system during long-term operation.

[0029] The display switching unit is used to switch the display mode of the data transmission and reception interface according to the user's selection. The display modes include text display, hexadecimal display, and binary display. In text mode, each byte is parsed into its corresponding character according to ASCII code and displayed; in hexadecimal mode, each byte is converted into two hexadecimal digits and displayed; in binary mode, each byte is converted into an 8-bit binary digit and displayed. Mode switching only affects the presentation of the data transmission and reception interface and does not affect the original data content stored in the receive buffer.

[0030] The statistics unit is used to count the number of bytes sent, bytes received, frames sent, and frames received in real time. Each time the serial communication management module 000 completes a data reception or transmission operation, the statistics unit updates the corresponding count. Users can view the communication data volume at any time and assess the data flow during the debugging process.

[0031] In a preferred embodiment, the serial port connection management module also includes a shortcut command management unit, which provides a predefined list of shortcut commands. Users can select frequently used commands from the list to send quickly. Specifically, the shortcut command management unit provides a command list area in the interface, where users can pre-add frequently used commands during debugging to the shortcut command list and set a custom name for each command for easy identification. When the command needs to be sent, the user only needs to double-click the command in the list or click the corresponding send button, and the system will automatically send the command content to the target device via the serial port, without requiring the user to re-enter it.

[0032] Please see Figure 2 The serial communication management module 000 (i.e. Figure 2The workflow of the serial port management module in the browser is as follows: (I) During the initialization phase, the default baud rate is set to 115200, the data bits are 8, the stop bits are 1, and there is no parity. (II) Establish a serial port connection. The user selects the connection device information from the pop-up window of the browser and clicks the "Connect" button. Then, the serial port connection is opened by calling port.open() with the parameters selected by the user. A ReadableStream and Reader object is created to receive data, and a WritableStream and Writer object is created to send data. The interface status is updated, and the "Connected" indicator is displayed. The "Connect" button becomes grayed out and cannot be clicked or triggered. The "Disconnect" button becomes active. (III) Asynchronous data reception processing method. The serial port data is continuously read in a loop, and the received byte stream data is appended to the receive buffer. If a parsing rule is set, the data parsing method is triggered after each read to process the receive buffer, or the data receiving and sending interface is updated according to the data display mode (HEX / ASCII / TEXT) selected by the user. Update the reception statistics information. (iv) Data transmission: The user enters data in the transmission input box, and can choose hexadecimal, binary, or text format. If hexadecimal or binary format is selected, the system converts the hexadecimal string into a Uint8Array byte stream, removes spaces, delimiters, and identifiers, calls the write end object of the buffer to write the data to the transmission buffer, and sends it to the serial port, updating the data transmission interface display and transmission statistics. (v) Disconnection function: When the user clicks the "Disconnect" button or the device is physically disconnected, the serial port connection is closed, the interface status is updated, the "Not Connected" indicator is displayed, and the buffer is cleared.

[0033] The rule configuration module 300 provides an interactive configuration interface to guide users in configuring data frame format rules, including frame structure configuration unit, field management unit, rule verification unit and / or rule template unit.

[0034] The frame structure configuration unit is used to configure the frame parameters of the data frame, including the frame header sequence, frame trailer sequence, data payload length, and verification algorithm type. First, the data payload length is entered in bytes via a text box, followed by the configuration of the frame header and frame trailer sequences. When a frame header or frame trailer configuration item is selected, the system displays the corresponding HEX input box. For example, you can directly enter "AABB", or "AA BB" or "0xAA 0xBB". The system will automatically remove spaces, the "0x" prefix, or other separators, normalizing the input content into a standard HEX byte sequence. The verification algorithm is configured via a drop-down list, supporting multiple options such as XOR, SUM, CRC8, CRC16, and CRC32. When XOR or SUM is selected, the data type can be further specified as uint8, uint16, or uint32; when CRC8, CRC16, or CRC32 is selected, the system automatically uses the corresponding default data type: CRC8 uses uint8, CRC16 uses uint16, and CRC32 uses uint32.

[0035] The field management unit is used to manage the fields in the data frame, supporting dynamic addition, deletion, and editing of fields. Clicking the "Add Field" button adds a new field configuration card to the configuration panel. The field type dropdown menu in the card includes options such as "Frame Header," "Frame Tail," "Check Digit," "Frame Sequence Number," and "Data Field," which can be selected according to the field's actual role in the data frame. Each field needs to be configured with a starting position, representing its byte offset in the data frame, entered in a numeric input box. The data type dropdown menu supports int8, uint8, int16, uint16, int32, uint32, float32, and float64. The byte order dropdown menu supports both "big-endian" and "little-endian" modes; this implementation defaults to big-endian. When the field type is selected as "Data Field," an additional set of configuration controls is displayed in the card, including a name text box, a conversion coefficient input box, a unit name text input box, and a color picker. The name text box describes the physical meaning of the field, such as "220V input voltage," "220V input current," or "battery surface temperature." The default value is (field_1, field_2, field_3,...) to prevent user omissions. The conversion factor input box defaults to 1; 0.01 means dividing the original value by 100. For example, if the data field uses 35B6A to represent 220010mV, entering 0.001 will convert the data to 220.010. The unit name text box is used to enter "V," "A," "℃," etc., and the color picker is used to specify the chart display color for this field. When the user selects "Frame Header," "Frame Trailer," "Check Digit," or "Frame Sequence Number" as the field type, the system automatically hides controls unrelated to that type.

[0036] The rule verification unit is used to verify the completeness and legality of the rules. The rule verification unit checks the following: whether field names are empty, contain illegal characters, or are duplicates; whether the starting position is within a valid range; whether the data type is compatible with the starting position; whether the conversion coefficient is a valid value and not zero; whether there is positional overlap between fields; and whether the total length of all fields exceeds the data payload length. When verification fails, the system provides a clear error message, such as "Error: The starting positions of the voltage field and the current field overlap," to guide the user in correction. After successful verification, the applied rules are saved, and charts are added or destroyed according to the rules. By default, one chart is created per field. After applying and parsing the rules, the verified rules can be saved locally in JSON format. When the rule needs to be used again, simply load the JSON file locally to restore the entire configuration.

[0037] The rule template unit provides rule templates for commonly used protocols, allowing users to quickly create rule configurations based on these templates. The rule template unit includes built-in data frame format templates for common communication protocols (such as Modbus RTU and Ymodem). After the user selects a template, the system automatically fills in the corresponding frame header, frame trailer, data length, and field configurations. Users only need to make minor adjustments based on the actual device to complete the configuration.

[0038] The workflow of the rule configuration module 300 is as follows: (I) Configure the data frame length. Input the data frame length through the text box. (II) Configure the data frame format. After the user clicks the "Add Field" button, a new field card will be added to the configuration interface. The field type drop-down list in the card includes "Frame Header", "Frame Tail", "Check Digit", "Frame Sequence Number" and "Data Field". Each field has a numeric input box for inputting the starting position of the field, representing the byte offset in the data frame. It has a drop-down list to select the data type, supporting int8 / uint8 / int16 / uint16 / int32 / uint32 / float32 / float64. It has a byte order drop-down list, and each field supports selecting "big-endian" and "little-endian" byte order separately, with big-endian being the default. Clicking the delete button in the upper right corner of the field card will prompt the user to confirm the deletion in a pop-up window. After confirming the deletion, the field will be removed from the configuration. (III) Configure the frame header and frame tail. When the field type is selected as "Frame Header" or "Frame Tail", a frame header input box will be displayed for entering the frame header. HEX format input is supported, and spaces and prefixes are automatically handled, such as "AA BB", "AABB", or "0xAA 0xBB". (IV) Frame Sequence Number Configuration. The user is prompted to set the data type (i.e., the byte length occupied by the frame sequence number) and field offset. (V) Verification Algorithm Configuration. The verification algorithm can be selected from the drop-down list, such as XOR / SUM / CRC8 / CRC16 / CRC32. If XOR and SUM are selected, uint8, uint16, or uint32 can be selected. If CRC8, CRC16, or CRC32 are selected, the default data type is used. CRC8 uses uint8, CRC16 uses uint16, and CRC32 uses uint32. (VI) Data Field Configuration. When the field type is selected as "Data Field", a new text box and drop-down list are added for entering data field information. The name text input box is used to clearly define the meaning of the field, such as "220V input voltage", "220V input current", "battery surface temperature", etc. The default value is (field_1, field_2, field_3,...) to prevent users from not entering any information. A new conversion factor numeric input box is added, with a default value of 1. For example, if the data field is represented by 35B6A as 220010mV, entering 0.001 will convert the data to 220.010. A new unit name text input box is added, which can be used to enter units such as "V", "A", "℃", etc. A new color picker is added to select the display color of the chart for this field and provides a default color combination. (VII) Validation and application parsing rules. When the user clicks the "Apply Parsing" button, field validation is performed to check whether the field name is duplicated, whether the chart color is duplicated, whether the starting position is within the valid range, whether the data type is compatible with the starting position, and to display error messages to guide the user to correct the error.Finally, save the application rules and add or destroy charts according to the rules. By default, one chart is created for each field. After applying the parsing rules, the validated rules can be saved locally in JSON format. (VIII) Loading Local Parsing Rules. When the user selects a local parsing file, the parsing rules are analyzed and displayed on the rule configuration interface for easy checking and verification. At this time, the local parsing rules are not applied. You need to click "Apply Parsing" and then perform the steps of verifying and applying the parsing rules.

[0039] The data frame parsing module 100 is used to parse the received serial port data according to the data frame format rules configured by the rule configuration module 300. The data frame parsing module 100 includes a frame header identification unit, a frame tail identification unit, a verification unit, and a data extraction unit. The following detailed explanation of the parsing process of the data frame parsing module 100 is provided through a complete example. Assume a user is debugging a power monitoring device that periodically reports voltage, current, and temperature data to a host computer via a serial port. Based on the protocol document provided by the device manufacturer, the user completes the following configuration in the rule configuration interface: the frame header is two bytes (AA BB), the data payload length is 6 bytes, the frame tail is a single byte (55), the verification algorithm is XOR, and the check bit is located after the frame tail. Three data fields are configured: the voltage field, starting from byte 0 of the data payload, occupies 2 bytes, uses big-endian uint16 format, has a conversion factor of 0.01, and is in V; the current field, starting from byte 2, is also 2 bytes of big-endian uint16, with a conversion factor of 0.01, and is in A; the temperature field, starting from byte 4, is 2 bytes of big-endian int16, with a conversion factor of 0.1, and is in °C. When the target device sends a frame of raw data AA BB00 64 00 32 01 2C 55 0B, the system initiates the following parsing process.

[0040] The frame header identification unit is used to search the receive buffer for a user-configured frame header byte sequence to identify the start position of the data frame. The frame header identification unit uses a sliding window algorithm to search the frame header sequence byte by byte. The size of the sliding window is equal to the frame header length, i.e., 2 bytes. Starting from the beginning of the buffer, the window slides forward 1 byte in each round until a completely matching frame header is found or the entire buffer is searched. If the amount of data in the buffer is insufficient to form a complete frame, the frame header identification unit will wait for more data to arrive before continuing the search. In this example, the window successfully matches at position 0 in the buffer, and the system records the frame header start position as 0.

[0041] The frame tail identification unit is used to locate the frame tail position according to the data payload length in the data frame format rules, and to verify whether the frame tail bytes match the configured frame tail sequence. Starting from frame header start position 0, the frame tail identification unit skips 2 bytes of frame header and 6 bytes of data payload, reaches position 8, reads the byte value of 55 at this position, and compares it with the user-configured frame tail sequence 55. If a match is found, it indicates that a complete frame has been found. If there is no match, it means that the current frame header may be a false detection caused by an accidental occurrence of the same byte sequence in the data payload. The module abandons the current frame header position and starts the search again from the next position.

[0042] The verification unit is used to verify the data frame according to the configured verification algorithm after the frame tail is matched. The verification unit performs an XOR operation on the frame header (AA BB), data payload (00 64 00 32 01 2C), and frame tail (55) for a total of 9 bytes to obtain the check value 0B. If the check value is consistent with the check bit 0B after the frame tail (position 9), the verification passes. If the verification fails, the verification unit marks the frame as an erroneous frame and records the error reason in the log (such as "XOR verification failed: expected 0B, actual 0C"), discards the frame data, and continues to process subsequent data. The verification algorithms supported by this system include XOR check, SUM check, CRC8 check, CRC16 check, etc. The verification position supports two modes: before the frame tail and after the frame tail, which can flexibly adapt to different protocol designs.

[0043] The data extraction unit is used to extract valid data fields from the data frame after verification. The number and position of bytes to be extracted are determined based on the starting position and data type of the field. The original value of the corresponding byte is read from the data frame, and data type and byte order conversions are performed. Unit conversion is then performed according to the conversion coefficient, retaining two decimal places. The final value is used for chart display and numerical panel updates. In this example, the voltage field starts at position 0, reads two bytes 00 64, combines them in big-endian order to get 0x0064 (decimal 100), and multiplies by the conversion coefficient 0.01 to get 1.00V. The current field starts at position 2, reads 00 32, converts it to 50, and multiplies by 0.01 to get 0.50A. The temperature field starts at position 4, reads 01 2C, parses it in big-endian int16 to get 300, and multiplies by 0.1 to get 30.0℃. The system supports data types including int8, uint8, int16, uint16, int32, uint32, float32, and float64, and supports both big-endian and little-endian byte orders, which users can flexibly configure according to the protocol documentation. After parsing, the system removes the frame data from the receive buffer, freeing up memory space. If there is still data remaining in the receive buffer, the module continues to search for the next frame, forming a continuous parsing loop.

[0044] Regardless of whether data frame format rules are configured, the system will display the raw data sent and received in real time in the data sending and receiving interface. Users can select text, hexadecimal or binary mode to view the raw data through the display switching unit for manual verification and anomaly troubleshooting.

[0045] Please see Figure 3 When data frame format rules are configured, the working principle of the data frame parsing module 100 is as follows: (I) Frame header search. Check if there are enough bytes in the receiving buffer. If there is insufficient data, wait for more data to arrive until there are enough bytes in the buffer. Use a sliding window to search for the first occurrence position of the frame header byte. If the frame header is found, record the starting position; otherwise, wait for more data to arrive. If the frame header is found, calculate the total length of the complete frame starting from the frame header position. If there is insufficient data, wait for more data to arrive. (II) Frame tail matching. If the length of the data received in the buffer is greater than or equal to the frame length after the frame header is found, read the expected frame tail byte at the expected end position of the frame. Compare the read frame tail with the frame tail configured by the user. If they do not match, it means that the frame header has been searched at an incorrect position and needs to be skipped to continue searching. (III) Verification. After the frame header and frame tail are matched, read the verification data at the expected verification position of the frame. Verify the data frame according to the configured verification algorithm. If they match, the verification passes. If they do not match, the system marks the frame as an error frame and records the error information in the log. (iv) Data Extraction. The number and location of bytes to be extracted are determined based on the starting position and data type of the field. The raw value of the corresponding byte is read from the data frame, and data type and byte order conversions are performed. Unit conversions are then performed based on the conversion coefficients, retaining two decimal places. The final value is used for chart display and numerical panel updates. (v) Buffer Management. A buffer size limit is set to prevent the buffer from growing indefinitely. After successfully parsing a frame, the frame is copied to a temporary variable for processing, and all bytes of that frame are removed from the receive buffer. If a data frame match fails, the corresponding data is removed.

[0046] The data visualization module 200 is responsible for presenting the parsed physical quantity values ​​in chart form in real time, including a chart management unit, a value panel unit, a multi-axis display unit, a chart theme adaptive unit, and / or a data update unit. In this embodiment, the data visualization module 200 uses the Chart.js chart library to implement real-time data display.

[0047] The chart management unit dynamically creates and destroys chart instances based on the enabling status of data fields. Each enabled data field corresponds to an independent visualization component. In this embodiment, the visualization component is a line chart. The chart management unit dynamically creates a corresponding number of Chart.js chart instances based on the number of currently enabled data fields, with each data field corresponding to an independent line chart. If a field is disabled or deleted, the chart management unit automatically destroys the corresponding chart instance, releasing system resources. Each chart has independent data storage, color configuration, and update logic, without interference. The chart layout adopts a responsive grid design, automatically adjusting the number of columns according to screen size to display multi-column charts. Two-column charts are displayed on medium-sized screens (such as tablets), and single-column charts are displayed on small screens (such as mobile phones). Each chart card displays information such as the field name, current value, and unit. Chart data can be exported as CSV or image formats for subsequent analysis.

[0048] The numerical panel unit is used to display the latest value, historical maximum value, historical minimum value, historical average value, and / or unit of each field. In this embodiment, for each data field, the numerical panel unit is configured as a numerical panel, displaying the current value, historical maximum value, historical minimum value, historical average value, and unit of that field in real time. Users can quickly grasp the overall trend and fluctuation range of the data through this statistical information without having to view every data point on the chart individually.

[0049] The multi-axis display unit is used to create independent numerical axes for multiple data fields within the same chart, with the color of each axis associated with the color of the corresponding data field. For multiple data fields with significantly different numerical magnitudes (such as voltage in the 220V range and current in the mA range), the multi-axis display unit supports assigning independent Y-axis to different fields within the same chart. Each Y-axis automatically adjusts its scale according to the numerical range of the corresponding field, and the color of the Y-axis remains consistent with the line color of that field in the chart, making it easy for users to distinguish between them.

[0050] The chart theme adaptive unit is used to automatically adjust the chart colors and styles according to the system theme. In this embodiment, the chart theme adaptive unit uses the CSS transition property to achieve a smooth transition effect when switching colors. When the theme changes, it iterates through all chart instances and dynamically updates the chart's color configuration to ensure that the chart colors are consistent with the interface theme, providing a good visual experience. Specifically, it dynamically updates the chart's color configuration, updating the gridline colors of the X and Y axes, the tick colors, the title color, the data point and line colors, the border color, and the chart's fill color.

[0051] The data update unit is used to update chart data in real time and retain a preset number of historical data points. Whenever the data frame parsing module 100 successfully parses a frame of data and completes the numerical conversion, the data update unit immediately appends the new data point to the historical dataset of the corresponding field. The X-axis label of the new data point is the current timestamp, and the Y-axis value is the converted physical quantity value. As a preferred implementation, a maximum number of data points is preset, such as 200. When the dataset exceeds this limit, the data update unit automatically removes the oldest data point, maintaining chart clarity while avoiding unlimited memory growth. Regarding the timeline, the data update unit dynamically adjusts the scale interval according to the data update frequency, with denser intervals for frequent updates and looser intervals for sparse updates. Simultaneously, it automatically selects an appropriate time format based on the total time span of the historical data; for example, it displays HH:mm:ss for smaller spans and switches to MM-DD HH:mm for larger spans. Users can also zoom the timeline using the mouse wheel or drag and pan the timeline to view historical data for any time period.

[0052] The workflow of the data visualization module 200 is as follows: (I) Chart Initialization. After configuring the parsing protocol, chart initialization is performed, creating an independent chart for each data field. During this stage, each chart is bound, and the chart's color, title, and X-axis and Y-axis attributes are set. In addition, a responsive grid layout is adopted to automatically adapt to the screen width. Multi-column charts are displayed on large screens, two-column charts on medium screens, and single-column charts on small screens. Each chart card displays information such as field name, current value, and unit. (II) Real-time Data Update. After each successful parsing of a data frame, the corresponding chart is updated. Data is added to the data storage of the field, and it is determined whether there is too much historical data (more than 200). If there is too much historical data, the oldest historical data will be removed. The chart is updated, and new data points are automatically added and overflowing data points are removed. The current timestamp is obtained as the X-axis label. The Y-axis is automatically updated according to the data range. Statistical values ​​(maximum, minimum, and average) are updated, and the data panel is updated. The numerical information of the data points on the chart (X and Y coordinate values) is hidden. When the user clicks on a data point, the numerical information of that data point will be displayed. (iii) Chart Export. When a user clicks the export button on the panel, a download link will be created, and a PNG image will be automatically downloaded, named in the format "field name-download time".

[0053] In a preferred embodiment, the intelligent serial port debugging system also includes a firmware upgrade module 400, used for online firmware upgrades of the target device via the serial port, allowing users to complete firmware flashing without the need for a dedicated programmer. The firmware upgrade module 400 includes a file upload unit, a chunked transmission unit, a progress display unit, and / or an upgrade verification unit.

[0054] The file upload unit supports user selection of firmware files. After a user selects a firmware file, the file upload unit automatically checks the file format, supporting both .bin and .hex formats. It verifies parameters such as file type, size, and format, and provides a file information preview function, displaying detailed information including file name, file size, modification time, and file type. For example, after selecting an upgrade file, the unit checks whether the file type is ".bin" or ".hex". If the file type is not one of these formats, the user is prompted that the file format is incorrect and they need to select a new file.

[0055] The chunked transmission unit calculates the chunk size and number of chunks based on the size of the firmware file and the buffer size of the target device. It then divides the firmware file into multiple data chunks according to the chunk size and sends them to the target device chunk by chunk. Specifically, after the upgrade begins, the chunked transmission unit sends an upgrade preparation data frame to the target device. Upon receiving this frame, the target device replies with the writable file size and the maximum number of bytes that can be processed at one time. Upon receiving this information, the chunked transmission unit verifies whether the file to be written is too large. If it is, it prompts the user and terminates the process. Otherwise, based on the maximum number of bytes that the target device can process at one time and the selected protocol, it calculates the optimal chunk size and total number of packets, sends the chunk information to the target device, and waits for confirmation. After the target device confirms, the data transmission phase begins, sending the firmware file chunk by chunk according to the calculated chunk size. After each chunk is sent, the unit waits for a block confirmation reply from the target device. Only after verification is the next chunk sent. If no confirmation is received after a chunk is sent or an error reply is received, the chunked transmission unit automatically retransmits that chunk. If the upgrade still fails at this point after reaching the preset transmission threshold, the upgrade is terminated and an error log is recorded.

[0056] The progress display unit is used to display the firmware upgrade progress in real time. The progress display unit updates the progress bar percentage in real time based on the number of blocks sent, allowing the user to clearly understand the upgrade progress. The upgrade verification unit is used to verify the integrity of the firmware transmission and the upgrade result, ensuring the integrity of the upgrade and avoiding device malfunctions caused by incomplete upgrades.

[0057] In a preferred embodiment, the firmware upgrade module 400 supports error recovery and resume transmission from interruption. During the upgrade process, it detects and handles various error situations, performs flow control to avoid data loss, and resumes the upgrade from the interruption point in the event of transmission interruption, avoiding starting from scratch.

[0058] Please see Figure 4The interaction process between the target device and the host computer is demonstrated. The workflow of the firmware upgrade module 400 is as follows: (I) Displaying a dedicated upgrade interface. First, check if the serial port is connected. If not, the upgrade interface cannot be accessed, and the user is prompted to connect the serial port. Use a global gray semi-transparent screen to cover the original interface, making the original interface functions unusable, preventing the user from clicking other functions, which would interfere with the upgrade process and cause the target device to fail to upgrade. Display the upgrade interface, which is divided into a file selection area, a file information display area, a protocol selection area, an upgrade progress bar, and an upgrade log area. Click the cross button in the upper right corner to exit the interface. Exiting is not allowed during the upgrade process. The file selection area is used to click to select firmware files, the file information display area is used to display the file name and file size, the protocol selection area provides common protocol selection (Ymodem, Modbus RTU / ASCII), the upgrade progress bar updates in real time to display the upgrade progress percentage, and the upgrade log is used to display detailed information during the upgrade process. (II) Uploading upgrade files. After the user selects the upgrade file, check if the file type is ".bin" or ".hex". If the type is not one of these formats, prompt the user that the file format is incorrect and the user needs to select a new file. Obtain the file name and size of the upgrade file and display the file information. (III) Upgrade Environment Preparation. Send an upgrade preparation data frame to the target device. After receiving the data, the target device replies with the file size that can be burned and the maximum number of bytes that can be processed at one time. After receiving the above information, verify whether the file to be burned is too large. If it is too large, prompt the user. And end the burning process. Calculate the total number of packets according to the maximum number of bytes that the target device can process at one time and the selected protocol, and transmit this information to the target device. After the target device confirms, send a start confirmation data frame to start transmitting data. (IV) Transmit the Upgrade Burning File. According to the protocol selected by the user and the maximum number of bytes that the target device can process at one time, divide the upgrade file into packets, calculate the checksum and transmit the data, and update the progress in real time. During the transmission process, retransmit the data packets that fail to be transmitted. If the device disconnects during the transmission process, prompt the user and record the error log. (V) Target Device Restart. Once the file transfer is complete, the target device processes and saves the file data, then replies with a transfer completion frame. Upon receiving the transfer completion frame, a device restart command is sent. The target device receives the command, replies, and then restarts. A pop-up window prompts the target device to restart.

[0059] In a preferred embodiment, the intelligent serial port debugging system also includes an environment variable management module 500. The environment variable management module 500 is used to read environment variable configurations from the target device, display them on a web interface, edit the environment variables, and save the modified environment variables back to the target device. Specifically, it sends a read command to the target device via serial port and parses the environment variable data (key-value pair format) returned by the target device. During the read process, it displays the read progress, provides loading animations and status prompts, and handles errors during the read process, such as timeouts and format errors. Environment variables are displayed in a list format, including: the name of the environment variable, the current value of the environment variable, the data type of the displayed variable (string, integer, floating-point number, etc.), and whether the variable is editable. It supports sorting by variable name and type, and supports keyword searching for environment variables. Furthermore, it supports batch saving of all modified environment variables, sending modification commands to the target device via serial port, prompting the user for confirmation before saving to avoid accidental operations, displaying the save progress, and providing loading animations and status prompts. It records environment variable logs before and after modification for easy problem tracking.

[0060] The workflow of the environment variable management module 500 is as follows: (I) The environment variable management module 500 is used to read and set the environment variables of the target device. The environment variables are displayed in key-value pair form. Its main functions and technical implementation are as follows. (II) Reading environment variables. First, check whether the serial port is connected. If not connected, the environment variable interface cannot be accessed, and the user is prompted to connect the serial port. After the serial port of the target device is available, the environment variable interface is displayed. Send an environment variable read command. After receiving the environment variable information sent by the target device, parse the environment variable information and display the key-value pair data and the data type of the value of the environment variable. The key data text box cannot be modified, while the value data text box can be modified. (III) Saving environment variables. Compare the environment variable data before and after modification to verify the rationality of the data and save the changed environment variables. Send a save command to the target device, and verify whether the environment variable has been successfully modified according to the feedback of the target device, prompt the user, and record the log.

[0061] In a preferred embodiment, the intelligent serial port debugging system further includes a theme management module 600, which is used to dynamically switch between dark and light themes. Specifically, the theme management module defines theme-related style variables such as colors, fonts, and spacing using custom CSS properties, and dynamically modifies the variable values ​​using JavaScript to achieve a seamless dynamic switch between dark and light themes. The CSS transition property is used to achieve a smooth transition effect during theme switching, avoiding visual discomfort caused by abrupt color changes. The browser's localStorage API is used to store the user's selected theme preferences; the theme settings are saved even after the browser is closed and automatically loaded the next time it is opened.

[0062] In a preferred embodiment, the intelligent serial port debugging system further includes a log management module 700. This module records and exports logs, including data logs, event logs, parsing logs, and operation logs. Specifically, log data is stored in JSON format. Each log entry contains multiple structured fields, and logs are categorized for easy management and querying. Logs are updated in real-time as a scrolling list. The logs are divided into data logs, event logs, parsing logs, and operation logs, and the system has the function of counting the total number of each type of log. Data logs record all raw data transmitted and received via the serial port, including timestamps, direction, and data content. Event logs record system events, including connection, disconnection, errors, and warnings. Parsing logs record data frame parsing results and error information, including frame sequence number, parsing result, and error cause. Operation logs record user actions, including button clicks, configuration modifications, and file operations. Different levels of logs are identified by different colors: blue for notification, yellow for warning, and red for error. The log list automatically scrolls to the latest log, keeping the most recent log visible. Users can manually scroll through historical logs, with each entry displaying a timestamp for easy reference. Logs can be exported to multiple formats, including plain text (.txt), JSON (.json), CSV (.csv), or a user-defined format. Users can use their browser's global search function to search historical logs.

[0063] In a preferred embodiment, the intelligent serial port debugging system further includes a responsive layout module 800, which automatically adapts to different screen sizes and device types using responsive design. Specifically, the responsive layout module 800 uses the Bootstrap 5 framework to implement responsive design, automatically adapting to different screen sizes, including large screens (>992px), medium screens (768px-992px), and small screens (<768px). It can automatically adapt to different devices and screen sizes, resulting in low maintenance costs. A three-column layout is used on large screens: a control panel on the left, a data display area in the middle, and a function panel on the right. A two-column layout is used on medium screens: a control panel on the left, and a combination of a data display area and a function panel on the right. A single-column layout is used on small screens, with all panels arranged vertically.

[0064] In a preferred embodiment, the intelligent serial port debugging system further includes a professional color matching module 900. This module provides a color scheme for the system interface, including status indicator colors and theme colors. Specifically, the professional color matching module 900 adopts a professional color scheme for instrumentation, designing reasonable contrast and color schemes to ensure clear and legible text, thus enhancing the system's professional feel and user experience. For example, in terms of status indicator colors, green (#22c55e) indicates success, red (#ef4444) indicates error, and yellow (#f59e0b) indicates warning. The theme colors include light and dark themes. The light theme uses white (#ffffff, #f8fafc, #e2e8f0) as the main background and blue as the accent color. The dark theme uses dark blue (#0f172a, #1e293b, #334155) as the main color, paired with a grayscale background.

[0065] The method for designing the system's main interface based on the responsive layout module 800 and professional color matching module 900 is as follows: A responsive three-column layout is adopted, prioritizing large screens (>992px). This also accommodates medium screens (768px-992px) and small screens (<768px). Medium screens use a two-column layout with the right panel folded down. Small screens use a single-column layout with all panels arranged vertically. The left control panel has a fixed width and, from top to bottom, includes a serial port settings area, connection control buttons, a data transmission area, and statistics. The serial port settings area is used for port selection and setting the baud rate, data bits, stop bits, and parity bits. The connection control area buttons are used to connect, disconnect, and refresh the serial port. The data transmission area is divided into an input box, a send button, and configuration shortcut commands. The statistics area displays the number of bytes sent, bytes received, and frames. The middle data display area has an adaptive width and is divided into a data transmission and reception display area, data visualization charts, and a data statistics area. The data transmission and reception display area displays the transmitted and received data. The data visualization chart area creates independent chart cards for each data field. The data statistics area displays the current, maximum, and minimum values ​​of each field. The right-hand function panel has a fixed width. It includes functions such as rule configuration, firmware upgrade, environment variables, log management, and help documentation. Firmware upgrade, environment variable, and help documentation will pop up new windows for easy access to complete content and to avoid accidental operations. Rule configuration involves data frame format settings, field management, and saving and loading rules. The firmware upgrade window involves selecting upgrade files and displaying progress. The log management area includes log display, filtering, and export. Green (#22c55e) indicates success, red (#ef4444) indicates errors, and yellow (#f59e0b) indicates warnings. A light theme uses white (#ffffff, #f8fafc, #e2e8f0) as the main background with blue accent colors. A dark theme uses dark blue (#0f172a, #1e293b, #334155) as the main color with a grayscale background.

[0066] In a preferred embodiment, the intelligent serial port debugging system further includes a data export module 1000. This module 1000 is used to export the raw serial port transmission and reception data, parsed valid data, and / or log data. The log data includes event log data and error log data. Specifically, it exports all raw serial port transmission and reception data, including timestamps, direction, and data content. It exports the parsed valid data, including timestamps, field names, values, and units. It exports the log data, including timestamps, event type / error type, and event content / error content (error level).

[0067] The intelligent serial port debugging system provided by this invention adopts a browser / server (B / S) architecture. However, because it is implemented purely from the front end, it does not actually require backend server support, and has advantages such as simple deployment, low maintenance cost, and high security. Please refer to... Figure 5 The intelligent serial port debugging system can be divided into three layers: a front-end user interface layer, a business logic layer, and a data storage layer. The front-end user interface layer is responsible for user interaction and data display, employing a card-based design where each functional module is displayed as a card, resulting in a clear and hierarchical interface. The business logic layer carries the core processing logic of each functional module, including the serial communication management module 000, the data frame parsing module 100, the data visualization module 200, and the rule configuration module 300. The data storage layer is responsible for the persistence and memory management of configuration information and runtime data. It uses localStorage to store user preferences and rule configurations, uses memory variables to manage runtime information such as the receive buffer, send buffer, chart data, and log data, and provides a file export interface for exporting rule files, log files, and data files.

[0068] This invention also discloses an intelligent serial port debugging method, which is implemented based on the intelligent serial port debugging system described above. Please refer to [link / reference]. Figure 6 The first embodiment of the intelligent serial port debugging method of the present invention includes the following steps: S100: Establish a serial communication connection with an external target device through a web-based serial communication interface.

[0069] This step is primarily implemented based on the serial communication management module 000. In short, the system first completes the initial configuration. Then, the user selects the target device from the serial device selection dialog box that pops up in the browser and clicks the "Connect" button. The system then calls `port.open()` with the parameters selected by the user to open the serial port connection. After a successful connection, the system creates `ReadableStream` and `Reader` objects for receiving data, and `WritableStream` and `writer` objects for sending data. The interface status is updated to "Connected". If the user clicks the "Disconnect" button or the device is physically disconnected, the system closes the connection and clears the buffer.

[0070] S200, Load user-defined data frame format rules.

[0071] Specifically, the system loads the user-pre-configured and saved data frame format rules from memory, including the frame header sequence, frame tail sequence, data payload length, verification algorithm type, and configuration information such as the start position, data type, byte order, and unit conversion factor of each data field. The configuration of the data frame format rules is implemented based on the rule configuration module 300. If no data frame format rules have been configured, the system skips subsequent steps S400 and S500, and only performs the raw data transmission, reception, and display functions. If data frame format rules have been configured, data visualization is implemented according to the subsequent steps.

[0072] S300: Receive raw serial data from the target device and store it in the receive buffer.

[0073] This step is primarily implemented based on the serial communication management module 000. Specifically, the data stream management unit continuously and asynchronously receives serial port data, appends the received byte stream to the receive buffer, and simultaneously displays the raw data in real time on the data transmission and reception interface. Users can select text, hexadecimal, or binary mode to view the data via the display switching unit. If the data volume in the receive buffer exceeds a preset threshold, the system automatically triggers overflow detection and cleans up the oldest data to prevent memory overflow.

[0074] S400. Perform frame identification on the data in the receiving buffer according to the data frame format rules.

[0075] This step is primarily implemented using the data frame parsing module 100. Frame identification includes three sub-steps: frame header search, frame tail location and verification, and verification. First, a sliding window algorithm is used to search the receive buffer for the frame header sequence to determine the frame start position. Then, the frame tail position is located based on the data payload length, and the frame tail sequence is verified. Finally, integrity verification is performed according to the configured verification algorithm. If the frame tail does not match or the verification fails, the frame is marked as an erroneous frame and logged, discarded, and subsequent data processing continues.

[0076] S500 extracts valid data fields from the identified data frames and converts them into corresponding physical quantity values.

[0077] This step is executed only after frame recognition is successful, and it is mainly implemented by the data frame parsing module 100. The system extracts the original byte values ​​from the data frame according to the start position of each data field, converts the byte values ​​into numerical values ​​according to the configured data type and byte order, and then multiplies them by a unit conversion factor to obtain the final physical quantity value. After the conversion is complete, the system removes the frame data from the receive buffer, releasing memory space. If there is still data remaining in the buffer, the system returns to step S400 to continue processing.

[0078] S600 displays the physical quantity values ​​of each data field in a chart in real time, with each data field having its own independent visualization graphic component.

[0079] This step is primarily implemented through the data visualization module 200. The converted physical quantity values ​​are appended to the historical dataset of the corresponding field. The X-axis label of the new data point is the current timestamp, and the Y-axis value is the converted physical quantity value. The visualization graph component is a line chart, with each data field updating in real time in its independent line chart. The system presets a maximum number of data points; if this limit is exceeded, the oldest data point is automatically removed. The numerical panel synchronously updates the latest, maximum, minimum, average, and unit values ​​of each field. The timeline dynamically adjusts its scale interval based on the data update frequency, and users can zoom or drag the timeline to view historical data.

[0080] Through steps S100 to S600, the system implements a complete debugging process from serial port connection establishment, rule loading, data transmission and reception, frame recognition and parsing, numerical conversion to chart display. Regardless of whether parsing rules are configured, the system displays the raw data in real time on the data transmission and reception interface, enabling parallel operation of automated parsing and manual verification.

[0081] The present invention also provides a computer storage medium storing a computer program thereon, wherein the computer program, when executed by a processor, implements the above-described intelligent serial port debugging method.

[0082] This invention is based on Web technology and can run as long as the browser supports the Web Serial API. It is compatible with mainstream operating systems such as Windows, Linux, and macOS, eliminating the need to develop different versions for different platforms. It is a pure front-end implementation; simply copy the files to a web server or open the HTML file locally to use it. No software or driver installation is required, making deployment simple and maintenance costs low. All dependent files and project files are very small in total; after copying them locally, they can be used without a network connection, making it suitable for on-site debugging and environments without a network. It supports custom data frame formats, allowing flexible configuration of the meaning of each byte in the data frame according to the actual project. Parameters such as frame header, data length, frame trailer, verification method, and data fields can be flexibly configured, adapting to different communication protocols without writing code. Each field can be independently configured with attributes such as name, start position, data type, byte order, unit conversion factor, unit name, and display color, offering flexible configuration and strong adaptability. It supports saving configured rules as JSON files locally or loading saved rules from local files, facilitating sharing and synchronization of rule configurations among team members and improving collaboration efficiency. This system enables real-time data visualization, converting serial port data into intuitive line charts for easy observation of data trends. It provides a numerical panel displaying real-time data, including current, maximum, minimum, and average values. It supports switching between dark and light themes, allowing users to choose the appropriate theme based on their environment and personal preferences. The system features visually appealing, modern, and user-friendly firmware upgrades, environment variable configuration, and log management capabilities, meeting common serial port functionalities. It also boasts a responsive page design, automatically supporting various screen sizes.

[0083] The above embodiments merely illustrate preferred implementations of the present invention, and while the descriptions are specific and detailed, they should not be construed as limiting the scope of the invention. It should be noted that those skilled in the art can make various modifications and improvements without departing from the concept of the present invention, and these all fall within the protection scope of the present invention. Therefore, the protection scope of this invention should be determined by the appended claims.

Claims

1. An intelligent serial port debugging system, characterized in that, include: The serial communication management module is used to establish and manage serial communication connections with external target devices. The data frame parsing module is used to parse the received serial port data according to predefined data frame format rules; The data visualization module is used to visualize the parsed and valid data. as well as The rule configuration module is used to configure and save custom data frame format rules. The rules include at least the frame header sequence, data payload length, and configuration information for one or more data fields.

2. The intelligent serial port debugging system as described in claim 1, characterized in that, The serial communication management module includes: The serial port event listening unit is used to listen for connection and disconnection events of serial port devices and provide visual feedback on the device connection status. A parameter configuration unit is used to configure communication parameters, including baud rate, data bits, stop bits, and parity bits. The data flow management unit is used to asynchronously process serial port events, maintain receive and transmit buffers, and prevent memory overflow. The display switching unit is used to switch the display mode of the data transmission and reception interface according to the user's selection. The display modes include text display, hexadecimal display, and binary display; and / or The statistics unit is used to count the number of bytes sent, bytes received, frames sent, and frames received in real time.

3. The intelligent serial port debugging system as described in claim 2, characterized in that, The data frame parsing module includes: The frame header identification unit is used to search for the user-configured frame header byte sequence in the receive buffer and identify the start position of the data frame; The frame tail identification unit is used to locate the frame tail position according to the data payload length in the data frame format rules, and to verify whether the frame tail bytes match the configured frame tail sequence. The verification unit is used to verify the data frame according to the configured verification algorithm after the frame tail is matched. The data extraction unit is used to extract valid data fields from the data frame after the verification is passed.

4. The intelligent serial port debugging system as described in claim 1, characterized in that, The data visualization module includes: The chart management unit is used to dynamically create and destroy chart instances based on the enabling status of data fields. Each enabled data field corresponds to an independent visualization component. Numerical panel cells are used to display the latest value, historical maximum value, historical minimum value, historical average value and / or unit for each field; Multi-axis display unit is used to create independent numerical axes for multiple data fields in the same chart, with the color of each numerical axis associated with the color of the corresponding data field. Chart theme adaptive unit, used to automatically adjust chart colors and styles according to the system theme; and / or The data update unit is used to update chart data in real time and retain a preset number of historical data points.

5. The intelligent serial port debugging system as described in claim 1, characterized in that, The rule configuration module includes: The frame structure configuration unit is used to configure the frame parameters of the data frame, including the frame header sequence, frame tail sequence, data payload length, and verification algorithm type. The field management unit is used to manage the fields in the data frame, and supports dynamically adding, deleting, and editing fields; A rule validation unit is used to validate the completeness and legality of rules; and / or The rule template unit provides rule templates for commonly used protocols, allowing users to quickly create rule configurations based on these templates.

6. The intelligent serial port debugging system as described in claim 1, characterized in that, Also includes: Firmware upgrade module, used to perform online firmware upgrades on target devices via serial port; The firmware upgrade module includes: The file upload unit is used to support users in selecting firmware files; The block transmission unit is used to calculate the block size and the number of blocks according to the size of the firmware file and the size of the receive buffer of the target device, and to divide the firmware file into multiple data blocks according to the block size and send them to the target device block by block; A progress display unit is used to display the firmware upgrade progress in real time; and / or The upgrade verification unit is used to verify the integrity of the firmware transmission and the upgrade result.

7. The intelligent serial port debugging system as described in claim 1, characterized in that, Also includes: The environment variable management module is used to read environment variable configurations from the target device, display them on the web interface, edit the environment variables, and save the modified environment variables back to the target device. The theme management module is used to dynamically switch between dark and light themes; and / or The log management module is used to record and export logs, including data logs, event logs, parsing logs, and operation logs.

8. The intelligent serial port debugging system as described in claim 1, characterized in that, Also includes: The responsive layout module is used to automatically adapt to different screen sizes and device types using responsive design. A professional color scheme module is used to provide color schemes for the system interface, including status indicator color schemes and theme color schemes; and / or The data export module is used to export the raw serial port data, parsed valid data, and / or log data.

9. A method for intelligent serial port debugging, characterized in that, The intelligent serial port debugging system based on any one of claims 1 to 8 includes the following steps: Establish a serial communication connection with an external target device through a web-based serial communication interface; Load user-defined data frame format rules; Receive raw serial data from the target device and store it in the receive buffer; Frame identification is performed on the data in the receive buffer according to the data frame format rules; Extract valid data fields from the identified data frames and convert them into corresponding physical quantity values; The physical quantity values ​​of each data field are displayed in real time in the chart, and each data field has an independent visualization graphic component.

10. A computer storage medium storing a computer program thereon, characterized in that: When the computer program is executed by the processor, it implements the intelligent serial port debugging method as described in claim 9.

Images