CN110727849B

CN110727849B - Web address book implementation method based on BS and CS framework

Info

Publication number: CN110727849B
Application number: CN201910903896.7A
Authority: CN
Inventors: 丁杰; 王海青; 施磊; 马威; 李绪福; 宋存洋; 李嘉明; 朱叶盛; 陆一; 周梦璐; 杨岩; 孙彬; 鸦文
Original assignee: CETC 28 Research Institute
Current assignee: CETC 28 Research Institute
Priority date: 2019-09-24
Filing date: 2019-09-24
Publication date: 2022-03-04
Anticipated expiration: 2039-09-24
Also published as: CN110727849A

Abstract

The invention discloses a method for implementing a Web address book based on BS and CS architecture. The method firstly uses the C/S architecture to build an address book plug-in and an address book service to realize data synchronization with a database and change notification; the browser plug-in technology is used. Second encapsulate the address book plug-in so that it can be loaded and called by the browser normally; then develop the web address book JavaScript display module, perform interface drawing, refresh and user event processing for the address book data, and finally integrate it into the web application for Address book display. The invention can not only support a huge number of Web clients, but also realize the automatic partial refresh function of the address book page, and also provide page refresh throttling protection, de-Web service, address book data localization processing, and improve the stability of the Web address book. , reliability and scalability.

Description

Web address book implementation method based on BS and CS framework

Technical Field

The invention relates to a Web address book implementation method based on BS and CS frameworks.

Background

With the development of Internet and Web technologies, the existing C/S (Client/Server) architecture cannot meet the new requirements of global openness, interconnection and information sharing, the development efficiency can be improved, the development and maintenance cost can be saved, and more projects use B/S (browser/Server) architecture to realize rapid building of platforms and products, thereby rapidly occupying the market.

With the advance of Web technology, an address book module is changed from an original C/S architecture to a B/S architecture, in the traditional B/S architecture, the functions of synchronization, filtration and query of address book data are centralized in Web service processing, when the user quantity is continuously increased, the service response speed is slowed down, the service response speed becomes a bottleneck of a software system, and in addition, a client is too dependent on service, once the service is broken down and the like, the consequence is unimaginable. When the data of the address list changes, the traditional client needs to continuously and dynamically refresh the page to update the data in real time, which not only increases the pressure of the server, but also influences the user experience.

Disclosure of Invention

The invention aims to provide a Web address book implementation method based on BS and CS frameworks.

The technical solution for realizing the purpose of the invention is as follows: a method for realizing a Web address book after B/S and C/S frameworks are fused by utilizing a browser plug-in technology, wherein the Web address book comprises an address book service, an address book plug-in, a browser plug-in and a JavaScript (a high-level and interpreted programming language) display module, and the specific realization method comprises the following steps:

step 1, establishing an address book service, and defining functions and data structures to be provided by the address book service;

step 2, realizing the function of address list service definition;

step 3, creating an address book plug-in, and defining functions and data structures to be realized by the address book plug-in;

step 4, realizing the function of the address book plug-in;

step 5, creating a browser plug-in, and defining functions to be realized by the browser plug-in;

step 6, realizing the function of a browser plug-in;

step 7, creating a JavaScript presentation module, and defining functions to be realized by the JavaScript presentation module;

step 8, realizing the function defined by the JavaScript display module;

the step 1 specifically comprises the following steps:

step 1-1: the functions for defining the address book service provision comprise: receiving a query request sent from an address book plug-in and returning a query result; receiving a subscription request sent from the address book plug-in, notifying the address book plug-in when the address book data is changed, and sending a notification message to the address book plug-in;

step 1-2: defining data structure and data parameters of address book service: the query result returned by the address book service is specified as a JSON (JavaScript Object Notation, which is an independent and linguistic text format) array, and the array elements include the following attributes: attribute name, attribute value.

The step 2 specifically comprises the following steps:

the function defined in the step 1 is realized, an executable file is generated, address book data is stored in a MySQL (relational database management system) database, and data transmission is carried out by using a UDP (User Datagram Protocol) Protocol and an address book plug-in.

