Front-end AI conversation data management system and method thereof

Abstract

The application is suitable for the field of data management, and provides a front-end AI conversation data management system and a method thereof.The system comprises an asynchronous data stream management module, a state management module, a streaming data control module, a Markdown rendering engine and an extension module.The application has the beneficial effects that the asynchronous data stream management module realizes efficient synchronization of data between the front end and the back end, significantly reduces data processing delay, the state management module ensures consistency of the user interface and the back-end data, optimizes user experience, the built-in advanced Markdown rendering engine supports multiple custom syntaxes, so that the output content of the AI can be flexibly personalized rendered, and the modular design is adopted, so that the system can be customized and extended according to business requirements and is suitable for different application scenarios.

Description

Technical Field

[0001] The present invention belongs to the field of data management, and in particular relates to a front-end AI dialogue data management system and method thereof. Background Art

[0002] Today, AI conversational systems have been widely integrated into various industries, becoming a key factor in enhancing corporate competitiveness. However, many challenges remain in front-end data management and user experience.

[0003] On the one hand, data processing delays are severe. In traditional architectures, the front-end and back-end rely on synchronous requests. For example, in online medical consultation scenarios, after the patient describes their symptoms, the front-end needs to wait for the back-end to analyze the symptoms, retrieve medical records, and generate medical advice. The long blank periods during this period can easily cause anxiety and reduce the user experience. On the other hand, AI dialogue state management is complex. When users frequently switch topics or rewind conversations, the front-end state is easily confused. For example, in the learning tutoring system, knowledge point prompts often have errors. At the same time, custom display capabilities are lacking and are mostly limited to text. When consulting on tourism, it is impossible to display pictures of scenic spots and route maps, making it difficult to meet diverse needs. In addition, scalability is limited. The closed architecture customized for specific scenarios requires code reconstruction when business expansion occurs, which is time-consuming and labor-intensive, hindering system upgrades.

[0004] Therefore, there is an urgent need for an efficient front-end data management system and its method to solve problems such as data processing delays, complex state management, insufficient customized display, and limited scalability. Summary of the Invention

[0005] The purpose of the present invention is to provide a front-end AI dialogue data management system and method thereof, aiming to solve the problems raised in the above-mentioned background technology.

[0006] The present invention is implemented as follows: on the one hand, a front-end AI dialogue data management system, the system comprising:

[0007] An asynchronous data flow management module, which uses asynchronous data flow technology to send requests input by front-end users to the AI ​​backend without blocking the main thread, and continuously monitors response data from the AI ​​backend. When new data is received, it triggers subsequent processing to ensure real-time data transmission between the frontend and backend and reduce response latency. The asynchronous data flow technology includes RxJS or Redux Thunk.

[0008] A state management module, built on Vuex, Pinia, or Redux, records interaction status information at each stage of the user-AI interaction process, including user input history, AI response status, and current conversation rounds. This ensures data consistency through the state management mechanism, allowing the user interface to synchronously display the latest status.

[0009] The streaming data control module monitors the data flow between users and AI in real time. Based on status changes during the interaction process, it transmits and updates front-end data promptly and accurately. When users modify questions mid-process or AI adds new prompts, the front-end display content is adjusted to ensure the timeliness and accuracy of the interface display.

[0010] Markdown rendering engine, which is a built-in advanced rendering engine that supports multiple custom syntaxes. When receiving Markdown-formatted results returned by the AI ​​backend, it converts them into rich text format for rendering and display according to the user's pre-set requirements, providing diversified display capabilities;

[0011] Extension modules are dynamically loaded during system startup or operation based on different business needs. They interact with the core system through unified interface specifications to achieve personalized expansion of system functions and adapt to various scenarios from simple conversations to complex multi-round interactions.

[0012] The present invention provides a front-end AI dialogue data management system and method thereof, and its beneficial technical effects include:

[0013] (1) Reduced latency: Through the asynchronous data flow management module, efficient data synchronization between the front-end and back-end is achieved, significantly reducing data processing latency.

[0014] (2) Data consistency: The state management module ensures the consistency between the user interface and the backend data, thus optimizing the user experience.

[0015] (3) Personalized display: The built-in advanced Markdown rendering engine supports a variety of custom syntaxes, allowing AI output content to be flexibly and personalized.

