阅读说明：本技术 一种基于客户端存储的气象可视化系统 (Meteorological visualization system based on client storage ) 是由 宛亚东 张录军 杨春 李晓洁 于 2021-08-26 设计创作，主要内容包括：本发明公开了一种基于客户端存储的气象可视化系统,客户端主动调用服务端的数据,服务端通过WebSocket对象向客户端推送数据；客户端包括气象数据客户端存储模块、气象数据客户端展示模块、气象数据监控模块、气象数据前端预处理模块、接口基础数据模块和气象数据客户端操作模块,气象数据客户端展示模块、气象数据监控模块、气象数据客户端操作模块均与气象数据客户端存储模块连接,气象数据监控模块与接口基础数据模块连接,接口基础数据模块通过气象数据前端预处理模块与气象数据客户端存储模块连接。本发明减少了客户端和服务端的请求次数；用户可快速打开气象可视化界面,在节省开销的同时也提高了整体的体验效果。(The invention discloses a weather visualization system based on client storage.A client actively calls data of a server, and the server pushes the data to the client through a WebSocket object; the client comprises a meteorological data client storage module, a meteorological data client display module, a meteorological data monitoring module, a meteorological data front-end preprocessing module, an interface basic data module and a meteorological data client operation module, wherein the meteorological data client display module, the meteorological data monitoring module and the meteorological data client operation module are all connected with the meteorological data client storage module, the meteorological data monitoring module is connected with the interface basic data module, and the interface basic data module is connected with the meteorological data client storage module through the meteorological data front-end preprocessing module. The invention reduces the request times of the client and the server; the user can open the weather visual interface fast, has also improved holistic experience effect when saving the expense.)

1. The weather visualization system based on client storage is characterized by comprising a client (7) and a server (8), wherein the client (7) actively calls data of the server (8), and the server (8) pushes the data to the client (7) through a WebSocket object;

the client (7) comprises a meteorological data client storage module (1), a meteorological data client display module (2), a meteorological data monitoring module (3), a meteorological data front-end preprocessing module (4) for classifying data, an interface basic data module (5) and a meteorological data client operation module (6), wherein the meteorological data client operation module (6) is used for inputting text information, voice information and resource information through an operation interface; the meteorological data client display module (2), the meteorological data monitoring module (3) and the meteorological data client operation module (6) are all connected with the meteorological data client storage module (1), the meteorological data monitoring module (3) is connected with the interface basic data module (5), and the interface basic data module (5) is connected with the meteorological data client storage module (1) through a meteorological data front-end preprocessing module (4);

the WebSocket object is a constructor and is used for newly building a WebSocket instance; returning the current state of the instance object through a readyState attribute in the WebSocket object, wherein the current state is used for judging whether the client (7) and the server (8) are connected, the connection is closed or the connection fails; the onopen attribute in the WebSocket object is used for setting a callback function after connection is successful, and sending a request to a server (8) in the callback function; the onmessage attribute of the WebSocket object is used for receiving data returned by the server (8) and closing the connection between the WebSocket object and the server (8) through the onmessage attribute.

2. The weather visualization system based on the client storage as claimed in claim 1, wherein the weather data client storage module (1) stores the weather data of different weather type tables in classification in the form of IndexDB database.

3. The weather visualization system based on the client storage as claimed in claim 2, wherein the weather data client display module (2) displays the graphics and images of the weather changes by calling the weather data of different weather type tables in the indexedDB database.

4. The weather visualization system based on the client storage is characterized in that the weather data front-end preprocessing module (4) is configured to compare the data returned by the interface basic data module (5) with the data in the indexedDB database, and if the indexedDB database already exists, the data is not stored, otherwise, the data is stored.

5. The weather visualization system based on the client storage as claimed in claim 1, wherein the weather data monitoring module (3) monitors the data change in a WebSocket manner.

6. The weather visualization system based on the client storage is characterized in that the interface basic data module (5) is used for receiving the data of the temperature, the pressure, the wind power and the humidity returned after the processing of the server (8).

7. The weather visualization system based on the client storage according to any one of the claims 1 to 6, wherein the client (7) and the server (8) interact as follows:

