CN111679826A - Method, device and equipment for previewing webpage editing content in real time and storage medium - Google Patents

Method, device and equipment for previewing webpage editing content in real time and storage medium Download PDF

Info

Publication number
CN111679826A
CN111679826A CN202010343824.4A CN202010343824A CN111679826A CN 111679826 A CN111679826 A CN 111679826A CN 202010343824 A CN202010343824 A CN 202010343824A CN 111679826 A CN111679826 A CN 111679826A
Authority
CN
China
Prior art keywords
data
preset
model
page
uniform resource
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN202010343824.4A
Other languages
Chinese (zh)
Other versions
CN111679826B (en
Inventor
张喜锋
高翊竣
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Shenzhen Saiante Technology Service Co Ltd
Original Assignee
Ping An International Smart City Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Ping An International Smart City Technology Co Ltd filed Critical Ping An International Smart City Technology Co Ltd
Priority to CN202010343824.4A priority Critical patent/CN111679826B/en
Publication of CN111679826A publication Critical patent/CN111679826A/en
Application granted granted Critical
Publication of CN111679826B publication Critical patent/CN111679826B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/38Creation or generation of source code for implementing user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/30Creation or generation of source code
    • G06F8/34Graphical or visual programming

Abstract

The invention relates to the field of big data, can be applied to intelligent education such as an online education system and promotes the development of a smart city. The method for previewing the webpage editing content in real time comprises the following steps: acquiring edit data, and sending the edit data to a preset data model through a preset program interface function and a message sending window; acquiring and verifying whether a uniform resource identifier of the edited data is legal or not through an event monitor in the data model; when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to update the edited data to a database in a data model and triggering an update instruction; receiving an updating instruction through a preset view model, and starting a preset page model according to the updating instruction; and rendering the editing data in the data model to a preset preview page through the preset page model.

Description

Method, device and equipment for previewing webpage editing content in real time and storage medium
Technical Field
The invention relates to the field of data visualization, in particular to a method, a device, equipment and a storage medium for previewing webpage editing content in real time.
Background
At present, there are many implementation manners for page editing and previewing, and the conventional manner is mainly implemented by a manner of setting up a background hypertext transfer protocol (HTTP) service, and the principle is that a background server is continuously called in a manner of interface polling in an editing page operation, data modified by a user is stored in the server, page data is continuously inquired for the server in a previewing page in a polling manner to request data, and the requested data is rendered on a page by operating a Document Object Model (DOM) node. In this way, the preview can be performed only by refreshing the edited page, and the effect of previewing the edited content of the webpage immediately after editing cannot be realized.
Disclosure of Invention
The invention mainly aims to solve the problem that the effect of previewing the webpage edited content immediately after editing cannot be realized.
The invention provides a method for previewing webpage editing content in real time in a first aspect, which comprises the following steps:
acquiring edit data, and sending the edit data to a preset data model through a preset program interface function and a message sending window;
acquiring and verifying whether a uniform resource identifier of the editing data is legal or not through an event monitor in the data model;
when the uniform resource identifier of the editing data conforms to the law, calling a preset message queue interface to update the editing data to a database in the data model and triggering an updating instruction;
receiving the updating instruction through a preset view model, and starting a preset page model according to the updating instruction;
and rendering the editing data in the data model to a preset preview page through the preset page model.
Optionally, in a first implementation manner of the first aspect of the present invention, the acquiring edit data and sending the edit data to a preset data model through a preset program interface function and a message sending window includes:
acquiring edit data, and performing serialization processing and deserialization processing on the edit data to obtain a data conversion object of the edit data;
extracting key values of the data conversion objects;
calling a preset program interface function to assign the key value to a preset parameter, and sending the editing data to a preset message sending window through the preset parameter, wherein the preset parameter is used for indicating a pointer pointing to any type of object;
and extracting target data corresponding to the key value from the editing data, and transmitting the target data to the data model through the message sending window.
Optionally, in a second implementation manner of the first aspect of the present invention, the obtaining and verifying, by an event listener in the data model, whether a uniform resource identifier of the edit data is legal includes:
acquiring a uniform resource identifier of the editing data and a character string format corresponding to the uniform resource identifier through an event monitor in the data model;
judging whether the character string format is correct or not;
if the character string format is correct, judging whether the uniform resource identifier exists in a preset uniform resource identifier table or not, wherein the uniform resource identifier table comprises legal uniform resource identifiers;
and if the uniform resource identifier exists in a preset uniform resource identifier table, judging that the uniform resource identifier of the editing data conforms to the law.
Optionally, in a third implementation manner of the first aspect of the present invention, when the uniform resource identifier of the edit data conforms to a method, invoking a preset message queue interface to update the edit data to a database in the data model, and triggering an update instruction includes:
when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to create a scheduling queue, and adding a preset storage task to the scheduling queue through a preset scheduling function to obtain a target scheduling queue;
updating the editing data to a main distributed database in the data model through the target scheduling queue to obtain updated data;
and storing the updating data to a copy distributed database in the master distributed database, and triggering an updating instruction.
Optionally, in a fourth implementation manner of the first aspect of the present invention, the receiving the update instruction through a preset view model, and starting a preset page model according to the update instruction includes:
receiving the updating instruction through a preset view model, and sending a request instruction to the data model according to the updating instruction, wherein the request instruction is used for indicating the data type of a setting request, a uniform resource locator and an instruction of an asynchronous processing request;
acquiring edit data corresponding to the request instruction from the data model to obtain target edit data;
and sending the target editing data to a preset page model through a preset callback function so as to start the preset page model.
Optionally, in a fifth implementation manner of the first aspect of the present invention, the rendering, by the preset page model, the edit data in the data model to a preset preview page includes:
creating a condition rendering instruction through the preset page model, and adding the condition rendering instruction to preset template elements to obtain condition template elements;
rendering the editing data in the data model through the condition template elements to obtain rendering data, and uploading the rendering data to a block chain;
and calling a preset virtual scrolling component to render the rendering data to a preset preview page.
Optionally, in a sixth implementation manner of the first aspect of the present invention, after rendering, by the preset page model, edit data in the data model onto a preset preview page, the method further includes:
and acquiring error information, and training the data model, the preset view model and the preset page model through a preset residual error network ResNet algorithm and the error information to update the data model, the preset view model and the preset page model, wherein the error information is used for indicating that the preset preview page is inconsistent with edit data displayed on the preset edit page.
The second aspect of the present invention provides an apparatus for previewing edited content of a web page in real time, comprising:
the sending module is used for acquiring the edit data and sending the edit data to a preset data model through a preset program interface function and a message sending window;
the verification module is used for acquiring and verifying whether the uniform resource identifier of the editing data is legal or not through the event monitor in the data model;
the updating module is used for calling a preset message queue interface to update the editing data to a database in the data model and triggering an updating instruction when the uniform resource identifiers of the editing data meet the law;
the starting module is used for receiving the updating instruction through a preset view model and starting a preset page model according to the updating instruction;
and the rendering module is used for rendering the editing data in the data model to a preset preview page through the preset page model.
Optionally, in a first implementation manner of the second aspect of the present invention, the sending module is specifically configured to:
acquiring edit data, and performing serialization processing and deserialization processing on the edit data to obtain a data conversion object of the edit data;
extracting key values of the data conversion objects;
calling a preset program interface function to assign the key value to a preset parameter, and sending the editing data to a preset message sending window through the preset parameter, wherein the preset parameter is used for indicating a pointer pointing to any type of object;
and extracting target data corresponding to the key value from the editing data, and transmitting the target data to the data model through the message sending window.
Optionally, in a second implementation manner of the second aspect of the present invention, the verification module is specifically configured to:
acquiring a uniform resource identifier of the editing data and a character string format corresponding to the uniform resource identifier through an event monitor in the data model;
judging whether the character string format is correct or not;
if the character string format is correct, judging whether the uniform resource identifier exists in a preset uniform resource identifier table or not, wherein the uniform resource identifier table comprises legal uniform resource identifiers;
and if the uniform resource identifier exists in a preset uniform resource identifier table, judging that the uniform resource identifier of the editing data conforms to the law.
Optionally, in a third implementation manner of the second aspect of the present invention, the update module is specifically configured to:
when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to create a scheduling queue, and adding a preset storage task to the scheduling queue through a preset scheduling function to obtain a target scheduling queue;
updating the editing data to a main distributed database in the data model through the target scheduling queue to obtain updated data;
and storing the updating data to a copy distributed database in the master distributed database, and triggering an updating instruction.
Optionally, in a fourth implementation manner of the second aspect of the present invention, the starting module is specifically configured to:
receiving the updating instruction through a preset view model, and sending a request instruction to the data model according to the updating instruction, wherein the request instruction is used for indicating the data type of a setting request, a uniform resource locator and an instruction of an asynchronous processing request;
acquiring edit data corresponding to the request instruction from the data model to obtain target edit data;
and sending the target editing data to a preset page model through a preset callback function so as to start the preset page model.
Optionally, in a fifth implementation manner of the second aspect of the present invention, the rendering module is specifically configured to:
creating a condition rendering instruction through the preset page model, and adding the condition rendering instruction to preset template elements to obtain condition template elements;
rendering the editing data in the data model through the condition template elements to obtain rendering data, and uploading the rendering data to a block chain;
and calling a preset virtual scrolling component to render the rendering data to a preset preview page.
Optionally, in a sixth implementation manner of the second aspect of the present invention, the apparatus for previewing the edited content of the web page in real time includes:
and the training module is used for acquiring error information, training the data model, the preset view model and the preset page model through a preset residual error network ResNet algorithm and the error information so as to update the data model, the preset view model and the preset page model, wherein the error information is used for indicating that the preset preview page is inconsistent with the edit data displayed on the preset edit page.
The third aspect of the present invention provides an apparatus for previewing edited content of a web page in real time, comprising: a memory having instructions stored therein and at least one processor, the memory and the at least one processor interconnected by a line; the at least one processor invokes the instructions in the memory to cause the device for previewing the editorial content on a live basis to perform the method for previewing the editorial content on a live basis as described above.
A fourth aspect of the present invention provides a computer-readable storage medium having stored therein instructions, which, when run on a computer, cause the computer to execute the above-mentioned method of previewing edited content of a web page in real time.
In the technical scheme provided by the invention, the editing data is acquired and sent to a preset data model through a preset program interface function and a message sending window; acquiring and verifying whether a uniform resource identifier of the edited data is legal or not through an event monitor in the data model; when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to update the edited data to a database in a data model and triggering an update instruction; receiving an updating instruction through a preset view model, and starting a preset page model according to the updating instruction; and rendering the editing data in the data model to a preset preview page through the preset page model. In the invention, the data transmission, data updating and real-time synchronization between the editing page and the preview page are carried out by adopting the preset program interface function, the message sending window, the preset message queue interface and the preset page model, thereby realizing the effect of previewing the webpage editing content immediately after editing.
Drawings
FIG. 1 is a diagram illustrating an embodiment of a method for previewing edited content of a web page in real time according to an embodiment of the present invention;
FIG. 2 is a diagram illustrating another embodiment of a method for previewing edited content of a web page in real time according to an embodiment of the present invention;
FIG. 3 is a diagram of an embodiment of an apparatus for previewing edited content of a web page in real time according to an embodiment of the present invention;
FIG. 4 is a schematic diagram of another embodiment of an apparatus for previewing edited content of a web page in real time according to an embodiment of the present invention;
fig. 5 is a schematic diagram of an embodiment of an apparatus for previewing edited content of a web page in real time according to an embodiment of the present invention.
Detailed Description
The embodiment of the invention provides a method, a device, equipment and a storage medium for previewing webpage edited content in real time, which realize the effect of previewing the webpage edited content immediately after editing by adopting a preset program interface function, a message sending window, a preset message queue interface and a preset page model to carry out data transmission, data updating and real-time synchronization between an edited page and a previewed page.
The terms "first," "second," "third," "fourth," and the like in the description and in the claims, as well as in the drawings, if any, are used for distinguishing between similar elements and not necessarily for describing a particular sequential or chronological order. It will be appreciated that the data so used may be interchanged under appropriate circumstances such that the embodiments described herein may be practiced otherwise than as specifically illustrated or described herein. Furthermore, the terms "comprises," "comprising," or "having," and any variations thereof, are intended to cover non-exclusive inclusions, such that a process, method, system, article, or apparatus that comprises a list of steps or elements is not necessarily limited to those steps or elements expressly listed, but may include other steps or elements not expressly listed or inherent to such process, method, article, or apparatus.
For convenience of understanding, a detailed flow of an embodiment of the present invention is described below, and referring to fig. 1, an embodiment of a method for previewing edited content of a web page in real time in an embodiment of the present invention includes:
101. acquiring edit data, and sending the edit data to a preset data model through a preset program interface function and a message sending window;
it is to be understood that the executing entity of the present invention may be a device for previewing the edited content of the web page in real time, and may also be a terminal or a server, which is not limited herein. The embodiment of the present invention is described by taking a server as an execution subject.
The editing data comprises editing content generated by editing in a preset editing page and an address of a data sending end corresponding to the preset editing page. The method comprises the steps that a user edits an editing page, a server takes an editing end where the editing page is located as a data sending end, namely a communication initiating end, calls a preset program interface function to open a preset message sending window, the preset program interface function is an application program interface function PostMessage, editing data are sent to the preset message window, the preset message sending window can be a floating frame iframe, the editing data comprise editing contents generated by the user through editing the preset editing page and an address of the data sending end, and the preset message sending window transmits the editing data to a preset data model in a parallel communication mode through a full-duplex communication channel. The data sending end is pre-created with a message monitor to monitor the feedback information after the sent edited data, and timely learn whether the edited data is sent successfully or not and whether the data model receives the edited data successfully or not, so that the data can be timely resent when the sending fails or the receiving fails to ensure the sending and the receiving of the data.
102. Acquiring and verifying whether a uniform resource identifier of the edited data is legal or not through an event monitor in the data model;
the data model is used as a data receiving end for sending data by a data sending end, the server invokes an event listener in the data model to monitor, when the event listener monitors that a message (namely, edit data) is sent, the event listener receives the message and extracts a Uniform Resource Identifier (URI) of the message, namely, the URI of the data sending end, and whether the URI of the message is legal or not is verified so as to verify whether the message is from a credible address or not. The URI can be verified to be legal or not through a regular expression or a static mode Uri. When the uniform resource identifier of the edited data is illegal, the server feeds back verification information to the sending end, receives the manually corrected edited data sent by the sending end, calls a preset message queue interface to update the edited data to a database in a data model, and triggers an updating instruction; or when the uniform resource identifier of the editing data is illegal, the server acquires the corresponding stored correction rule, corrects the editing data according to the correction rule, updates the corrected editing data to a database in the data model, and triggers an update instruction.
103. When the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to update the edited data to a database in a data model and triggering an update instruction;
when the uniform resource identifiers of the edited data meet the law, an event listener in the data model calls a preset message queue interface dispatch to submit the edited data to an Action object, the Action object is used as a parameter to send the edited data to a database in the data model, when the edited data is updated to the database in the data model, an updating instruction is started to prompt the preset view model data model to store new data, and the preset view model needs to call a preset page model to respond and process the edited data. The multitask concurrent operation is realized through the preset message queue interface dispatch, the background server and the background interface are reduced, and resource waste, server congestion and server crash caused by continuously polling data to update pages are avoided.
104. Receiving an updating instruction through a preset view model, and starting a preset page model according to the updating instruction;
in the data drive, the data Model and the preset page Model View cannot be communicated directly, so that the communication between the data Model and the preset page Model View needs to be realized through the preset View Model View. When updating data (namely editing contents stored in an editing page) in the data model triggers an updating instruction, the preset View model ViewModel can monitor the updating and storing of the data in the data model (namely receiving the updating instruction) and timely inform the preset page model View to make corresponding and modification. Similarly, when there is an event trigger in the preset page Model View, the preset View Model can also monitor the event trigger of the preset page Model View and notify the data Model to respond. The preset view model ViewModel is equivalent to an observer, monitors the actions of the two parties and informs the other party of performing corresponding operations in time.
105. And rendering the editing data in the data model to a preset preview page through the preset page model.
When the preset page model ViewModel monitors the data model to update and store the data (namely, receives an update instruction), the preset preview page model View is started, the edited content generated by the edited page is synchronously displayed on the preset preview page on the same interface with the edited page, wherein, the vm is called by the mount component function to generate the virtual Node, and then the virtual Node is combined to instantiate an observer Watcher with rendering function, calling an update component function in a callback function of the Watcher watch, finally calling a vm update function to update a DOM node, realizing that the edited data is rendered on a preset preview page, so as to achieve the effect that the data can be modified and presented on the preset preview page without modification through the DOM node by modifying the data logic, through the PostMessage and the data driving, the edited content of the edited page can be directly displayed on the preview page in real time without refreshing the page.
In the embodiment of the invention, the data transmission, the data updating and the real-time synchronization between the editing page and the previewing page are carried out by adopting the preset program interface function, the message sending window, the preset message queue interface and the preset page model, so that the effect of previewing the edited content of the webpage immediately after editing is realized.
Referring to fig. 2, another embodiment of the method for previewing the edited content of the web page in real time according to the embodiment of the present invention includes:
201. acquiring edit data, and sending the edit data to a preset data model through a preset program interface function and a message sending window;
specifically, the server acquires edit data, and sends the edit data to a preset data model through a preset program interface function and a message sending window, and the method includes: acquiring edit data, and performing serialization processing and deserialization processing on the edit data to obtain a data conversion object of the edit data; extracting key values of data conversion objects; calling a preset program interface function to assign the key value to a preset parameter, and sending the edited data to a preset message sending window through the preset parameter, wherein the preset parameter is used for indicating a pointer pointing to any type of object; and extracting target data corresponding to the key value from the edited data, and transmitting the target data to the data model through the message sending window.
For example: a user edits on an editing page to generate editing content, a server acquires the editing content and a sending end address corresponding to the editing content to obtain editing data, the editing data is stored in a file or other storage devices in a byte sequence mode (serialization processing) to obtain sequence data, deserialization processing is carried out on the sequence data to reconstruct the byte sequence into an object, so that a data conversion object value corresponding to each editing data is generated, a key value key corresponding to each value is extracted, a Postmessage function is called to assign the key value key corresponding to each value to a corresponding wParam parameter or IPAram parameter, the editing data is transmitted to a preset message sending window in a message mode through the wParam parameter or the IPAram parameter, the message sending window receives the message, and then target data which is in accordance with the data type stored by a data model is extracted from the message through the key value, and sending the extracted target data into the data model. The key value comprises a key value with an integer data type; the preset parameter may be a handle wParam of a window or a control, or may be a pointer IParam pointing to data in the memory. The editing data is transferred to a preset data model by adopting a pointer pointing to any type of object, so that the effect of sending any type of data to the control by using the PostMessage function of the application program interface is achieved.
202. Acquiring and verifying whether a uniform resource identifier of the edited data is legal or not through an event monitor in the data model;
specifically, the server obtains and verifies whether the uniform resource identifier of the edited data is legal through an event listener in the data model, including: acquiring uniform resource identifiers of the edited data and character string formats corresponding to the uniform resource identifiers through an event listener in the data model; judging whether the character string format is correct or not; if the character string format is correct, judging whether the uniform resource identifier exists in a preset uniform resource identifier table or not, wherein the uniform resource identifier table comprises legal uniform resource identifiers; if the uniform resource identifier exists in a preset uniform resource identifier table, judging that the uniform resource identifiers of the editing data conform to the method.
When the server judges that the character string format is incorrect through an event monitor in the data model, the server feeds back edit data and judgment information corresponding to the character string format to the sending end, receives edit data sent by the sending end and obtained by manually correcting the character string format, and traverses a preset uniform resource identifier table according to a uniform resource identifier of the edit data obtained by correcting; or when the server judges that the character string format is incorrect, acquiring a corresponding stored format correction rule, correcting the edit data according to the format correction rule, and traversing a preset uniform resource identifier table according to the uniform resource identifier of the corrected edit data. If the uniform resource identifier does not exist in the stored uniform resource identifier table, the uniform resource identifier of the editing data is judged to be illegal. The uniform resource identifier is verified in the first step by judging whether the character string format corresponding to the uniform resource identifier is correct or not, and then the uniform resource identifier with the correct character string format is matched and analyzed with a stored uniform resource identifier table, so that the uniform resource identifier conformity and safety are effectively judged. The stored uniform resource identifier table may be a valid historically used uniform resource identifier obtained from an operation log or other information of the server, and the credibility of the uniform resource identifier is accurately analyzed by judging that the uniform resource identifier is a credible historically used uniform resource identifier.
203. When the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to update the edited data to a database in a data model and triggering an update instruction;
specifically, when the uniform resource identifier of the server edit data conforms to the law, a preset message queue interface is called to update the edit data to a database in the data model, and an update instruction is triggered, including: when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to create a scheduling queue, and adding a preset storage task to the scheduling queue through a preset scheduling function to obtain a target scheduling queue; updating the editing data to a main distributed database in the data model through a target scheduling queue to obtain updated data; and storing the updating data to a copy distributed database in the main distributed database, and triggering an updating instruction.
When the uniform resource identifiers of the edited data conform to the method, an event monitor in the data model calls a preset message Queue interface Dispatch to create a Dispatch Queue, the edited data is conveniently, efficiently and multitaskally stored in the data model through the Dispatch Queue, the stored tasks are asynchronously added to the Dispatch Queue through a Dispatch function Dispatch _ async or a Dispatch function Dispatch _ async _ f to obtain a target Dispatch Queue, and the edited data is updated to a main distributed database in a distributed high-performance real-time database system Sophic DB in the data model through the target Dispatch Queue to obtain updated data; and updating the updating data to the copy distributed database in the SophiDB so as to realize the data consistency of the main distributed database and the copy distributed database. The data is edited and stored by adopting a distributed high-performance real-time database system SophiDB, so that the real-time property, the transaction real-time property and the high availability of the data are realized, and the resource waste, the server jam and the server crash caused by continuously polling data to update pages are avoided.
204. Receiving an updating instruction through a preset view model, and starting a preset page model according to the updating instruction;
specifically, the server receives an update instruction through a preset view model, and starts a preset page model according to the update instruction, including: receiving an updating instruction through a preset view model, and sending a request instruction to a data model according to the updating instruction, wherein the request instruction is used for indicating the data type of a set request, a uniform resource locator and an instruction of an asynchronous processing request; acquiring edit data corresponding to the request instruction from the data model to obtain target edit data; and sending the target editing data to a preset page model through a preset callback function so as to start the preset page model.
The request instruction can be in a GET () mode or a POST () mode, and the preset callback function can be an onreadystatechange function. The method comprises the steps of obtaining edit data which accord with the data type and the data format stored and displayed by a preset page model from the data model through a GET () mode or a POST () mode, sending the obtained edit data to the preset model through an online detatech function, and realizing page non-refreshing update of data through an ajax asynchronous loading technical means, thereby effectively realizing that the edit content of an edit page can be directly displayed on a preview page in real time without refreshing the page.
205. Rendering the editing data in the data model to a preset preview page through a preset page model;
specifically, the rendering, by the server, of the editing data in the data model to the preset preview page through the preset page model includes: creating a condition rendering instruction through a preset page model, and adding the condition rendering instruction to preset template elements to obtain condition template elements; rendering the editing data in the data model through the condition template elements to obtain rendering data, and uploading the rendering data to a block chain; and calling a preset virtual scrolling component to render the rendering data to a preset preview page.
The corresponding digest information is obtained based on the rendering data, and specifically, the digest information is obtained by hashing the rendering data, for example, using the sha256s algorithm. Uploading summary information to the blockchain can ensure the safety and the fair transparency of the user. The user device may download the summary information from the blockchain to verify whether the rendering data is tampered. The block chain referred by the application is a novel application mode of computer technologies such as distributed data storage, point-to-point transmission, a consensus mechanism, an encryption algorithm and the like. A block chain (Blockchain), which is essentially a decentralized database, is a series of data blocks associated by using a cryptographic method, and each data block contains information of a batch of network transactions, so as to verify the validity (anti-counterfeiting) of the information and generate a next block. The blockchain may include a blockchain underlying platform, a platform product service layer, an application service layer, and the like.
The server processes the edited data in the data model by adopting a condition rendering instruction of v-if so as to solve the problems existing in an asynchronous rendering mode and accelerate the rendering speed of the asynchronous rendering mode; the performance in rendering large amounts of edit data is improved by a preset virtual scroll component vue-virtual-controller. By optimizing the rendering mode of rendering the editing data on the preset preview page, the editing content of the editing page can be directly displayed on the preview page in real time without refreshing the page, and meanwhile, the server is prevented from being crashed and the operation efficiency is improved.
206. And acquiring error information, and training the data model, the preset view model and the preset page model through a preset residual error network ResNet algorithm and the error information so as to update the data model, the preset view model and the preset page model, wherein the error information is used for indicating that the preset preview page is inconsistent with the editing data displayed on the preset editing page.
The server acquires an edited image corresponding to the edited data on a preset edited page and acquires a preview image of the edited data on a preset preview page; performing image recognition and text recognition on the edited image and the preview image to obtain first error information, wherein the first error information is used for indicating images and texts of the edited image and the preview image which are inconsistent; acquiring input second error information, and marking the first error information and the second error information through a residual error network ResNet algorithm to obtain marking information; and training the data model, the preset view model and the preset page model according to the marking information so as to update the data model, the preset view model and the preset page model. The method adopts a residual error network ResNet algorithm to re-mark and train the first error automatically identified by the server and the second error input by the user, realizes the effect of function nonlinearity by improving the network depth, and ensures the accuracy and autonomy of directly displaying the edited content of the edited page on the preview page in real time without refreshing the page.
In the embodiment of the invention, the data transmission, the data updating and the real-time synchronization between the editing page and the preview page are carried out by adopting the preset program interface function, the message sending window, the preset message queue interface and the preset page model, and on the basis of realizing the effect of previewing the edited content of the webpage immediately after editing, the accuracy and the autonomy of directly displaying the edited content of the editing page on the preview page in real time without refreshing the page are ensured by improving the network depth to realize the nonlinear effect of the function. The method and the device can be applied to intelligent education scenes such as online education APP page editing scenes, and accordingly construction of smart cities is promoted.
With reference to fig. 3, the method for previewing the edited content of the web page in real time in the embodiment of the present invention is described above, and an embodiment of the apparatus for previewing the edited content of the web page in real time in the embodiment of the present invention includes:
a sending module 301, configured to obtain edit data, and send the edit data to a preset data model through a preset program interface function and a message sending window;
a verification module 302, configured to obtain and verify whether a uniform resource identifier of the edited data is legal through an event listener in the data model;
the updating module 303 is configured to, when the uniform resource identifier of the edit data conforms to the law, invoke a preset message queue interface to update the edit data to a database in the data model, and trigger an update instruction;
the starting module 304 is configured to receive an update instruction through the preset view model, and start the preset page model according to the update instruction;
and a rendering module 305, configured to render the editing data in the data model to a preset preview page through a preset page model.
In the embodiment of the invention, the data transmission, the data updating and the real-time synchronization between the editing page and the previewing page are carried out by adopting the preset program interface function, the message sending window, the preset message queue interface and the preset page model, so that the effect of previewing the edited content of the webpage immediately after editing is realized.
Referring to fig. 4, another embodiment of the apparatus for previewing the edited content of the web page in real time according to the embodiment of the present invention includes:
a sending module 301, configured to obtain edit data, and send the edit data to a preset data model through a preset program interface function and a message sending window;
a verification module 302, configured to obtain and verify whether a uniform resource identifier of the edited data is legal through an event listener in the data model;
the updating module 303 is configured to, when the uniform resource identifier of the edit data conforms to the law, invoke a preset message queue interface to update the edit data to a database in the data model, and trigger an update instruction;
the starting module 304 is configured to receive an update instruction through the preset view model, and start the preset page model according to the update instruction;
a rendering module 305, configured to render the editing data in the data model to a preset preview page through a preset page model;
the training module 306 is configured to acquire error information, train the data model, the preset view model, and the preset page model through a preset residual error network ResNet algorithm and the error information, so as to update the data model, the preset view model, and the preset page model, where the error information is used to indicate that the preset preview page is inconsistent with the edit data displayed on the preset edit page.
Optionally, the sending module 301 may be further specifically configured to:
acquiring edit data, and performing serialization processing and deserialization processing on the edit data to obtain a data conversion object of the edit data;
extracting key values of data conversion objects;
calling a preset program interface function to assign the key value to a preset parameter, and sending the edited data to a preset message sending window through the preset parameter, wherein the preset parameter is used for indicating a pointer pointing to any type of object;
and extracting target data corresponding to the key value from the edited data, and transmitting the target data to the data model through the message sending window.
Optionally, the verification module 302 may be further specifically configured to:
acquiring uniform resource identifiers of the edited data and character string formats corresponding to the uniform resource identifiers through an event listener in the data model;
judging whether the character string format is correct or not;
if the character string format is correct, judging whether the uniform resource identifier exists in a preset uniform resource identifier table or not, wherein the uniform resource identifier table comprises legal uniform resource identifiers;
if the uniform resource identifier exists in a preset uniform resource identifier table, judging that the uniform resource identifiers of the editing data conform to the method.
Optionally, the updating module 303 may be further specifically configured to:
when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to create a scheduling queue, and adding a preset storage task to the scheduling queue through a preset scheduling function to obtain a target scheduling queue;
updating the editing data to a main distributed database in the data model through a target scheduling queue to obtain updated data;
and storing the updating data to a copy distributed database in the main distributed database, and triggering an updating instruction.
Optionally, the starting module 304 may be further specifically configured to:
receiving an updating instruction through a preset view model, and sending a request instruction to a data model according to the updating instruction, wherein the request instruction is used for indicating the data type of a set request, a uniform resource locator and an instruction of an asynchronous processing request;
acquiring edit data corresponding to the request instruction from the data model to obtain target edit data;
and sending the target editing data to a preset page model through a preset callback function so as to start the preset page model.
Optionally, the rendering module 305 may be further specifically configured to:
creating a condition rendering instruction through a preset page model, and adding the condition rendering instruction to preset template elements to obtain condition template elements;
rendering the editing data in the data model through the condition template elements to obtain rendering data, and uploading the rendering data to a block chain;
and calling a preset virtual scrolling component to render the rendering data to a preset preview page.
In the embodiment of the invention, the data transmission, the data updating and the real-time synchronization between the editing page and the preview page are carried out by adopting the preset program interface function, the message sending window, the preset message queue interface and the preset page model, and on the basis of realizing the effect of previewing the edited content of the webpage immediately after editing, the accuracy and the autonomy of directly displaying the edited content of the editing page on the preview page in real time without refreshing the page are ensured by improving the network depth to realize the nonlinear effect of the function.
Fig. 3 and 4 describe the apparatus for previewing the edited content of the web page in real time in the embodiment of the present invention in detail from the perspective of the modular functional entity, and the apparatus for previewing the edited content of the web page in real time in the embodiment of the present invention in detail from the perspective of the hardware processing.
Fig. 5 is a schematic structural diagram of an apparatus for previewing edited content in real time according to an embodiment of the present invention, where the apparatus 500 for previewing edited content in real time may have a relatively large difference due to different configurations or performances, and may include one or more processors (CPUs) 510 (e.g., one or more processors) and a memory 520, one or more storage media 530 (e.g., one or more mass storage devices) for storing applications 533 or data 532. Memory 520 and storage media 530 may be, among other things, transient or persistent storage. The program stored on the storage medium 530 may include one or more modules (not shown), each of which may include a series of instruction operations in the apparatus 500 for editing content on a live preview web page. Still further, the processor 510 may be configured to communicate with the storage medium 530 to execute a series of instruction operations in the storage medium 530 on the apparatus 500 for previewing the edited content of the web page in real time.
The apparatus 500 for previewing edited content of a web page in real time may further comprise one or more power supplies 540, one or more wired or wireless network interfaces 550, one or more input-output interfaces 560, and/or one or more operating systems 531, such as Windows server, Mac OS X, Unix, Linux, FreeBSD, etc. Those skilled in the art will appreciate that the configuration of the apparatus for previewing the web page authored content in real-time shown in FIG. 5 does not constitute a limitation on the apparatus for previewing the web page authored content in real-time, and may include more or fewer components than those shown, or some components in combination, or a different arrangement of components.
The present invention also provides a computer readable storage medium, which may be a non-volatile computer readable storage medium, and which may also be a volatile computer readable storage medium, having stored therein instructions, which, when run on a computer, cause the computer to perform the steps of the method for previewing edited content of a web page in real time.
It is clear to those skilled in the art that, for convenience and brevity of description, the specific working processes of the above-described systems, apparatuses and units may refer to the corresponding processes in the foregoing method embodiments, and are not described herein again.
The integrated unit, if implemented in the form of a software functional unit and sold or used as a stand-alone product, may be stored in a computer readable storage medium. Based on such understanding, the technical solution of the present invention may be embodied in the form of a software product, which is stored in a storage medium and includes instructions for causing a computer device (which may be a personal computer, a server, or a network device) to execute all or part of the steps of the method according to the embodiments of the present invention. And the aforementioned storage medium includes: various media capable of storing program codes, such as a usb disk, a removable hard disk, a read-only memory (ROM), a Random Access Memory (RAM), a magnetic disk, or an optical disk.
The above-mentioned embodiments are only used for illustrating the technical solutions of the present invention, and not for limiting the same; although the present invention has been described in detail with reference to the foregoing embodiments, it will be understood by those of ordinary skill in the art that: the technical solutions described in the foregoing embodiments may still be modified, or some technical features may be equivalently replaced; and such modifications or substitutions do not depart from the spirit and scope of the corresponding technical solutions of the embodiments of the present invention.

Claims (10)

1. A method for previewing webpage editing content in real time is characterized in that the method for previewing the webpage editing content in real time comprises the following steps:
acquiring edit data, and sending the edit data to a preset data model through a preset program interface function and a message sending window;
acquiring and verifying whether a uniform resource identifier of the editing data is legal or not through an event monitor in the data model;
when the uniform resource identifier of the editing data conforms to the law, calling a preset message queue interface to update the editing data to a database in the data model and triggering an updating instruction;
receiving the updating instruction through a preset view model, and starting a preset page model according to the updating instruction;
and rendering the editing data in the data model to a preset preview page through the preset page model.
2. The method for previewing edited content of web page in real time according to claim 1, wherein said obtaining edited data and sending said edited data to a preset data model through a preset program interface function and a message sending window comprises:
acquiring edit data, and performing serialization processing and deserialization processing on the edit data to obtain a data conversion object of the edit data;
extracting key values of the data conversion objects;
calling a preset program interface function to assign the key value to a preset parameter, and sending the editing data to a preset message sending window through the preset parameter, wherein the preset parameter is used for indicating a pointer pointing to any type of object;
and extracting target data corresponding to the key value from the editing data, and transmitting the target data to the data model through the message sending window.
3. The method for previewing edited content on a web page in real time according to claim 2, wherein said obtaining and verifying whether the uniform resource identifier of the edited data is legal by an event listener in said data model comprises:
acquiring a uniform resource identifier of the editing data and a character string format corresponding to the uniform resource identifier through an event monitor in the data model;
judging whether the character string format is correct or not;
if the character string format is correct, judging whether the uniform resource identifier exists in a preset uniform resource identifier table or not, wherein the uniform resource identifier table comprises legal uniform resource identifiers;
and if the uniform resource identifier exists in a preset uniform resource identifier table, judging that the uniform resource identifier of the editing data conforms to the law.
4. The method for previewing edited content of web page in real time according to claim 3, wherein when the uniform resource identifier of the edited data conforms to the law, a preset message queue interface is invoked to update the edited data to the database in the data model, and an update instruction is triggered, which comprises:
when the uniform resource identifiers of the edited data conform to the method, calling a preset message queue interface to create a scheduling queue, and adding a preset storage task to the scheduling queue through a preset scheduling function to obtain a target scheduling queue;
updating the editing data to a main distributed database in the data model through the target scheduling queue to obtain updated data;
and storing the updating data to a copy distributed database in the master distributed database, and triggering an updating instruction.
5. The method for previewing the edited content of the webpage in real time according to claim 1, wherein the receiving the update instruction through the preset view model and starting the preset page model according to the update instruction comprises:
receiving the updating instruction through a preset view model, and sending a request instruction to the data model according to the updating instruction, wherein the request instruction is used for indicating the data type of a setting request, a uniform resource locator and an instruction of an asynchronous processing request;
acquiring edit data corresponding to the request instruction from the data model to obtain target edit data;
and sending the target editing data to a preset page model through a preset callback function so as to start the preset page model.
6. The method for previewing edited content of a web page in real time according to claim 1, wherein said rendering the edited data in said data model to a preset preview page through said preset page model comprises:
creating a condition rendering instruction through the preset page model, and adding the condition rendering instruction to preset template elements to obtain condition template elements;
rendering the editing data in the data model through the condition template elements to obtain rendering data, and uploading the rendering data to a block chain;
and calling a preset virtual scrolling component to render the rendering data to a preset preview page.
7. The method for previewing edited content of a web page in real time according to any one of claims 1-6, wherein after rendering the edited data in said data model onto a preset preview page through said preset page model, further comprising:
and acquiring error information, and training the data model, the preset view model and the preset page model through a preset residual error network ResNet algorithm and the error information to update the data model, the preset view model and the preset page model, wherein the error information is used for indicating that the preset preview page is inconsistent with edit data displayed on the preset edit page.
8. An apparatus for previewing edited content of a web page in real time, the apparatus comprising:
the sending module is used for acquiring the edit data and sending the edit data to a preset data model through a preset program interface function and a message sending window;
the verification module is used for acquiring and verifying whether the uniform resource identifier of the editing data is legal or not through the event monitor in the data model;
the updating module is used for calling a preset message queue interface to update the editing data to a database in the data model and triggering an updating instruction when the uniform resource identifiers of the editing data meet the law;
the starting module is used for receiving the updating instruction through a preset view model and starting a preset page model according to the updating instruction;
and the rendering module is used for rendering the editing data in the data model to a preset preview page through the preset page model.
9. An apparatus for previewing edited content on a web page in real time, the apparatus comprising: a memory having instructions stored therein and at least one processor, the memory and the at least one processor interconnected by a line;
the at least one processor invokes the instructions in the memory to cause the device for previewing web-authored content in real-time to perform the method for previewing web-authored content in real-time according to any of claims 1-7.
10. A computer-readable storage medium, having stored thereon a computer program, wherein the computer program, when executed by a processor, implements a method for previewing edited content of a web page in real time according to any one of claims 1-7.
CN202010343824.4A 2020-04-27 2020-04-27 Method, device, equipment and storage medium for previewing webpage editing content in real time Active CN111679826B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010343824.4A CN111679826B (en) 2020-04-27 2020-04-27 Method, device, equipment and storage medium for previewing webpage editing content in real time

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010343824.4A CN111679826B (en) 2020-04-27 2020-04-27 Method, device, equipment and storage medium for previewing webpage editing content in real time

Publications (2)

Publication Number Publication Date
CN111679826A true CN111679826A (en) 2020-09-18
CN111679826B CN111679826B (en) 2024-04-05

Family

ID=72452171

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010343824.4A Active CN111679826B (en) 2020-04-27 2020-04-27 Method, device, equipment and storage medium for previewing webpage editing content in real time

Country Status (1)

Country Link
CN (1) CN111679826B (en)

Cited By (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113282863A (en) * 2021-06-11 2021-08-20 上海哔哩哔哩科技有限公司 Service page generation method and device
CN113343157A (en) * 2021-07-05 2021-09-03 湖南快乐阳光互动娱乐传媒有限公司 Content editing method and device based on domain-specific language

Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102722372A (en) * 2012-05-25 2012-10-10 上海学智科技有限公司 Method and system for automatically generating codes through classification and configuration
CN104380280A (en) * 2012-04-16 2015-02-25 权五石 System and method for dynamically converting webpage, and computer-readable recording medium
CN105068815A (en) * 2015-08-24 2015-11-18 用友网络科技股份有限公司 Page editor interaction apparatus and method
US20170115968A1 (en) * 2015-10-23 2017-04-27 Oracle International Corporation Application builder with automated data objects creation
CN108845856A (en) * 2018-06-11 2018-11-20 腾讯科技(深圳)有限公司 Data Binding Method, device, storage medium and equipment
CN109446457A (en) * 2018-09-25 2019-03-08 平安普惠企业管理有限公司 Update method, terminal device and the medium of page data
CN109814863A (en) * 2018-12-14 2019-05-28 深圳壹账通智能科技有限公司 A kind of processing method, device, computer equipment and computer storage medium for requesting returned data
CN109814844A (en) * 2019-01-16 2019-05-28 武汉科技大学 A kind of exploitation and operating system of integrated support Meta Model
CN110515683A (en) * 2019-07-15 2019-11-29 平安普惠企业管理有限公司 A kind of method, apparatus and storage medium of front end Vue page visual configuration
CN110688600A (en) * 2019-09-09 2020-01-14 平安普惠企业管理有限公司 Online editing method, device and equipment based on HTML (Hypertext markup language) page and storage medium

Patent Citations (10)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN104380280A (en) * 2012-04-16 2015-02-25 权五石 System and method for dynamically converting webpage, and computer-readable recording medium
CN102722372A (en) * 2012-05-25 2012-10-10 上海学智科技有限公司 Method and system for automatically generating codes through classification and configuration
CN105068815A (en) * 2015-08-24 2015-11-18 用友网络科技股份有限公司 Page editor interaction apparatus and method
US20170115968A1 (en) * 2015-10-23 2017-04-27 Oracle International Corporation Application builder with automated data objects creation
CN108845856A (en) * 2018-06-11 2018-11-20 腾讯科技(深圳)有限公司 Data Binding Method, device, storage medium and equipment
CN109446457A (en) * 2018-09-25 2019-03-08 平安普惠企业管理有限公司 Update method, terminal device and the medium of page data
CN109814863A (en) * 2018-12-14 2019-05-28 深圳壹账通智能科技有限公司 A kind of processing method, device, computer equipment and computer storage medium for requesting returned data
CN109814844A (en) * 2019-01-16 2019-05-28 武汉科技大学 A kind of exploitation and operating system of integrated support Meta Model
CN110515683A (en) * 2019-07-15 2019-11-29 平安普惠企业管理有限公司 A kind of method, apparatus and storage medium of front end Vue page visual configuration
CN110688600A (en) * 2019-09-09 2020-01-14 平安普惠企业管理有限公司 Online editing method, device and equipment based on HTML (Hypertext markup language) page and storage medium

Non-Patent Citations (4)

* Cited by examiner, † Cited by third party
Title
CARLO BERNASCHINA 等: "webpage edited and view model updated", 《2017 IEEE/ACM 9TH INTERNATIONAL WORKSHOP ON MODELLING IN SOFTWARE ENGINEERING (MISE)》, pages 33 - 39 *
刘锋: "基于语义网的XBRL技术模型及其应用研究", 《中国博士学位论文全文数据库 经济与管理科学辑》, no. 1, pages 163 - 3 *
我叫吴桂鑫: "自己写一个网页版的Markdown实时编辑", Retrieved from the Internet <URL:《https://blog.csdn.net/baidu_36583119/article/details/78956991/》> *
牛仁腾: "基于Vue.js的表单可视化构建系统的设计与实现", 《中国优秀硕士学位论文全文数据库 信息科技辑》, no. 5, pages 138 - 762 *

Cited By (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN113282863A (en) * 2021-06-11 2021-08-20 上海哔哩哔哩科技有限公司 Service page generation method and device
CN113282863B (en) * 2021-06-11 2023-04-21 上海哔哩哔哩科技有限公司 Service page generation method and device
CN113343157A (en) * 2021-07-05 2021-09-03 湖南快乐阳光互动娱乐传媒有限公司 Content editing method and device based on domain-specific language
CN113343157B (en) * 2021-07-05 2023-07-14 湖南快乐阳光互动娱乐传媒有限公司 Content editing method and device based on domain-specific language

Also Published As

Publication number Publication date
CN111679826B (en) 2024-04-05

Similar Documents

Publication Publication Date Title
CN106933614B (en) Single-page application upgrading method and device
US9237120B2 (en) Message broker system and method
US20050235202A1 (en) Automatic graphical layout printing system utilizing parsing and merging of data
CN107463563B (en) Information service processing method and device of browser
JP2005505051A (en) Distributed program execution method based on file type relationship in client-server network
US20100138477A1 (en) Crunching Dynamically Generated Script Files
JPH10187456A (en) Program download system
JP2019169169A (en) Correction of comment of native document in preview
CN111679826B (en) Method, device, equipment and storage medium for previewing webpage editing content in real time
CN110704381A (en) Data analysis method, device and storage medium
WO2015080903A1 (en) Systems and methods for executing aspects of a document
JP2013080404A (en) System, computer, method, and program which call java method on client
US20020016830A1 (en) Communication method between server and client of a network
CN109299331A (en) Air shows the method and device of the hypertext markup language HTML5 page
JP2004341675A (en) Development system, electronic form using system, server, program, and recording medium
JPH1115723A (en) Multimedia data supplying method and multimedia data server
US7584245B2 (en) Web service generation
CN108959899A (en) A method of picture validation code generation is realized based on React and is refreshed
CN113761419A (en) Display method and device of topological information, electronic equipment and storage medium
US10592388B1 (en) Methods for facilitating more efficient network message exchange and analysis and devices thereof
CN112306967A (en) File uploading method and device and computer readable storage medium
CN112100187A (en) Student learning data storage method and device based on VueJS
CN115658838B (en) Map set data generation method and device, electronic equipment and storage medium
CN111443987A (en) Image video script processing system and method based on web system
CN117557240B (en) Method, system, device and storage medium for reading jobs

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
TA01 Transfer of patent application right

Effective date of registration: 20210209

Address after: Room 201, building a, No.1 Qianwan 1st Road, Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong Province (settled in Shenzhen Qianhai business secretary Co., Ltd.)

Applicant after: Shenzhen saiante Technology Service Co.,Ltd.

Address before: 1-34 / F, Qianhai free trade building, 3048 Xinghai Avenue, Mawan, Qianhai Shenzhen Hong Kong cooperation zone, Shenzhen, Guangdong 518000

Applicant before: Ping An International Smart City Technology Co.,Ltd.

TA01 Transfer of patent application right
GR01 Patent grant
GR01 Patent grant