[0016] (4) High scalability: The system adopts a modular design and can be customized and expanded according to business needs to adapt to different application scenarios. BRIEF DESCRIPTION OF THE DRAWINGS

[0017] Figure 1 It is a system architecture diagram of a front-end AI dialogue data management system.

[0018] Figure 2 It is a workflow diagram of the front-end AI dialogue data management method.

[0019] Figure 3 It is a state management flowchart of the front-end AI dialogue data management method.

[0020] Figure 4 It is a working principle diagram of the Markdown rendering engine of the front-end AI dialogue data management system.

[0021] Figure 5 It is an extension module schematic diagram of a front-end AI conversation data management system. DETAILED DESCRIPTION

[0022] 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 combination with the drawings and examples. It should be understood that the specific examples described herein are only used to explain the present application and do not limit the present application.

[0023] The specific implementation of the present application is described in detail below in combination with specific examples.

[0024] The present application provides a front-end AI conversation data management system and method, which solves the technical problems in the background art.

[0025] As another preferred embodiment of the present application, in another aspect, a front-end AI conversation data management system, the system comprises:

[0026] An asynchronous data flow management module is used to send the request input by the front-end user to the AI back-end using the asynchronous data flow technology without blocking the main thread, and continuously listens to the response data from the AI back-end, triggers the subsequent processing flow when new data is received, to guarantee the real-time transmission of data between the front-end and the back-end and reduce the response delay; the asynchronous data flow technology includes RxJS or Redux Thunk;

[0027] A state management module is built based on Vuex, Pinia or Redux, which is used to record the interaction state information of each stage including user input history, AI response state and current conversation round in the whole process of user interaction with AI, ensures the consistency of data through the state management mechanism, and synchronously displays the latest state on the user interface;

[0028] A streaming data control module is used to monitor the data flow between the user and the AI in real time, transmit and update the front-end data in time and accurately according to the state change in the interaction process, adjust the front-end display content when the user modifies the question or the AI adds new prompt information, and ensure the timeliness and correctness of the interface display;

[0029] A Markdown rendering engine is a built-in advanced rendering engine supporting multiple custom syntaxes, which converts the result returned by the AI back-end containing Markdown format into a rich text form for rendering display according to the user's pre-set requirements, to provide diversified display capabilities;

[0030] Extension modules are dynamically loaded during system startup or operation based on different business needs. They interact with the core system through unified interface specifications to achieve personalized expansion of system functions and adapt to various scenarios from simple dialogues to complex multi-round interactions.

[0031] Before sending user requests, the asynchronous data flow management module converts and encapsulates the request format to adapt to the communication protocol with the AI ​​backend. When monitoring AI response data, a data monitoring callback function is set to promptly notify relevant modules for processing when data is received;

[0032] During the system initialization phase, the state management module initializes the default interaction state, including the initial state when the user is not logged in and the default conversation topic. It also records the current interaction state the moment a user request is issued, and continuously updates the state as data interaction progresses, recording whether the AI ​​has received the request, whether processing has begun, and the processing progress. In the event of an exception that causes confusion in the interaction state, the module automatically rolls back the state to the previous stable state.

[0033] When the streaming data control module receives partial data or updated data from the AI ​​from the asynchronous data stream management module, it determines the validity and priority of the data based on the current interaction status. For text snippets, it displays them in the answer area of ​​the front-end interface in an appended manner; for structured data, it performs preliminary parsing before displaying them.

[0034] The Markdown rendering engine loads preset custom grammar rules and default rendering styles at startup. When encountering unrecognizable grammar or rendering errors, it adopts a degradation processing method, displays the unrendered part in the original text form, and records an error log.

[0035] As another preferred embodiment of the present invention:

[0036] (1) System initialization:

[0037] During system startup, the core modules are initialized. The asynchronous data flow management module configures connection parameters with the AI ​​backend, establishes a stable communication channel, and sets callback functions for data monitoring. The state management module initializes default interaction states, such as the initial state when the user is not logged in and the default conversation topic. The Markdown rendering engine loads pre-set custom syntax rules and default rendering styles. The extension module scans the directory for available extension packages, identifies, and records information about loadable modules.