the client (7) actively calls the data of the server (8), and returns the data to the client (7) after a request result is obtained;

preprocessing the data of the server (8) through a meteorological data front-end preprocessing module (4), comparing the data with an IndexDB database, if the IndexDB database has the data, not storing the data, and if the IndexDB does not have the data, storing the data;

the server (8) pushes data to the client (7) through WebSocket, if the data displayed by the client (7) changes, the client (7) is informed, and the result is returned to the client (7), and the client (7) preprocesses the received data and stores the data in an IndexedDB database;

the client (7) directly calls the data in the IndexDB database for displaying, and under the condition that the condition is not changed, the visualization part can directly acquire the data in the IndexDB database of the client (7), so that the data interaction with the server (8) can be reduced.

Technical Field

The invention relates to a weather visualization system based on client storage, and belongs to the technical field of weather data visualization.

Background

With the development of modern science and technology, meteorological data as basic support information of each industry is inseparable from the operation development of each industry such as electric power, aviation, agriculture and the like, and inseparable from the life of people, and as the meteorological data has the characteristics of multiple sources, multiple dimensionality, huge data volume and the like, a meteorological visualization platform also needs to have the characteristics of easy expansibility, universality, hierarchy and the like. From the living perspective of people, the method has been successfully applied to the fields of electric power, aviation, agriculture and the like. From the meteorological field, set up an audio-visual data analysis platform and data display platform, for meteorological work, can help its more direct law of seeing out meteorological development to a prejudgement has been done. The weather visualization technology is relatively perfect up to now, however, in view of the data volume in the current global weather forecasting system, for example, the Global Forecast System of the national environmental Forecast center, the data updating time is normally once updated in 6 hours, the data amount per hour is about 300 million, if the data size calculated in this way for one month is a huge amount of data, the graphic data and image data provided in the corresponding formats after being processed by the server are also very large, thus, a great deal of bandwidth, CPU and memory are consumed during data interaction between the server and the client, and a great deal of time is consumed at the same time, meanwhile, when the user searches for the display according to the requirement of the user, the display is slow when the effect of the screening condition of the user is displayed, the visual interface is opened slowly, so that the user experience is poor, and the problems are all urgently to be solved.

At present, most meteorological data are mainly communicated by adopting an http protocol when displayed on a client, so that the meteorological data can only be initiated by the client, for example, when people want to know the display condition of the weather today, the client can only initiate a request to a server, and at present, the most adopted mode can only use polling to send out a query at intervals to know whether new information exists in the server, so that the overall efficiency is very low, and a large amount of resources are wasted. Secondly, the previous cookie and LocalStorage can only store a small amount of data, so that for a large amount of data such as weather, a client cannot store the data therein, so that the opening speed of the whole interface mainly depends on the transmission speed of data of the server and the client, which causes that in the case of a slightly poor network condition, the opening speed of the interface is very slow, and the overall experience effect is poor.

Disclosure of Invention

The invention aims to overcome the defects in the prior art and provide a weather visualization system based on client storage, wherein a visualization part can directly acquire data at a client, so that data interaction with a server is reduced, and the request times of the client and the server are reduced.

In order to achieve the purpose, the invention is realized by the following technical scheme:

the invention relates to a weather visualization system based on client storage, which comprises a client and a server, wherein the client actively calls data of the server, and the server pushes the data to the client through a WebSocket object; the client comprises a meteorological data client storage module, a meteorological data client display module, a meteorological data monitoring module, a meteorological data front-end preprocessing module for classifying data, an interface basic data module and a meteorological data client operation module, wherein the meteorological data client operation module is used for inputting text information, voice information and resource information through an operation interface; the meteorological data client display module, the meteorological data monitoring module and the meteorological data client operation module are all connected with the meteorological data client storage module, the meteorological data monitoring module is connected with the interface basic data module, and the interface basic data module is connected with the meteorological data client storage module through a meteorological data front-end preprocessing module; the WebSocket object is a constructor and is used for newly building a WebSocket instance; returning the current state of an instance object through a readyState attribute in the WebSocket object, wherein the current state is used for judging whether the client side and the server side are connected, the connection is closed or the connection fails; the onopen attribute in the WebSocket object is used for setting a callback function after connection is successful, and sending a request to a server side in the callback function; and the onmessage attribute of the WebSocket object is used for receiving data returned by the server and closing the connection between the WebSocket object and the server through the onmessage attribute.