The step 3 specifically comprises the following steps:

step 3-1: defining functions to be realized by the address book plug-in unit, which comprises the following steps: receiving a subscription request of a browser plug-in, and notifying the browser plug-in if data used by the browser plug-in changes when address book data changes; inquiring data from the address book service, storing the returned data in a memory, and constructing a source memory tree; sending a subscription request to an address list service; processing a notification message sent by an address list service, and updating data in a memory; the address book filtering function is supported, and the browser plug-in can self-define tree nodes by using a FLOC (Filter Language Of Contact) Language and Filter out irrelevant nodes according to node attributes. .

Step 3-2: defining a data structure and memory data of an address book plug-in unit: after receiving the JSON string of the address list service, building a tree structure in a memory, wherein each node in the tree structure stores the addresses of a father node, a brother node and a child node to form a tree structure which is called as a source memory tree; defining data parameters of the address book plug-in: the data returned by the address book plug-in to the browser plug-in is a pointer structure, and the structure corresponds to a tree structure; the control flow parameter definition of the address book plug-in unit comprises the following steps: command constants and command parameters.

The step 4 specifically comprises the following steps:

the method comprises the steps of realizing the function of an address book plug-in, realizing node filtering through the FLOC language, finishing the self-defining function of tree nodes according to a specified filtering strategy, generating a dynamic library file, and carrying out data transmission by using a UDP protocol and an address book service.

In step 4, the step of completing the self-defining function of the tree node according to the specified filtering strategy comprises the following steps:

step a1, traversing the source memory tree, copying new nodes in sequence from the root node, reserving when the evaluation is successful, and deleting when the evaluation is failed;

step a2, the nodes are stacked in sequence, the nodeIter represents a mark pointing to the node in the source memory tree, can move dynamically and is used as a reference point when generating the subtree, the stacked nodes are all marked nodes, and the nodeIter moves to the child nodes until the child node at the bottom layer;

step a3, the node starts to pop, the evaluation is started from the child node to the father node, and the father node is also succeeded by default as long as the evaluation of the child node is successful; after the evaluation of the pop node is completed, the nodeIter is moved to the brother node of the pop node, if the brother node has a child node, the child node is pushed to the last child node, and the step a1 is synchronized;

step a4, if the evaluation of the node fails, the node is replaced by the sibling node whose evaluation is successful; if there is no sibling node, the node evaluation ends.

The step 5 specifically comprises the following steps:

step 5-1: defining functions to be realized by the browser plug-in comprises the following steps: packaging the functions realized by the address book plug-in into the format of the browser plug-in;

step 5-2: and adding the generated browser plug-in into a fixed directory of the browser, and identifying and loading the browser plug-in when the browser is started.

The step 6 specifically comprises the following steps:

an NPAPI (Netscape plug-in Application Programming Interface, which is a plug-in Interface similar to ActiveX used by a browser) plug-in technology is used for generating a dynamic library, the dynamic library is placed in a plug-in folder under a profile directory of Firefox (which is a free and open source code web browser), and the NPAPI plug-in under the directory is loaded after the browser is started.

The step 7 specifically comprises the following steps:

step 7-1: defining functions to be realized by the JavaScript presentation module comprises the following steps: adding a zTree (a multifunctional tree plug-in with excellent performance and flexible configuration) control to realize address book tree display, and calling the browser plug-in created in the step 5 to initialize a tree structure; and when the browser plug-in receives the call back when the tree node changes, refreshing the tree display.

The step 8 comprises the following steps: and (3) realizing Web display of the address book tree by using a JavaScript language and a zTree tree plug-in, wherein the step 8 specifically comprises the following contents:

8-1, instantiating an address list type defined by a JavaScript display module by the Web application, and acquiring an address list display function;

step 8-2, the JavaScript display module loads the browser plug-in through an address book initialization method, transmits filtering conditions and message callback to the browser plug-in, and realizes message interaction between the plug-in and the JavaScript display module;

8-3, loading the address book plug-in by the browser plug-in, registering a callback function to the address book plug-in, realizing message interaction between the plug-in and the plug-in, and transmitting the filtering condition to the plug-in;