[0038] (2) User interaction process:

[0039] When a user logs in and enters a request, the front-end interface triggers a corresponding event, passing the request to the asynchronous data flow management module. This module sends the request to the AI ​​backend according to the predetermined protocol and simultaneously starts a listening thread to wait for a response.

[0040] The state management module updates the interaction status in real time, records the detailed information of the user request in the state tree, and marks the current conversation entering the request sending stage.

[0041] Once the asynchronous data stream management module receives partial response data from the AI ​​backend, it immediately notifies the streaming data control module. This module determines how to display the data based on the current state. For example, if it is a text snippet, it will be directly displayed in the answer area of ​​the front-end interface as an appended form; if it is structured data, it will be initially parsed before display.

[0042] When the complete AI response arrives and contains Markdown content, the Markdown rendering engine deeply renders it, replacing the original temporary display content on the front-end interface with the rendered rich text, presenting the user with the final exquisite result.

[0043] During the entire interaction process, if business needs trigger the loading conditions of extension modules, such as entering a specific business scenario or the user selecting a specific function, the system dynamically loads the corresponding extension module, and the extension module is connected to the core process to enhance the system function.

[0044] (3) Exception handling:

[0045] If the asynchronous data stream management module encounters an abnormality such as a connection interruption or timeout during data transmission, the retry mechanism is immediately triggered. According to the preset retry strategy, multiple attempts are made to reconnect to the AI ​​backend and send requests. At the same time, a friendly error message such as "Network connection abnormality, please try again later" is fed back to the user interface.

[0046] When an exception occurs, the state management module records the time, type, and related context for subsequent troubleshooting. If an exception causes a state disruption, the module automatically rolls back to the previous stable state, ensuring system stability.

[0047] For the Markdown rendering engine, if it encounters unrecognizable syntax or rendering errors, it uses a degradation processing method to display the unrendered part in the original text form and record the error log for developers to optimize later.

[0048] As a preferred embodiment of the present invention:

[0049] The front-end AI dialogue data management method includes:

[0050] Step 1: The user enters a request in text, voice, or other form through the front-end interface;

[0051] Step 2: After the front-end receives the user request, the asynchronous data flow management module is immediately started, converting and encapsulating the user request format, sending it to the AI ​​back-end through an efficient asynchronous transmission channel, and simultaneously starting a listening thread for AI response data;

[0052] Step 3: The current interaction status is recorded synchronously at the moment the user request is sent, including the request time and request content summary. The status is continuously updated as the data interaction progresses, recording whether the AI ​​has received the request, whether it has started processing, and the processing progress;

[0053] Step 4: The streaming data control module intervenes, determines the validity and priority of the data based on the current interaction status, and pushes the latest data to the front-end interface for display in a timely manner;

[0054] Step 5: If the AI ​​backend returns a result containing Markdown content, the Markdown rendering engine starts, parses the Markdown syntax, and converts the AI ​​output into rich text based on user-defined rendering rules.

[0055] Step 6: Based on the special needs of different businesses, the system can dynamically load specific extension modules at startup or during operation.

[0056] In order to enable the above-mentioned method and system to be loaded and run smoothly, in addition to the various modules mentioned above, the system may also include more or fewer components than described above, or a combination of certain components, or different components, for example, it may include input and output devices, network access devices, buses, processors and memories, etc.

[0057] The processor may be a central processing unit, other general-purpose processors, digital signal processors, application-specific integrated circuits, off-the-shelf programmable gate arrays or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, etc. The general-purpose processor may be a microprocessor or any conventional processor. The processor is the control center of the system, connecting various components using various interfaces and lines.

[0058] The technical features of the above-mentioned embodiments can be combined arbitrarily. In order to make the description concise, not all possible combinations of the technical features in the above-mentioned embodiments are described. However, as long as there is no contradiction in the combination of these technical features, they should be considered to be within the scope of this specification.

[0059] The above-described embodiments merely illustrate several implementations of the present invention, and while their descriptions are relatively specific and detailed, they should not be construed as limiting the scope of the present invention. It should be noted that a person skilled in the art would be able to make numerous variations and improvements without departing from the spirit of the present invention, all of which fall within the scope of protection of the present invention. Therefore, the scope of protection of the present invention shall be determined by the appended claims.