The meteorological data client storage module is used for storing meteorological data of different meteorological type tables in a classified mode in the form of an IndexDB database.

The weather data client display module displays the weather-changed graphics and images by calling the weather data of different weather type tables in the IndexDB database.

The meteorological data front-end preprocessing module is used for comparing data returned by the interface basic data module with data in the IndexedDB, and if the IndexedDB exists, the data are not stored, otherwise, the data are stored.

The meteorological data monitoring module monitors the change of data in a WebSocket mode.

The interface basic data module is used for receiving the data of temperature, pressure, wind power and humidity returned after the server side processes the data.

The weather visualization system based on the client storage is characterized in that the interaction method between the client and the server is as follows:

the client actively calls the data of the server and returns the data to the client after a request result is obtained;

preprocessing the data of the server side through a meteorological data front-end preprocessing module, comparing the data with an IndexDB database, if the IndexDB database has the data, not storing the data, and if the IndexDB does not have the data, storing the data;

the server side pushes data to a client side through WebSocket, if the data in the range displayed by the client side is changed, the server side informs the client side, meanwhile, the result is returned to the client side, and the client side simultaneously preprocesses the received data and then stores the data in an IndexedDB database;

the client side directly calls the data in the IndexDB database for displaying, and under the condition that the condition is not changed, the visualization part can directly acquire the data in the IndexDB database of the client side, so that data interaction with the server side can be reduced.

The invention has the following beneficial effects: the client can communicate with any server, and the server can push data to the client through Websocket, so that a mode of consuming a large amount of resources is abandoned, a mode of initiating a request by the client can also be adopted, data is stored in an IndexedDB database mode, a meteorological data client display module displays a meteorological-changed graph and an image by calling meteorological data in the IndexedDB database, and a visualization part can directly acquire data in the IndexedDB database of the client under the condition of unchanged conditions, so that data interaction with the server is reduced, a large amount of expenses are reduced, the request times of the client and the server are reduced, and a large amount of expenses of bandwidth, CPU and memory can be saved; meanwhile, a user can quickly open the weather visual interface, so that the cost is saved, and the overall experience effect is improved.

Drawings

FIG. 1 is a block diagram of a client according to the present invention;

FIG. 2 is a flowchart illustrating the interaction between the server and the client according to the present invention.

Detailed Description

The technical scheme of the invention is further explained by combining the attached drawings of the specification:

the technical scheme of the invention is further explained by combining the attached drawings of the specification:

interpretation of terms:

IndexedDB: the API is a client-side bottom layer API which is used for storing a large amount of structured data and files or binary large objects (blobs) at a client side, and the API uses indexes to realize high-performance search and storage of the data.

WebSocket: the network communication protocol is characterized in that a server can actively push information to a client, the client can also actively send information to the server, the network communication protocol is a real two-way equal conversation, and the network communication protocol belongs to a server pushing technology.

HTTP: the Hypertext Transfer Protocol (HTTP) is a simple request-response Protocol that specifies what messages a client may send to a server and what responses it gets.

As shown in fig. 1 and fig. 2, a weather visualization system based on client storage includes a client 7, a server 8, the client 7 actively calls the data of the server 8, the server 8 pushes the data to the client 7 through the WebSocket object, the client 7 comprises a meteorological data client storage module 1, a meteorological data client display module 2, a meteorological data monitoring module 3, a meteorological data front-end preprocessing module 4, an interface basic data module 5 and a meteorological data client operation module 6, the meteorological data client display module 2, the meteorological data monitoring module 3 and the meteorological data client operation module 6 are all connected with the meteorological data client storage module 1, the meteorological data monitoring module 3 is connected with the interface basic data module 5, and the interface basic data module 5 is connected with the meteorological data client storage module 1 through the meteorological data front-end preprocessing module 4. The WebSocket object is a construction function and used for building a WebSocket instance, the client 7 can be connected with the server 8 after the execution is successful, then the current state of the instance object is returned through a readyState attribute in the WebSocket object to judge whether the connection is in progress or the connection is closed and the connection is failed, the onopen attribute in the WebSocket object is used for appointing a callback function after the connection is successful, a request can be sent to the server 8 in the callback function, data returned by the server 8 is received through the onmessage attribute of the WebSocket object, and the connection between the WebSocket and the server 8 is closed through the onclose attribute in the WebSocket object.