8-4, acquiring and storing the full data from the address book service by the address book plug-in, and simultaneously subscribing the address book service so as to realize real-time perception of data change;

8-5, returning the full address book data to the address book plug-in unit by the address book service;

8-6, filtering and matching the full data by the address book plug-in unit according to the filtering condition to generate filtering node data and returning the filtering node data to the browser plug-in unit;

8-7, processing the filtered data by the browser plug-in to generate tree structure data and pushing the tree structure data to a JavaScript display module;

and 8-8, the JavaScript display module analyzes the data and generates an address list tree page.

Compared with the prior art, the invention has the following remarkable advantages: (1) and the Web service is removed, and the data processing is not carried out by depending on a Web service end, so that the problems of bottleneck and crash of the service end are avoided. (2) And the data is cached locally, so that the data processing speed is increased, and the stability and reliability of the Web address list are improved. (3) By adopting a data difference algorithm, view local updating and throttling protection technology, the global refreshing of the Web address list is avoided, and the user experience is improved.

Drawings

The foregoing and other advantages of the invention will become more apparent from the following detailed description of the invention when taken in conjunction with the accompanying drawings.

FIG. 1 is a filtering rule-parent inherit evaluation success child node.

Fig. 2 is a filtering rule-sibling node takes over evaluating failed nodes.

FIG. 3 is a filtering rule-a child node and its parent take over for the siblings of the parent and its children.

Fig. 4 is a node filtering flow diagram.

Fig. 5 is an overall hierarchy view.

Fig. 6 is a structural diagram of the initialization exposure.

Fig. 7 is a structural diagram of data update.

FIG. 8 is a block diagram of event interactions.

Detailed Description

The invention is further explained below with reference to the drawings and the embodiments.

The technical solution for realizing the purpose of the invention is as follows: a method for realizing a Web address book after fusing B/S and C/S frameworks by using a browser plug-in technology comprises an address book service, an address book plug-in, a browser plug-in and a JavaScript display module, and specifically comprises the following steps:

step 2, realizing the function of address list service definition;

step 4, realizing the function of the address book plug-in;

step 6, realizing the function of a browser plug-in;

step 8, realizing the function defined by the JavaScript display module;

the step 1 specifically comprises the following steps:

step 1-2: defining data structure and data parameters of address book service: the query result returned by the address book service is specified to be a JSON array, and the array elements comprise the following attributes: attribute names, attribute values, as follows:

{

an attribute name of 1, an attribute value of 1,

an attribute name 2, an attribute value 2,

an attribute name 3, an attribute value 3,

……

}

the step 2 specifically comprises the following steps:

and (3) realizing the function defined in the step (1), generating an executable file, storing the address book data in a MySQL database, and transmitting the data with the address book plug-in by using a UDP protocol.

The step 3 specifically comprises the following steps:

step 3-1: defining functions to be realized by the address book plug-in unit, which comprises the following steps: receiving a subscription request of a browser plug-in, and notifying the browser plug-in if data used by the browser plug-in changes when address book data changes; inquiring data from the address book service, and storing the returned data in a memory; sending a subscription request to an address list service; processing a notification message sent by an address list service, and updating data in a memory, wherein the data structure of a memory node is as follows:

father node information, including father node, brother and child node information of the father node, node ID (Identifier), name, attribute name and attribute value, and the data structure is the same as the structure of the node;

the brother node information has the same structure as the node;

the child node information has the same structure as the node;

node ID, unique identification of the node;

node name, name of node;

the node attribute names record all the attribute names of the nodes;

the node attribute values record all the attribute values of the nodes, and the arrangement sequence corresponds to the attribute names one by one;

the address book filtering function is supported, the browser plug-in can define tree nodes in a user-defined mode, and irrelevant nodes are filtered out according to node attributes.

Step 3-2: defining a data structure and memory data of an address book plug-in unit: after receiving the JSON string of the address list service, constructing a tree structure in a memory, wherein each node in the tree structure stores the addresses of a father node, a brother node and a child node to form a tree structure; defining data parameters of the address book plug-in: the data returned by the address book plug-in to the browser plug-in is a pointer structure, and the structure corresponds to a tree structure; the control flow parameter definition of the address book plug-in unit comprises the following steps: command constants and command parameters.

