Webpage construction method, device and equipment based on dialogue flow
By using a dialogue-flow-based webpage construction method, a streaming transmission channel is established between the server and the client, generating and rendering page content segment by segment. This solves the problems of long development cycles and poor user experience in traditional webpage construction, and achieves real-time display and progressive loading of the page.
Patent Information
- Application Number
- CN202611065050.7
- Authority / Receiving Office
- CN · China
- Patent Type
- Applications(China)
- Current Assignee / Owner
- Filing Date
- 2026-07-16
- Publication Date
- 2026-11-06
AI Technical Summary
Existing web page building technologies suffer from problems such as long development cycles, high labor costs, difficult maintenance, rigidity of fixed templates, slow loading of complex pages, and long white screen times, resulting in poor user experience, especially in scenarios involving large amounts of data calculation or visualization chart rendering.
A dialogue-flow-based web page construction method is adopted, which generates and renders the page segment by segment through a streaming transmission channel. The server sends the rendering code of each segment to the client for display immediately after it is generated. The client renders the content of the segment in real time, realizing the priority display of local components and progressive rendering.
It reduces user waiting time, improves user experience, allows users to see part of the content instantly during page loading, solves the white screen problem caused by full page loading in traditional web page building methods, and improves development efficiency and flexibility.
Smart Images