As shown in fig. 1-2, the weather data client storage module 1 stores the weather data of different weather type tables in a classified manner in the form of an IndexedDB database, such as data with JSON format or url addresses of pictures. The weather data client display module 2 displays the graphics and images of weather changes by calling the weather data in the indexedDB database. The meteorological data monitoring module 3 monitors the change of data in a WebSocket mode, the server 8 can actively push the data to the client 7, and the client 7 can also actively send the data to the server 8, so that the communication can be carried out in real time. The meteorological data front-end preprocessing module 4 compares the data returned by the interface basic data module 5 with the data in the IndexedDB database, if the IndexedDB database already exists, the data are not stored, otherwise, the data are stored, the meteorological data front-end preprocessing module is also used for classifying the data, preparing for the later storage of the data such as wind, temperature and the like, carrying out differentiation processing simultaneously, if the data are the same as the previous data, carrying out no processing, and if the data are different from the previous data, updating and deleting the old data. The interface basic data module 5 is used for receiving returned data of temperature, pressure, wind power and humidity processed by the server 8, and the meteorological data client operation module 6 is used for a user to input text information, voice information and resource information through an operation interface.

Fig. 2 is a flowchart of the interaction between the server 8 and the client 7 of the present invention, which generally includes the following contents:

1. the client 7 can actively call the server 8 data, and when the request result is obtained, the data is returned to the client 7.

2. And preprocessing the data return result through a meteorological data front-end preprocessing module 4, comparing the data return result with an IndexDB database, and if the IndexDB database has the data, not storing the data, and if the IndexDB does not have the data, storing the data.

3. The server 8 can simultaneously push data to the client 7 directly through WebSocket, that is, the data within the range displayed by the client 7 is changed, the client 7 is informed to return the result to the client 7 at the same time, and the client 7 simultaneously preprocesses the received data and stores the preprocessed data in an indexedDB database.

4. The client 7 directly calls the data in the IndexDB database for displaying, so that under the condition of unchanging conditions, the visualization part can directly acquire the data in the IndexDB database of the client 7, the data interaction with the server 8 is reduced, and a large amount of expenses are reduced.

The invention supports the visual display of the meteorological data of the client through the Websocket technology and IndexDB, the Websocket is established on a TCP protocol and has good compatibility with the HTTP protocol, and the HTTP protocol is adopted in the handshake stage, so that the client is not easy to be shielded in the handshake process, the Websocket data format is lighter, the overall performance cost is relatively smaller, no homologous limitation exists, and the client can communicate with any server. Meanwhile, the server can push data to the client through the Websocket, so that the mode that a large amount of resources are consumed and a request can only be initiated by the client is abandoned. Meanwhile, a data storage mode of an IndexedDB client is adopted, the IndexedDB belongs to a non-relational database, data is stored in an object form, each object has a corresponding key name, and when the client displays a related meteorological data interface, the client firstly searches the IndexedDB database. If the data is directly displayed, if the data is not requested to the server side through the Websocket, the data is stored after the data is preprocessed by the client side. Meanwhile, under the current screening condition, the server side pushes data to the client side if the data are changed, and the client side processes the data in the same way after receiving the data, so that the request times of the client side and the server side are reduced, and a large amount of expenses of bandwidth, a CPU (Central processing Unit) and an internal memory can be saved. Meanwhile, a user can quickly open the weather visual interface, so that the cost is saved, and the overall experience effect is improved.

Although the present invention has been described in detail with reference to the foregoing embodiments, it will be apparent to those skilled in the art that modifications may be made to the embodiments or portions thereof without departing from the spirit and scope of the invention.