The step 4 specifically comprises the following steps:

and 4, realizing the function defined in the step 4, generating a dynamic library file, and performing data transmission with the address list service by using a UDP protocol. The address book realizes node filtering by using the FLOC language, the FLOC statement is written by applying the rules according to the FLOC language, and the statement is transmitted through an interface provided by the address book plug-in to obtain a custom tree structure. Wherein:

FLOC Filter language:

FLOC (Filter Language Of contact) is a filter condition description Language used for describing attribute-based address book node screening conditions. The syntax of FLOC consists of lexical definitions that describe the attributes of the acquisition nodes or string values and syntax definitions that describe the equivalence and disjunction of the attribute values and the string.

Description of the lexical method:

taking a node attribute value example: taking NODEYPE (node type, attribute name of a node) attribute value% NODEYPE;

take the string value "string" example: a character string "1" with a value of 1;

and (3) grammar description:

judging that the two values are equal: word1 (for an attribute name) Word2 (for an attribute name) and supports regular expression matching.

Example (c):

the NODETYPE attribute of the node is equal to 0, i.e.,% NODETYPE ═ 0 or "0"

＝＝％NODETYPE％；

The NODETYPE attribute of a node starts with 1 and ends with 0, i.e.,% NODETYPE ═ 1.

Or "1. -. 0" -% NODETYPE.

And judging that the two values are not equal, and supporting regular expression matching.

Example (c):

the NODEYPE attribute of a node is not equal to 10, i.e.% NODEYPE! 10;

the NODEYPE attribute of a node does not begin with a1 and ends with a 0, i.e.% NODEYPE! 0 or 10 | is said to be! NODETPYPE% in weight percent;

it is judged that two conditions must be satisfied simultaneously: condition 1& condition 2;

example (c): a node of type 0 and Age 20, i.e.,% NODETYPE = 0 "& Age (Age, a generic name) = 20 ═

Judging whether any one of two conditions is satisfied: condition 1| condition 2;

example (c): nodes aged 20 or 30, i.e.% Age ═ 20 |% Age ═ 30 |%, and