Figure CN123048880A_ABST
Abstract
Description
Technical Field
[0001] This invention relates to the field of page processing and related technical fields, specifically to a method, apparatus, and device for constructing web pages based on dialogue flow. Background Technology
[0002] With the rapid development of internet technology, web applications have become the main carrier of information display and interaction. Currently, web page construction technologies mainly include traditional web development methods, template generation technologies, and low-code platforms, each with its own limitations.
[0003] Traditional web development requires developers to possess specialized programming skills in front-end design, back-end data processing, and server maintenance. From page component development to data interface integration, everything must be manually coded, resulting in long development cycles, high labor costs, and extremely difficult maintenance and iteration, making it hard to cope with rapidly changing business needs. While template generation technology can improve development efficiency to some extent, its core drawback is that the template structure is pre-fixed, and content can only be filled based on limited configuration parameters, unable to dynamically adjust the page paragraph structure according to user context or business semantics. When the data sources to be displayed on the page are complex and the content hierarchy needs to change flexibly, the rigidity of fixed templates becomes a bottleneck. More importantly, existing template generation solutions typically use a one-time full-page rendering method on the server side. This means the server must wait for all template paragraphs to be assembled before returning the complete HTML document to the client at once. For complex pages containing large amounts of data calculations, visualization chart rendering, or third-party data aggregation, server-side processing can take several seconds or even tens of seconds. During this time, the client browser remains in a blank screen waiting state, and the user cannot see any page content, resulting in a very poor user experience. Low-code platforms lower the barrier to entry for UI creation through visual drag-and-drop and configurable methods, but their underlying rendering mechanism still uses a full-page loading model—the client requests all page resources at once, the server returns all page code at once, and the browser only displays the final interface after completing all parsing and rendering. Although low-code platforms improve efficiency during the development phase, they do not solve the problems of slow initial loading and long white screen times for complex pages during runtime, and they cannot achieve priority differentiation and progressive presentation of different functional modules within a page.
[0004] Given the problems with existing technologies, there is an urgent need for a webpage construction method based on dialogue flow. Summary of the Invention
[0005] The embodiments described herein provide a method, apparatus, and device for constructing web pages based on a dialogue flow, enabling the priority display and progressive rendering of local components.
[0006] Firstly, based on the content of this disclosure, a method for constructing web pages based on dialogue flow is provided, including: In response to receiving a webpage construction request from a client, a target document template is determined based on the webpage construction request, wherein the webpage construction request includes a streaming channel establishment indication identifier, authentication token information, and a template identifier; Based on the target document template, determine the list of paragraphs included in the target document template; According to the order of the paragraph objects included in the paragraph list, the paragraph content corresponding to each paragraph object is parsed one by one, and the page rendering code block corresponding to each paragraph object is generated in sequence. The page rendering code blocks corresponding to each paragraph object generated in sequence are output through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block, wherein the target paragraph object is one of the paragraph objects included in the paragraph list.
[0007] In some embodiments of this disclosure, the step of responding to receiving a webpage construction request from a client and determining the target document template based on the webpage construction request includes: In response to receiving a webpage construction request from a client, obtain the authentication token information included in the webpage construction request; After the authentication token information satisfies the preset token information, the target document template is determined based on the template identifier included in the webpage construction request.
[0008] In some embodiments of this disclosure, determining the list of paragraphs included in the target document template based on the target document template includes: Obtain the template configuration information of the target document template; Based on the template configuration information of the target document template, determine the list of paragraphs included in the target document template.
[0009] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the order of the paragraph objects included in the paragraph list, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: According to the sorting of the paragraph objects included in the paragraph list, obtain the paragraph type identifier corresponding to each paragraph object; Based on the paragraph type identifier corresponding to each paragraph object, the paragraph content corresponding to each paragraph object is parsed one by one, and the page rendering code block corresponding to each paragraph object is generated in sequence.
[0010] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the paragraph type identifier corresponding to each paragraph object, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: When the paragraph type identifier corresponding to the paragraph object is a static paragraph type, the component paragraph type identifier is determined based on the target field information in the paragraph content; Retrieve the rendering function and configuration parameters corresponding to the component paragraph type identifier; Based on the rendering function and the configuration parameters, a page rendering code block corresponding to the paragraph object is generated.
[0011] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the paragraph type identifier corresponding to each paragraph object, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: When the paragraph type identifier corresponding to the paragraph object is a dynamic paragraph type, the AI model type, prompt word template, and context extraction rules are determined based on the configuration information of the paragraph content. Based on the aforementioned context extraction rules, relevant context information is extracted from the generated paragraph content; The extracted context information is filled into the prompt word template, and AI call instruction information is generated; Based on the AI model type and the AI invocation instruction information, the AI agent interface is invoked, and prompt words generated by the prompt word template are sent to the AI model to generate target content through the AI model; Based on the target content generated by the AI model, a page rendering code block corresponding to the paragraph object is generated.
[0012] Secondly, based on the content of this disclosure, another method for constructing web pages based on dialogue flow is provided for application on a client-side basis, including: Receive the target page rendering code block corresponding to the target paragraph object sent in real time by the server; Based on the target page rendering code block, the target paragraph content corresponding to the target paragraph object is rendered in real time.
[0013] In some embodiments of this disclosure, the step of rendering the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block includes: The target paragraph container element is determined based on the value of the target field in the target page rendering code block; Add the generated target page rendering code block to the target paragraph container element; The target page rendering code block is executed to render the content of the target paragraph corresponding to the target paragraph object in real time.
[0014] Thirdly, according to the present disclosure, a webpage building apparatus based on a dialogue flow is provided, applied on a server side, including: The target document template determination module is used to determine the target document template in response to receiving a webpage construction request sent by the client, wherein the webpage construction request includes a streaming channel establishment indication identifier, authentication token information, and template identifier; The paragraph list determination module is used to determine the paragraph list included in the target document template based on the target document template; The rendering code generation module is used to parse the paragraph content corresponding to each paragraph object according to the order of the paragraph objects included in the paragraph list, and generate the page rendering code block corresponding to each paragraph object in sequence. The output module is used to output the page rendering code blocks corresponding to each paragraph object generated in sequence through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block, wherein the target paragraph object is one of the paragraph objects included in the paragraph list.
[0015] Fourthly, according to this disclosure, a computer device is provided, comprising: One or more processors; Storage device for storing one or more programs. When the one or more programs are executed by the one or more processors, the one or more processors perform the method as described in either the first aspect or the second aspect.
[0016] The webpage construction method based on dialogue flow provided in this disclosure first responds to a webpage construction request sent by a client, determines a target document template based on the request, then determines a list of paragraphs included in the target document template, and parses the paragraph content corresponding to each paragraph object in turn according to the order of the paragraph objects included in the paragraph list, and sequentially generates page rendering code blocks corresponding to each paragraph object. Finally, the sequentially generated page rendering code blocks corresponding to each paragraph object are output through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block. Since a streaming transmission channel is pre-established between the server and the client, after each paragraph's page rendering code block is generated, the server immediately sends the code block to the client through the streaming transmission channel, without waiting for subsequent paragraphs to be generated, to execute the script and complete the style application, thereby achieving the instant display of the paragraph. Since each paragraph is rendered independently, the user can see the generated paragraph content before the overall page is fully loaded.
[0017] The above description is merely an overview of the technical solutions of the embodiments of this application. In order to better understand the technical means of the embodiments of this application and to implement them in accordance with the contents of the specification, and to make the above and other objects, features and advantages of the embodiments of this application more obvious and understandable, specific implementation methods of this application are described below. Attached Figure Description
[0018] To more clearly illustrate the technical solutions of the embodiments of this disclosure, the accompanying drawings of the embodiments will be briefly described below. It should be understood that the drawings described below only relate to some embodiments of this disclosure and are not intended to limit this disclosure, wherein: Figure 1 This is a flowchart illustrating a dialogue flow-based webpage construction method provided in an embodiment of this disclosure; Figure 2 This is a flowchart illustrating another method for constructing a webpage based on a dialogue flow, as provided in this embodiment of the disclosure. Figure 3 This is a schematic diagram of the structure of a web page building device based on a dialogue flow provided in an embodiment of this disclosure; Figure 4 This is a schematic diagram of another dialog-flow-based web page building apparatus provided in an embodiment of this disclosure; Figure 5 This is a schematic diagram of the structure of a computer device provided in an embodiment of this disclosure.
[0019] In the accompanying diagram, markers with the same last two digits correspond to the same elements. It should be noted that the elements in the diagram are schematic and not drawn to scale. Detailed Implementation
[0020] To make the objectives, technical solutions, and advantages of the embodiments of this disclosure clearer, the technical solutions of the embodiments of this disclosure will be clearly and completely described below with reference to the accompanying drawings. Obviously, the described embodiments are only some, not all, of the embodiments of this disclosure. All other embodiments obtained by those skilled in the art based on the described embodiments of this disclosure without creative effort are also within the scope of protection of this disclosure.
[0021] Unless otherwise defined, all terms used herein (including technical and scientific terms) shall have the same meaning as commonly understood by one of ordinary skill in the art to which this subject matter pertains. It will be further understood that terms such as those defined in commonly used dictionaries shall be interpreted as having the meaning consistent with their meaning in the context of the specification and in the relevant art, and shall not be interpreted in an idealized or overly formal form unless otherwise explicitly defined herein. As used herein, the statement of “connecting” or “coupling” two or more parts together shall mean that these parts are directly joined together or joined through one or more intermediate components.
[0022] The term "embodiment" as used herein means that a particular feature, structure, or characteristic described in connection with an embodiment may be included in at least one embodiment of this application. The appearance of the phrase "embodiment" in various places throughout the specification does not necessarily refer to the same embodiment, nor is it a separate or alternative embodiment mutually exclusive with other embodiments. It will be explicitly and implicitly understood by those skilled in the art that the embodiments described herein can be combined with other embodiments.
[0023] In this article, the term "and / or" is merely a description of the relationship between related objects, indicating that three relationships can exist. For example, A and / or B can mean: A exists, A and B exist simultaneously, or B exists. Additionally, the character " / " in this article generally indicates that the preceding and following related objects have an "or" relationship.
[0024] Furthermore, in all embodiments of this disclosure, terms such as “first” and “second” are used only to distinguish one component (or part of a component) from another component (or another part of a component).
[0025] In the description of this application, unless otherwise stated, "multiple" means two or more (including two), and similarly, "multiple groups" means two or more (including two groups).
[0026] To enable those skilled in the art to better understand the present application, the technical solutions in the embodiments of the present application will be clearly and completely described below with reference to the accompanying drawings.
[0027] In view of the problems existing in the prior art, this disclosure provides a webpage construction method based on dialogue flow. The webpage construction method based on dialogue flow provided in this disclosure is applied to the server side. Figure 1 This is a flowchart illustrating a dialogue flow-based webpage construction method provided in this disclosure. Figure 1 As shown, the dialogue flow-based webpage construction method includes: S110. In response to receiving a webpage construction request from the client, determine the target document template based on the webpage construction request.
[0028] The webpage construction request includes a streaming channel establishment indication, authentication token information, and template identifier.
[0029] In traditional web page building, the server needs to wait for all page segment code to be generated before encapsulating the complete HTML document into a response data packet and sending it to the client. The client can only begin rendering the page after fully receiving the entire response packet. This method results in users seeing a long period of blank page during the waiting process, a phenomenon known as "white screen wait."
[0030] To address the problems existing in the prior art, this disclosure provides a webpage construction method based on a dialogue flow. The server does not need to wait for all paragraphs to be generated; instead, it immediately sends the code snippet to the client through an established streaming channel as soon as the rendering code for each paragraph is completed. Upon receiving a code snippet, the client immediately renders and displays the corresponding page paragraph. The page content perceived by the user is presented gradually, without waiting for the entire page to load.
[0031] In a specific implementation, upon receiving a webpage construction request from a client, the target document template should be determined based on the webpage construction request, including: in response to receiving the webpage construction request from the client, obtaining the authentication token information included in the webpage construction request; and after the authentication token information satisfies the preset token information, determining the target document template based on the template identifier included in the webpage construction request.
[0032] First, the server receives the webpage build request sent by the client. After receiving the webpage build request, the server parses the webpage build request to obtain the streaming channel establishment indicator, authentication token information, and template identifier. Then, based on the authentication token information included in the webpage build request, the server determines whether the session status between the server and the client is normal. When the authentication token information is successfully authenticated, the server determines that the server and the client support the streaming protocol based on the streaming channel establishment indicator. Finally, based on the template identifier included in the webpage build request, the target document template is determined.
[0033] Specifically, an indicator is established based on the streaming channel to indicate that the server and client support streaming, and that a streaming channel has been established between the server and client.
[0034] When a client initiates a webpage build request, it includes an `Accept` field in the request header. This field is set to either "text / event-stream" or "application / websocket," informing the server that streaming protocols are supported between the server and client. Upon recognizing this field, the server does not close the connection but keeps it open and sends an acknowledgment frame to the client. The server then parses and generates rendering code segment by segment according to the order of the segment objects in the segment list. After generating the code for each segment, the server encapsulates it into one or more data frames and sends them to the client via the protocol encapsulation layer. The time interval between adjacent data frames depends on the time taken to generate the segment, typically ranging from tens of milliseconds to several seconds. When the last segment's data frame has been sent, the server sends an end-of-transmission flag frame. Upon receiving the end-of-transmission flag frame, the client actively closes the connection and releases related resources. If an exception occurs during transmission, either party can send a close frame to prematurely terminate the transmission.
[0035] S120. Based on the target document template, determine the list of paragraphs included in the target document template.
[0036] Specifically, each document template contains structured template configuration information, which defines a paragraph list. The paragraph list includes multiple paragraph objects. These paragraph objects are generated from different paragraph content in the document template according to the page display order. Each paragraph object includes a paragraph identifier and a paragraph type identifier. The paragraph identifier uniquely identifies a paragraph object, and the paragraph type identifier indicates whether the paragraph content corresponding to that paragraph object is a static or dynamic paragraph.
[0037] In a specific implementation, determining the list of paragraphs included in the target document template based on the target document template includes: obtaining the template configuration information of the target document template; and determining the list of paragraphs included in the target document template based on the template configuration information of the target document template.
[0038] Based on the target document template determined in step S110, the server loads the complete configuration information of the target document template from the template cache or template storage.
[0039] The template configuration information is organized in JSON format and includes at least two parts: template metadata and a paragraph list. The template metadata includes information such as the template identifier, template name, version number, and creation time. The paragraph list is an array containing multiple paragraph objects, arranged in the order in which the paragraph content is displayed on the page.
[0040] Each paragraph object in the paragraph list contains at least the following fields: paragraphId: Paragraph identifier, used to locate the corresponding DOM element during rendering; paragraphType: Paragraph type identifier, with values of "static" or "dynamic", representing static and dynamic paragraphs respectively; componentType: Component type identifier, valid when paragraphType is "static", indicating the component type used by the paragraph; aiConfig: AI configuration object, valid when paragraphType is "dynamic", containing various parameters for AI calls.
[0041] The server stores the parsed list of paragraphs in memory and records the total number of paragraphs for subsequent progress tracking and end-of-stream determination.
[0042] S130. According to the order of the paragraph objects included in the paragraph list, parse the paragraph content corresponding to each paragraph object one by one, and generate the page rendering code block corresponding to each paragraph object in sequence.
[0043] Specifically, the server processes the paragraph content of each paragraph object sequentially from the beginning to the end, following the order of the paragraph objects in the paragraph list. For the currently being processed paragraph content, it first obtains its paragraph type identifier and then adopts different processing strategies based on the paragraph type identifier. If the current paragraph is a static paragraph, the server determines the component to be used based on the component type field in the paragraph content, retrieves the rendering function of that component from the component library, and passes the configuration parameters in the paragraph to the rendering function. The rendering function then generates the corresponding HTML / CSS / JavaScript code snippets as page rendering code blocks. If the current paragraph is a dynamic paragraph, the server extracts the context from the generated paragraph content based on the AI configuration information in the paragraph, populates the context into the prompt word template, and then calls the AI agent interface. This allows the AI model to generate content based on the prompt words, and the server then encapsulates the AI-generated content into page rendering code blocks.
[0044] In a specific implementation, the paragraph content corresponding to each paragraph object is parsed one by one according to the order of the paragraph objects included in the paragraph list, and the page rendering code block corresponding to each paragraph object is generated sequentially. This includes: obtaining the paragraph type identifier corresponding to each paragraph object according to the order of the paragraph objects included in the paragraph list; parsing the paragraph content corresponding to each paragraph object one by one according to the paragraph type identifier corresponding to each paragraph object, and generating the page rendering code block corresponding to each paragraph object sequentially.
[0045] First, the server creates a paragraph index counter, initially set to 0. In each processing loop, the server reads the paragraph object at the index corresponding to the counter value from the paragraph list, extracts the value of the `paragraphType` field from this object, and obtains the paragraph type identifier for the current paragraph. After processing, the counter is incremented by 1, and processing continues to the next paragraph, until the counter value equals the total number of paragraphs. The server uses different processing branches based on the paragraph type identifier value: Specifically, when the paragraph type identifier corresponding to the paragraph object is a static paragraph type, the component paragraph type identifier is determined based on the target field information in the paragraph content; the rendering function and configuration parameters corresponding to the component paragraph type identifier are called; and the page rendering code block corresponding to the paragraph object is generated based on the rendering function and configuration parameters.
[0046] That is, when the value of paragraphType is "static", the static paragraph processing flow is executed.
[0047] First, based on the target field information in the paragraph content, the component paragraph type identifier is determined. The server reads the value of the `componentType` field from the paragraph object. This value indicates the component type to be used in the current paragraph; for example, "fixedTitle" indicates a fixed title component, "paragraph" indicates a text paragraph component, and "chart" indicates a chart component. Then, the rendering function and configuration parameters corresponding to the component paragraph type identifier are retrieved. The server maintains a component registry that stores the mapping relationship between component types and rendering functions. The server looks up the corresponding rendering function in the registry based on the `componentType` value, and extracts the `attrs` and `contentNodes` fields from the paragraph object as configuration parameters. Finally, based on the rendering function and configuration parameters, the page rendering code block corresponding to the paragraph object is generated. The server calls the rendering function, passing in the configuration parameters, and the rendering function returns an HTML / CSS / JavaScript code snippet. This code snippet is encapsulated in a standardized format, with the paragraph object added as the `id` attribute of the wrapping element, forming the final page rendering code block.
[0048] When the paragraph type identifier corresponding to the paragraph object is a dynamic paragraph type, the AI model type, prompt word template, and context extraction rules are determined based on the configuration information of the paragraph content. Relevant context information is extracted from the generated paragraph content according to the context extraction rules. The extracted context information is then filled into the prompt word template, and AI call instruction information is generated. Based on the AI model type and AI call instruction information, the AI agent interface is called, and the prompt words generated by the prompt word template are sent to the AI model to generate the target content through the AI model. Based on the target content generated by the AI model, a page rendering code block corresponding to the paragraph object is generated.
[0049] When the value of paragraphType is "dynamic", the dynamic paragraph processing flow is executed.
[0050] First, based on the paragraph content configuration information, the AI model type, prompt word template, and context extraction rules are determined. The server extracts the following sub-fields from the `aiConfig` field of the paragraph object: the `model` field indicates the AI model type, the `promptTemplate` field contains the prompt word template string, and the `contextExtraction` field contains a description of the context extraction rules. Then, according to the context extraction rules, relevant context information is extracted from the generated paragraph content. The server iterates through all generated paragraphs with indices less than the current paragraph index, extracts relevant content according to the rules defined in the `contextExtraction` field (e.g., keyword matching, semantic similarity calculation), and organizes the extraction results into a context object. The extracted context information is then filled into the prompt word template, and AI call instruction information is generated. The server replaces the initial prompt in the prompt word template with the generated prompt word, generating a complete prompt word string. Simultaneously, AI call-related parameters (such as temperature parameters, maximum token count, etc.) are encapsulated into AI call instruction information, and based on this information, the AI agent interface is called, sending the prompt word string to the AI model to generate the target content. Finally, based on the target content generated by the AI model, a page rendering code block corresponding to the paragraph object is generated. The server receives the target content returned by the AI model, uses it as the main content of the paragraph, and combines it with the style configuration in the paragraph object to encapsulate it into an HTML-formatted page rendering code block. This code block also adds a paragraph object symbol as the id attribute of the wrapping element.
[0051] S140. Output the page rendering code blocks corresponding to each paragraph object generated in sequence through the streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block.
[0052] The target paragraph object is one of the paragraph objects included in the paragraph list.
[0053] Because a streaming channel is pre-established between the server and the client, the streaming channel is implemented using a server-sending event protocol.
[0054] After each paragraph object's corresponding page rendering code block is generated, the server immediately sends the code block to the client via a streaming channel, without waiting for subsequent paragraphs to be generated. Each page rendering code block is transmitted along with its corresponding paragraph object so that the client can identify and locate it. The client receives streaming data through the EventSource API. Whenever a page rendering code block is received, the client finds the corresponding placeholder element on the page based on the paragraph object, inserts the rendering code into that element, executes the script, and applies styles, thus achieving the immediate display of the paragraph. Because each paragraph is rendered independently, the user can see the generated paragraph content before the overall page has fully loaded.
[0055] Specifically, in each processing loop of step 130, the server immediately triggers the output operation after generating each page rendering code block.
[0056] Specifically: The server encapsulates the page rendering code block into a data frame format for the server-sent event protocol. Each data frame contains the following components: The "event" line identifies the event type, which is always "paragraph". The id line contains a unique identifier for this data frame, generated by a combination of the paragraph identifier and the timestamp. The data row contains a JSON-formatted data payload, which includes at least the paragraphId field (paragraph identifier), the sequenceNumber field (paragraph number), the totalParagraphs field (total number of paragraphs), and the renderCode field (render code string).
[0057] After the data frame is encapsulated, the server writes the frame to the response stream through the established HTTP connection. Since the HTTP connection remains open after sending the response header, the data frame is immediately transmitted to the client.
[0058] The webpage construction method based on dialogue flow provided in this disclosure first responds to a webpage construction request sent by a client, determines a target document template based on the request, then determines a list of paragraphs included in the target document template, and parses the paragraph content corresponding to each paragraph object in turn according to the order of the paragraph objects included in the paragraph list, and sequentially generates page rendering code blocks corresponding to each paragraph object. Finally, the sequentially generated page rendering code blocks corresponding to each paragraph object are output through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block. Since a streaming transmission channel is pre-established between the server and the client, after each paragraph's page rendering code block is generated, the server immediately sends the code block to the client through the streaming transmission channel, without waiting for subsequent paragraphs to be generated, to execute the script and complete the style application, thereby achieving the instant display of the paragraph. Since each paragraph is rendered independently, the user can see the generated paragraph content before the overall page is fully loaded.
[0059] Based on the above embodiments, this disclosure also provides another method for constructing web pages based on dialogue flow, applied to a client. Figure 2 This is a schematic diagram of a webpage construction method based on a dialogue flow provided in an embodiment of this disclosure, as shown below. Figure 2 As shown, the dialogue flow-based webpage construction method includes: S210, Receive the target page rendering code block corresponding to the target paragraph object sent in real time by the server.
[0060] S220. Based on the target page rendering code block, render the target paragraph content corresponding to the target paragraph object in real time.
[0061] In a specific implementation, the target paragraph content corresponding to the target paragraph object is rendered in real time according to the target page rendering code block, including: determining the target paragraph container element according to the value of the target field in the target page rendering code block; adding the generated target page rendering code block to the target paragraph container element; and executing the target page rendering code block to render the target paragraph content corresponding to the target paragraph object in real time.
[0062] Specifically, the client listens for data frames pushed by the server through the EventSource API. Whenever the client receives a data frame (i.e., the target page rendering code block corresponding to a target paragraph object), it performs the following operations: First, parse the data lines of the target page's rendering code block and convert the JSON string into a JavaScript object; Second, based on the value of the paragraphId field, find or create the corresponding paragraph container element in the DOM tree; Third, insert the HTML code from the renderCode field into the paragraph container element; Fourth, execute the script code contained in renderCode to load the required styles and dependent resources; Fifth, trigger the paragraph rendering completion event and adjust the page scroll position as needed.
[0063] After the server processes the last paragraph in the paragraph list and sends the corresponding data frame, it sends a special data frame with the event type "complete", indicating that all paragraphs have been sent. Upon receiving the complete event, the client closes the EventSource connection, releases related resources, and triggers the page completion callback function.
[0064] Based on the above embodiments, this disclosure also provides a web page building apparatus based on dialogue flow, applied to a server. Figure 3 This is a schematic diagram of the structure of a web page building apparatus based on a dialogue flow provided in an embodiment of this disclosure, as shown below. Figure 3 As shown, the dialogue-flow-based web page building apparatus includes: The target document template determination module 310 is used to determine the target document template in response to receiving a webpage construction request sent by the client, wherein the webpage construction request includes a streaming channel establishment indication identifier, authentication token information and template identifier; Paragraph list determination module 320 is used to determine the paragraph list included in the target document template based on the target document template; The rendering code generation module 330 is used to parse the paragraph content corresponding to each paragraph object according to the sorting of the paragraph objects included in the paragraph list, and generate the page rendering code block corresponding to each paragraph object in sequence. The output module 340 is used to output the page rendering code blocks corresponding to each paragraph object generated in sequence through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block, wherein the target paragraph object is one of the paragraph objects included in the paragraph list.
[0065] The webpage building apparatus based on dialogue flow provided in this disclosure first responds to a webpage building request sent by a client, determines a target document template based on the request, then determines a list of paragraphs included in the target document template, and parses the paragraph content corresponding to each paragraph object in turn according to the order of the paragraph objects included in the paragraph list, and sequentially generates page rendering code blocks corresponding to each paragraph object. Finally, the sequentially generated page rendering code blocks corresponding to each paragraph object are output through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block. Since a streaming transmission channel is pre-established between the server and the client, after each paragraph's page rendering code block is generated, the server immediately sends the code block to the client through the streaming transmission channel without waiting for subsequent paragraphs to be generated, executes the script, and completes the style application, thereby achieving the instant display of the paragraph. Since each paragraph is rendered independently, the user can see the generated paragraph content before the overall page is fully loaded.
[0066] In some embodiments of this disclosure, the step of responding to receiving a webpage construction request from a client and determining the target document template based on the webpage construction request includes: In response to receiving a webpage construction request from a client, obtain the authentication token information included in the webpage construction request; After the authentication token information satisfies the preset token information, the target document template is determined based on the template identifier included in the webpage construction request.
[0067] In some embodiments of this disclosure, determining the list of paragraphs included in the target document template based on the target document template includes: Obtain the template configuration information of the target document template; Based on the template configuration information of the target document template, determine the list of paragraphs included in the target document template.
[0068] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the order of the paragraph objects included in the paragraph list, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: According to the sorting of the paragraph objects included in the paragraph list, obtain the paragraph type identifier corresponding to each paragraph object; Based on the paragraph type identifier corresponding to each paragraph object, the paragraph content corresponding to each paragraph object is parsed one by one, and the page rendering code block corresponding to each paragraph object is generated in sequence.
[0069] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the paragraph type identifier corresponding to each paragraph object, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: When the paragraph type identifier corresponding to the paragraph object is a static paragraph type, the component paragraph type identifier is determined based on the target field information in the paragraph content; Retrieve the rendering function and configuration parameters corresponding to the component paragraph type identifier; Based on the rendering function and the configuration parameters, a page rendering code block corresponding to the paragraph object is generated.
[0070] In some embodiments of this disclosure, the step of parsing the paragraph content corresponding to each paragraph object one by one according to the paragraph type identifier corresponding to each paragraph object, and generating the page rendering code block corresponding to each paragraph object in sequence, includes: When the paragraph type identifier corresponding to the paragraph object is a dynamic paragraph type, the AI model type, prompt word template, and context extraction rules are determined based on the configuration information of the paragraph content. Based on the aforementioned context extraction rules, relevant context information is extracted from the generated paragraph content; The extracted context information is filled into the prompt word template, and AI call instruction information is generated; Based on the AI model type and the AI invocation instruction information, the AI agent interface is invoked, and prompt words generated by the prompt word template are sent to the AI model to generate target content through the AI model; Based on the target content generated by the AI model, a page rendering code block corresponding to the paragraph object is generated.
[0071] Based on the above embodiments, this disclosure also provides another dialogue flow-based web page building apparatus, applied to a client. Figure 4 This is a schematic diagram of the structure of a web page building apparatus based on a dialogue flow provided in an embodiment of this disclosure, as shown below. Figure 4 As shown, the dialogue-flow-based web page building apparatus includes: The receiving module 410 is used to receive the target page rendering code block corresponding to the target paragraph object sent in real time by the server; The rendering module 420 is used to render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block.
[0072] In some embodiments of this disclosure, the step of rendering the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block includes: The target paragraph container element is determined based on the value of the target field in the target page rendering code block; Add the generated target page rendering code block to the target paragraph container element; The target page rendering code block is executed to render the content of the target paragraph corresponding to the target paragraph object in real time.
[0073] This application also provides a computer device, please refer to 5 for details. Figure 5 This is a basic structural block diagram of the computer device in this embodiment.
[0074] The computer device includes a memory 510 and a processor 520 that are interconnected via a system bus. It should be noted that only a computer device with components 510-520 is shown in the figure; however, it should be understood that it is not required to implement all the shown components, and more or fewer components may be implemented alternatively. Those skilled in the art will understand that the computer device described herein is a device capable of automatically performing numerical calculations and / or information processing according to pre-set or stored instructions, and its hardware includes, but is not limited to, microprocessors, application-specific integrated circuits (ASICs), field-programmable gate arrays (FPGAs), digital signal processors (DSPs), embedded devices, etc.
[0075] Computer devices can include desktop computers, laptops, handheld computers, and cloud servers. These devices allow for human-computer interaction with users through keyboards, mice, remote controls, touchpads, or voice-activated devices.
[0076] The memory 510 includes at least one type of readable storage medium, including non-volatile memory or volatile memory, such as flash memory, hard disk, multimedia card, card-type memory (e.g., SD or DX memory), random access memory (RAM), read-only memory (ROM), erasable programmable read-only memory (EPROM), electrically erasable programmable read-only memory (EEPROM), programmable read-only memory (PROM), magnetic memory, magnetic disk, optical disk, etc. RAM may include static RAM or dynamic RAM. In some embodiments, the memory 510 may be an internal storage unit of a computer device, such as the hard disk or memory of the computer device. In other embodiments, the memory 510 may also be an external storage device of the computer device, such as a plug-in hard disk, smart media card (SMC), secure digital (SD) card, or flash card equipped on the computer device. Of course, the memory 510 may include both internal storage units and external storage devices of the computer device. In this embodiment, the memory 510 is typically used to store the operating system and various application software installed on the computer device, such as the program code of the method described above. In addition, the memory 510 may also be used to temporarily store various types of data that have been output or will be output.
[0077] The processor 520 is typically used to perform the overall operation of a computer device. In this embodiment, the memory 510 is used to store program code or instructions, including computer operation instructions. The processor 520 is used to execute the program code or instructions stored in the memory 510 or to process data, such as program code that runs the methods described above.
[0078] In this article, the bus can be an Industry Standard Architecture (ISA) bus, a Peripheral Component Interconnect (PCI) bus, or an Extended Industry Standard Architecture (EISA) bus, etc. This bus system can be divided into address bus, data bus, control bus, etc. For ease of illustration, only one thick line is used to represent it in the diagram, but this does not mean that there is only one bus or one type of bus.
[0079] Another embodiment of this application also provides a computer-readable medium, which may be a computer-readable signal medium or a computer-readable medium. A processor in a computer reads computer-readable program code stored in the computer-readable medium, enabling the processor to perform the functional actions specified in each step or combination of steps in the above method; and to generate means for implementing the functional actions specified in each block or combination of blocks in the block diagram.
[0080] Computer-readable media include, but are not limited to, electronic, magnetic, optical, electromagnetic, infrared memory or semiconductor systems, devices or apparatuses, or any suitable combination thereof, wherein the memory is used to store program code or instructions, the program code including computer operation instructions, and the processor is used to execute the program code or instructions of the above-described methods stored in the memory.
[0081] The definitions of memory and processor can be found in the description of the foregoing computer device embodiments, and will not be repeated here.
[0082] In the several embodiments provided in this application, it should be understood that the disclosed systems, apparatuses, and methods can be implemented in other ways. For example, the apparatus embodiments described above are merely illustrative; for instance, the division of modules or units is only a logical functional division, and in actual implementation, there may be other division methods. For example, multiple units or components may be combined or integrated into another system, or some features may be ignored or not executed. Furthermore, the coupling or direct coupling or communication connection shown or discussed may be through some interfaces; the indirect coupling or communication connection between apparatuses or units may be electrical, mechanical, or other forms.
[0083] In the various embodiments of this application, the functional units or modules can be integrated into one processing unit, or each unit can exist physically separately, or two or more units can be integrated into one unit. The integrated unit can be implemented in hardware or as a software functional unit.
[0084] If the integrated unit is implemented as a software functional unit and sold or used as an independent product, it can be stored in a computer-readable storage medium. Based on this understanding, the technical solution of this application, in essence, or the part that contributes to the prior art, or all or part of the technical solution, can be embodied in the form of a software product. This computer software product is stored in a storage medium and includes several instructions to cause a computer device (which may be a personal computer, server, or network device, etc.) or processor to execute all or part of the steps of the methods of the various embodiments of this application. The aforementioned storage medium includes various media capable of storing program code, such as USB flash drives, portable hard drives, read-only memory (ROM), random access memory (RAM), magnetic disks, or optical disks.
[0085] Unless otherwise expressly indicated by the context, the singular form of words used herein and in the appended claims includes the plural form, and vice versa. Thus, when referring to the singular, the plural form of the corresponding term is generally included. Similarly, the terms “comprising” and “including” shall be interpreted as including rather than exclusively. Likewise, the terms “including” and “or” shall be interpreted as including unless such interpretation is expressly prohibited herein. Where the term “example” is used herein, particularly when it follows a set of terms, the “example” is merely exemplary and illustrative and should not be considered exclusive or extensive.
[0086] Further aspects and scope of adaptation become apparent from the description provided herein. It should be understood that various aspects of this application may be implemented individually or in combination with one or more other aspects. It should also be understood that the descriptions and specific embodiments herein are for illustrative purposes only and are not intended to limit the scope of this application.
[0087] Several embodiments of this disclosure have been described in detail above. However, it is obvious that those skilled in the art can make various modifications and variations to the embodiments of this disclosure without departing from the spirit and scope of this disclosure. The scope of protection of this disclosure is defined by the appended claims.
Claims
1. A webpage construction method based on dialogue flow, applied to the server side, characterized in that, include: In response to receiving a webpage construction request from a client, a target document template is determined based on the webpage construction request, wherein the webpage construction request includes a streaming channel establishment indication identifier, authentication token information, and a template identifier; Based on the target document template, determine the list of paragraphs included in the target document template; According to the order of the paragraph objects included in the paragraph list, the paragraph content corresponding to each paragraph object is parsed one by one, and the page rendering code block corresponding to each paragraph object is generated in sequence. The page rendering code blocks corresponding to each paragraph object generated in sequence are output through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block, wherein the target paragraph object is one of the paragraph objects included in the paragraph list.
2. The method according to claim 1, characterized in that, The step of responding to receiving a webpage construction request from a client and determining a target document template based on the webpage construction request includes: In response to receiving a webpage construction request from a client, obtain the authentication token information included in the webpage construction request; After the authentication token information satisfies the preset token information, the target document template is determined based on the template identifier included in the webpage construction request.
3. The method according to claim 1, characterized in that, The step of determining the list of paragraphs included in the target document template based on the target document template includes: Obtain the template configuration information of the target document template; Based on the template configuration information of the target document template, determine the list of paragraphs included in the target document template.
4. The method according to claim 1, characterized in that, The step involves parsing the paragraph content corresponding to each paragraph object according to the order of the paragraph objects included in the paragraph list, and generating the page rendering code block corresponding to each paragraph object in sequence, including: According to the sorting of the paragraph objects included in the paragraph list, obtain the paragraph type identifier corresponding to each paragraph object; Based on the paragraph type identifier corresponding to each paragraph object, the paragraph content corresponding to each paragraph object is parsed one by one, and the page rendering code block corresponding to each paragraph object is generated in sequence.
5. The method according to claim 4, characterized in that, The process involves parsing the paragraph content corresponding to each paragraph object based on its corresponding paragraph type identifier, and sequentially generating the page rendering code block for each paragraph object, including: When the paragraph type identifier corresponding to the paragraph object is a static paragraph type, the component paragraph type identifier is determined based on the target field information in the paragraph content; Retrieve the rendering function and configuration parameters corresponding to the component paragraph type identifier; Based on the rendering function and the configuration parameters, a page rendering code block corresponding to the paragraph object is generated.
6. The method according to claim 5, characterized in that, The process involves parsing the paragraph content corresponding to each paragraph object based on its corresponding paragraph type identifier, and sequentially generating the page rendering code block for each paragraph object, including: When the paragraph type identifier corresponding to the paragraph object is a dynamic paragraph type, the AI model type, prompt word template, and context extraction rules are determined based on the configuration information of the paragraph content. Based on the aforementioned context extraction rules, relevant context information is extracted from the generated paragraph content; The extracted context information is filled into the prompt word template, and AI call instruction information is generated; Based on the AI model type and the AI invocation instruction information, the AI agent interface is invoked, and prompt words generated by the prompt word template are sent to the AI model to generate target content through the AI model; Based on the target content generated by the AI model, a page rendering code block corresponding to the paragraph object is generated.
7. A webpage construction method based on dialogue flow, applied to a client, characterized in that, include: Receive the target page rendering code block corresponding to the target paragraph object sent in real time by the server; Based on the target page rendering code block, the target paragraph content corresponding to the target paragraph object is rendered in real time.
8. The method according to claim 7, characterized in that, The step of rendering the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block includes: The target paragraph container element is determined based on the value of the target field in the target page rendering code block; Add the generated target page rendering code block to the target paragraph container element; The target page rendering code block is executed to render the content of the target paragraph corresponding to the target paragraph object in real time.
9. A webpage building device based on dialogue flow, applied on a server side, characterized in that, include: The target document template determination module is used to determine the target document template in response to receiving a webpage construction request sent by the client, wherein the webpage construction request includes a streaming channel establishment indication identifier, authentication token information, and template identifier; The paragraph list determination module is used to determine the paragraph list included in the target document template based on the target document template; The rendering code generation module is used to parse the paragraph content corresponding to each paragraph object according to the order of the paragraph objects included in the paragraph list, and generate the page rendering code block corresponding to each paragraph object in sequence. The output module is used to output the page rendering code blocks corresponding to each paragraph object generated in sequence through a streaming transmission channel, so that after the client receives the target page rendering code block corresponding to the target paragraph object, it can render the target paragraph content corresponding to the target paragraph object in real time according to the target page rendering code block, wherein the target paragraph object is one of the paragraph objects included in the paragraph list.
10. A computer device, characterized in that, include: One or more processors; Storage device for storing one or more programs. When the one or more programs are executed by the one or more processors, the one or more processors implement the method as described in any one of claims 1 to 6 or claims 7 to 8.