[0060] The above description is only a preferred embodiment of the present invention and is not intended to limit the present invention. Any modifications, equivalent substitutions and improvements made within the spirit and principles of the present invention should be included in the scope of protection of the present invention.

Claims

1. A front-end AI dialogue data management system, characterized in that: The system comprises: An asynchronous data flow management module, which uses asynchronous data flow technology to send requests input by front-end users to the AI ​​backend without blocking the main thread, and continuously monitors response data from the AI ​​backend. When new data is received, it triggers subsequent processing to ensure real-time data transmission between the frontend and backend and reduce response latency. The asynchronous data flow technology includes RxJS or Redux Thunk. A state management module, built on Vuex, Pinia, or Redux, records interaction status information at each stage of the user-AI interaction process, including user input history, AI response status, and current conversation rounds. This ensures data consistency through the state management mechanism, allowing the user interface to synchronously display the latest status. The streaming data control module monitors the data flow between users and AI in real time. Based on status changes during the interaction process, it transmits and updates front-end data promptly and accurately. When users modify questions mid-process or AI adds new prompts, the front-end display content is adjusted to ensure the timeliness and accuracy of the interface display. Markdown rendering engine, which is a built-in advanced rendering engine that supports multiple custom syntaxes. When receiving Markdown-formatted results returned by the AI ​​backend, it converts them into rich text format for rendering and display according to the user's pre-set requirements, providing diversified display capabilities; Extension modules are dynamically loaded during system startup or operation based on different business needs. They interact with the core system through unified interface specifications to achieve personalized expansion of system functions and adapt to various scenarios from simple conversations to complex multi-round interactions.

2. The front-end AI dialogue data management system according to claim 1, characterized in that: Before sending the user request, the asynchronous data flow management module converts and encapsulates the request format to adapt to the communication protocol with the AI ​​backend, and when monitoring the AI ​​response data, a data monitoring callback function is set to promptly notify the relevant modules for processing when the data is received.

3. The front-end AI dialogue data management system according to claim 1, characterized in that: During the system initialization phase, the state management module initializes the default interaction state, including the initial state when the user is not logged in and the default conversation topic. It synchronously records the current interaction state at the moment the user request is issued, and continuously updates the state as the data interaction progresses, recording whether the AI ​​has received the request, whether processing has started, and processing progress information. When an exception occurs that causes confusion in the interaction state, the state is automatically rolled back to the previous stable state.

4. The front-end AI dialogue data management system according to claim 1, characterized in that: When the streaming data control module receives partial data or updated data from the AI ​​from the asynchronous data stream management module, it determines the validity and priority of the data based on the current interaction status. For text fragments, it is displayed in an appended manner in the answer area of ​​the front-end interface; for structured data, it is preliminarily parsed before displaying.

5. The front-end AI dialogue data management system according to claim 1, characterized in that: The Markdown rendering engine loads preset custom grammar rules and default rendering styles at startup. When encountering unrecognizable grammar or rendering errors, it adopts a degradation processing method, displays the unrendered part in the original text form, and records an error log.

6. A front-end AI dialogue data management method, characterized in that: Applying the front-end AI dialogue data management system according to any one of claims 1 to 5, the method includes: Step 1: The user enters a request in text, voice, or other form through the front-end interface; Step 2: After the front-end receives the user request, the asynchronous data flow management module is immediately started, converting and encapsulating the user request format, sending it to the AI ​​back-end through an efficient asynchronous transmission channel, and simultaneously starting a listening thread for AI response data; Step 3: The current interaction status is recorded synchronously at the moment the user request is sent, including the request time and request content summary. The status is continuously updated as the data interaction progresses, recording whether the AI ​​has received the request, whether it has started processing, and the processing progress; Step 4: The streaming data control module intervenes, determines the validity and priority of the data based on the current interaction status, and pushes the latest data to the front-end interface for display in a timely manner; Step 5: If the AI ​​backend returns a result containing Markdown content, the Markdown rendering engine starts, parses the Markdown syntax, and converts the AI ​​output into rich text based on user-defined rendering rules. Step 6: Based on the special needs of different businesses, the system can dynamically load specific extension modules at startup or during operation.

Images