judging that a certain condition is not met: | A (conditions), example: the node type is neither 10 nor 0, i.e.! (% NODETYPE% ("10" &% NODETYPE% ("0")

Parent node with a condition: parent (Condition), where Parent is a language keyword;

example (c): there is a node of which Parent node type is 1, i.e., Parent (% detetope% ═ 1 ")

Child node with a condition: child (condition), where Child is a language keyword;

example (c): there is a node of which type of Child node is 1, i.e., Child (% nodal ═ 1 ")

Language implementation:

the method is characterized in that a Spirit (a library function for writing a grammar resolver) tool of a boost (C + + library which can be transplanted and provides source codes) library is adopted to realize the parsing and the generation of the FLOC language, the grammar description adopts an Extended Backus-Naur paradigm (EBNF, Extended Back-Naur Form, namely a meta-grammar notation which is used for describing the context-free grammar of formal languages such as computer programming languages and the like), after the definition is finished, the Spirit is used for generating AST (Abstract Syntax Tree), and then the AST is converted into an evaluation function.

And (3) filtering strategy:

the filtering of the node judges whether the node meets the filtering condition by evaluating the return value of the function so as to decide whether the node is displayed. In fig. 1, light nodes indicate success of default evaluation, dark nodes indicate success of self-evaluation, gray nodes indicate failure of self-evaluation, and white nodes indicate to-be-evaluated. And if the child nodes are successfully evaluated, the parent nodes are successfully evaluated by default. As shown in fig. 1. If node 4 evaluates successfully, its

parent nodes

1, 2 and 3 all set by default to evaluate successfully. A node that fails to evaluate will be replaced by the sibling node it evaluates. As shown in fig. 2.

If node 4 fails the evaluation, node 3 will continue to be evaluated, if node 3 also fails and node 5 evaluates successfully, node 5 will be moved under node 2 and

nodes

1 and 2 will be set to evaluate successfully. Siblings fail the evaluation and are replaced by children and parents. As shown in fig. 3.

Nodes

3, 4 and 5 fail to evaluate, node 7 succeeds, node 6 succeeds by default, and finally nodes 6 and 7 replace

nodes

3 and 5.

And (3) filtering process:

the filtering process is shown in fig. 4, and is used to show a process of filtering a subtree desired by a user from a complete contact list tree.

And a1, traversing the source memory tree, copying new nodes in sequence from the root node, reserving when the evaluation is successful, and deleting when the evaluation is failed.

Step a2, the nodes are stacked in turn, the nodeIter represents a mark pointing to the node in the complete address book tree, which can be moved dynamically and used as a reference point when generating the sub-tree, the stacked nodes are all marked nodes, and the nodeIter moves to the child nodes until the bottom child node.

At step a3, the node starts popping. And starting evaluation from the child node to the parent node, and if the child node is successfully evaluated, the default parent node is also successful. After the evaluation of the pop node is completed, the nodeIter is moved to the brother node of the pop node, if the brother node has a child node, the child node is pushed to the last child node, and the step a1 is synchronized;

step a4, if the node evaluation fails, it is replaced by the sibling node whose evaluation was successful. If there is no sibling node, the node evaluation is finished.

The step 5 specifically comprises the following steps:

The step 6 specifically comprises the following steps:

and generating a dynamic library by using an NPAPI plug-in technology, putting the dynamic library into a plugins folder under the profile directory of the Firefox, and loading the NPAPI plug-in under the directory after the browser is started.

The step 7 specifically comprises the following steps:

step 7-1: defining functions to be realized by the JavaScript presentation module comprises the following steps: adding a zTree control to realize the display of the address book tree, and calling the browser plug-in created in the step 5 to initialize a tree structure; and when the browser plug-in receives the call back when the tree node changes, refreshing the tree display.

The step 8 specifically comprises the following steps:

and realizing Web display of the address book tree by using a JavaScript language and a zTree tree plug-in.

Examples

With reference to fig. 5, the Web client application performs address book presentation and addressing through the integrated Web address book. The Web address book is composed of a browser plug-in, a JavaScript display module and an address book plug-in. The browser plug-in realizes data filtering and data updating by packaging the address book plug-in and provides an external interface; the JavaScript presentation module is responsible for page presentation, event response and redrawing, and realizes service data filtering and data updating by calling a browser plug-in interface. The following describes in detail three main processes of address book initialization, data update and event interaction by taking a certain Web application as an example.

1. And (3) performing initialization display: the initial exposure process message interaction is shown in FIG. 6.

(1) The Web application instantiates an address list class defined by a JavaScript presentation module and acquires an address list presentation function;

(2) the JavaScript display module loads the browser plug-in through an address book initialization method, transmits filtering conditions and message callback to the browser plug-in, and realizes message interaction between the plug-in and the JavaScript display module;

(3) the browser plug-in loads the address book plug-in and registers a callback function to the address book plug-in, so that message interaction between the plug-in and the plug-in is realized, and the filtering condition is transmitted to the plug-in;

(4) the address book plug-in obtains and stores the full data from the address book service, and subscribes the address book service at the same time, thereby realizing the real-time perception of data change;

(5) the address book service returns the full address book data to the address book plug-in;

(6) the address book plug-in module filters and matches the full data according to the filtering condition to generate filtering node data to return to the browser plug-in module;

(7) the browser plug-in processes the filtered data to generate tree structure data and pushes the tree structure data to a JavaScript display module;

(8) the JavaScript display module analyzes the data and generates an address list tree page.

2. Data update

The Web address book subscribes the address book service through the address book plug-in, and when the address book service senses the change of the node information of the address book, the change data is triggered to be pushed. The data update process message interaction relationship is shown in fig. 7.

(1) Triggering service callback when the address book data changes, and pushing the data to the address book plug-in a service callback mode according to subscription conditions;

(2) the address book plug-in executes filtering according to the stored filtering conditions of each user and informs the browser that the plug-in data is updated;

(3) and returning the newly generated and filtered tree data to the JavaScript display module by the browser plug-in.

(4) The JavaScript display module filters unchanged nodes in the received data by adopting a data difference algorithm, locally redraws the address book tree of the changed data, and displays the data on a webpage. The data difference algorithm steps are as follows:

step 1, traversing nodes in a new tree returned to a JavaScript display module and a currently displayed old tree, and sequentially traversing from a root node to child nodes;

step 2, if the node A exists in the old tree but does not exist in the new tree, adding the node A into a deletion list;

step 3, if the node A does not exist in the old tree but exists in the new tree, adding the node A into the new list;

step 4, if the node A exists in both the new tree and the old tree but the node attributes are not consistent, adding the node A into a refresh list;

3. event interaction

The address list user events comprise click events of tree nodes of the address list, check events of the tree nodes and the like, and the JavaScript layer can process messages of the tree control without upward transmission. The event interaction relationship is shown in fig. 8.

(1) The user clicks the address list window node or selects a plurality of nodes through check boxes, the zTree control captures the user operation event and transmits the event type to the JavaScript display module;

(2) and the address book JavaScript display module calls an event response function registered by the Web application foreground for processing.

The present invention provides a method for implementing a Web address book based on BS and CS architectures, and a number of methods and ways for implementing the technical solution are provided, the above description is only a preferred embodiment of the present invention, and it should be noted that, for those skilled in the art, a number of improvements and modifications may be made without departing from the principle of the present invention, and these improvements and modifications should also be regarded as the protection scope of the present invention. All the components not specified in the present embodiment can be realized by the prior art.

Claims

1. A Web address book implementation method based on BS and CS frameworks is characterized in that the Web address book comprises an address book service, an address book plug-in, a browser plug-in and a JavaScript display module, and the specific implementation method comprises the following steps:

step 2, realizing the function of address list service definition;

step 4, realizing the function of the address book plug-in;

step 6, realizing the function of a browser plug-in;

step 8, realizing the function defined by the JavaScript display module;

the step 1 specifically comprises the following steps:

step 1-2: defining data structure and data parameters of address book service: the query result returned by the address book service is specified to be a JSON array, and the array elements comprise the following attributes: attribute name, attribute value;

the step 2 specifically comprises the following steps:

the function defined in the step 1 is realized, an executable file is generated, address book data are stored in a MySQL database, and a UDP protocol and an address book plug-in are used for data transmission;

the step 3 specifically comprises the following steps:

step 3-1: defining functions to be realized by the address book plug-in unit, which comprises the following steps: inquiring data from the address book service, storing the returned data in a memory, and constructing a source memory tree; sending a subscription request to an address list service; processing a notification message sent by an address list service, and updating data in a memory; receiving a subscription request of a browser plug-in, and notifying the browser plug-in if data used by the browser plug-in changes when address book data changes; the address book filtering function is supported, the browser plug-in can define tree nodes in a user-defined mode, and irrelevant nodes are filtered out according to node attributes;

step 3-2: defining a data structure and memory data of an address book plug-in unit: after receiving the JSON string of the address list service, building a tree structure in a memory, wherein each node in the tree structure stores the addresses of a father node, a brother node and a child node to form a tree structure which is called as a source memory tree; defining data parameters of the address book plug-in: the data returned by the address book plug-in to the browser plug-in is a pointer structure, and the structure corresponds to a tree structure.

2. The method according to claim 1, wherein step 4 specifically comprises the following:

3. The method according to claim 2, wherein in step 4, the step of performing the custom function of the tree node according to the specified filtering policy comprises the following steps:

4. The method according to claim 3, characterized in that step 5 comprises in particular the steps of:

5. The method according to claim 4, wherein step 6 comprises the following steps:

and generating a browser plug-in, and putting the browser plug-in into a browser loading directory.

6. The method according to claim 5, characterized in that step 7 comprises in particular the steps of:

7. The method according to claim 6, wherein step 8 comprises the following steps: