CN117112940A - Offline data display method and device, electronic equipment and readable storage medium - Google Patents

Offline data display method and device, electronic equipment and readable storage medium Download PDF

Info

Publication number
CN117112940A
CN117112940A CN202310684897.3A CN202310684897A CN117112940A CN 117112940 A CN117112940 A CN 117112940A CN 202310684897 A CN202310684897 A CN 202310684897A CN 117112940 A CN117112940 A CN 117112940A
Authority
CN
China
Prior art keywords
page
target
data
resource
layer
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.)
Pending
Application number
CN202310684897.3A
Other languages
Chinese (zh)
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 Workec Technology Co ltd
Original Assignee
Shenzhen Workec 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 Shenzhen Workec Technology Co ltd filed Critical Shenzhen Workec Technology Co ltd
Priority to CN202310684897.3A priority Critical patent/CN117112940A/en
Publication of CN117112940A publication Critical patent/CN117112940A/en
Pending legal-status Critical Current

Links

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/957Browsing optimisation, e.g. caching or content distillation
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90Details of database functions independent of the retrieved data types
    • G06F16/95Retrieval from the web
    • G06F16/958Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00Arrangements for software engineering
    • G06F8/60Software deployment
    • G06F8/65Updates
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces

Abstract

The invention is applicable to the field of computer application, and provides an offline data display method, an offline data display device, electronic equipment and a readable storage medium, wherein the method comprises the following steps: acquiring a page state value of a target webpage; determining the non-change type of the target webpage according to the page state value; determining a target resource corresponding to the non-change type in the local resource; and updating the target webpage through the target resource to obtain a first display page for display. The non-change type of the target webpage is determined according to the page state value of the target webpage, the target type corresponding to the non-change type is determined in the local resource, the target webpage is updated according to the target type corresponding to the non-change type, and the updated display page is obtained, so that the problem of page display loading failure in a weak network or no-network environment is solved.

Description

Offline data display method and device, electronic equipment and readable storage medium
Technical Field
The present invention relates to the field of computer applications, and in particular, to an offline data display method, an offline data display device, an electronic device, and a readable storage medium.
Background
In mobile applications, data interaction with a server is often required to obtain up-to-date data and update the state of the application. However, in some cases, such as network failure or server maintenance, an application may not have access to a server, and thus may not be able to obtain up-to-date data. The webview page is not directly opened in the weak network or the non-network environment, and the loading failure page is displayed, so that the static resource file needs to be downloaded in advance, and the problem that if the H5 pages are too many, the downloading speed is slow and the occupied ratio of the static resource file is too high is caused.
Disclosure of Invention
The embodiment of the invention provides an offline data display method, which aims to solve the problems that in the prior art, webview pages are not opened directly under the weak network or no network environment, and loading failure pages are displayed. The non-change type of the target webpage is determined according to the page state value of the target webpage, the target type corresponding to the non-change type is determined in the local resource, the target webpage is updated according to the target type corresponding to the non-change type, and the updated display page is obtained, so that the problem of page display loading failure in a weak network or no-network environment is solved.
The embodiment of the invention is realized in such a way that an offline data display method is provided, which comprises the following steps:
acquiring a page state value of a target webpage;
determining the non-change type of the target webpage according to the page state value;
determining a target resource corresponding to the non-change type in the local resource;
and updating the target webpage through the target resource to obtain a first display page for display.
Optionally, the obtaining the page status value of the target webpage includes:
and requesting the page state value of the target webpage from a server so that the server returns the page state value of the target webpage.
Optionally, the determining the non-change type of the target webpage according to the page status value includes:
when the page state value is a first preset value, determining that the non-change type of the target webpage is a UI layer;
when the page state value is a second preset value, determining that the non-change type of the target webpage is a data layer;
and when the page state value is a third preset value, determining that the non-change type of the target webpage is a UI layer and a data layer.
Optionally, the determining, in the local resources, the target resource corresponding to the non-change type includes:
When the non-change type of the target webpage is a UI layer, determining a target UI resource corresponding to the UI layer in the local resources;
when the non-change type of the target webpage is a data layer, determining a target data resource corresponding to the data layer in the local resources;
and when the non-change type of the target webpage is a UI layer and a data layer, determining a target UI resource corresponding to the UI layer in the local resources, and determining a target data resource corresponding to the data layer.
Optionally, the updating the target web page through the target resource to obtain a first display page for display includes:
when the target UI resource is determined, requesting a data update resource corresponding to a data layer from a server, and updating the target webpage based on the target UI resource and the data update resource to obtain a first display page for display;
and when the target data resource is determined, requesting a UI update resource corresponding to the UI layer from a server, and updating the target webpage based on the target data resource and the UI update resource to obtain a first display page for display.
Optionally, after the updating the target web page through the target resource to obtain a first display page for display, the method further includes:
when the first display page is abnormal, acquiring standby data of the target page through a native source;
and updating the target page based on the standby data to obtain a second display page for display.
The embodiment of the invention also provides an offline data display device, which comprises:
the first acquisition module is used for acquiring a page state value of the target webpage;
the first determining module is used for determining the non-change type of the target webpage according to the page state value;
the second determining module is used for determining a target resource corresponding to the non-change type in the local resources;
and the first updating module is used for updating the target webpage through the target resource to obtain a first display page for display.
The embodiment of the invention also provides an offline data display system, which comprises a server side and an APP side, wherein the APP side comprises the offline data display device.
The embodiment of the invention also provides an electronic device, which comprises a memory, a processor and a computer program stored in the memory and capable of running on the processor, wherein the processor realizes the offline data display method according to any embodiment when executing the computer program.
Embodiments of the present application also provide a computer readable storage medium storing a computer program which, when executed by a processor, implements an offline data display method as described in any of the embodiments.
The method has the beneficial effects that the page state value of the target webpage is obtained; determining the non-change type of the target webpage according to the page state value; determining a target resource corresponding to the non-change type in the local resource; and updating the target webpage through the target resource to obtain a first display page for display. The non-change type of the target webpage is determined according to the page state value of the target webpage, the target type corresponding to the non-change type is determined in the local resource, the target webpage is updated according to the target type corresponding to the non-change type, and the updated display page is obtained, so that the problem of page display loading failure in a weak network or no-network environment is solved.
Drawings
FIG. 1 is a block diagram of an offline data display system according to an embodiment of the present application
FIG. 2 is a flowchart of an offline data display method according to an embodiment of the present application;
FIG. 3 is a flowchart of another offline data display method according to an embodiment of the present application;
FIG. 4 is a flowchart of another offline data display method according to an embodiment of the present application;
FIG. 5 is a flowchart of step S302 in FIG. 3 according to an embodiment of the present application;
fig. 6 is a flowchart of step S303 in fig. 3 according to an embodiment of the present application;
FIG. 7 is a flowchart of step S304 in FIG. 3 according to an embodiment of the present application;
FIG. 8 is a flow chart of web page update provided by an embodiment of the present application;
FIG. 9 is a schematic diagram of a data storage structure according to an embodiment of the present application;
FIG. 10 is a flowchart of another offline data display method according to an embodiment of the present application;
FIG. 11 is a schematic diagram of an offline data display device according to an embodiment of the present application;
fig. 12 is a schematic structural diagram of the first determining module in fig. 6 according to an embodiment of the present application;
fig. 13 is a schematic structural diagram of a second determining module in fig. 6 according to an embodiment of the present application;
FIG. 14 is a schematic diagram of a first update module in FIG. 6 according to an embodiment of the present application;
FIG. 15 is a schematic diagram of an offline data display device according to an embodiment of the application;
fig. 16 is a schematic structural diagram of an electronic device according to an embodiment of the present application.
Detailed Description
The present application will be described in further detail with reference to the drawings and examples, in order to make the objects, technical solutions and advantages of the present application more apparent. It should be understood that the specific embodiments described herein are for purposes of illustration only and are not intended to limit the scope of the application.
Example 1
Fig. 1 shows an architecture diagram of an offline data display system according to an embodiment of the present application. The off-line data display system comprises a server side and an APP side, when the APP is started, websocket long connection is initialized, and the long connection mainly acquires a page state value and monitors the change of the page state value; there are four total page status values: (1) state 0, which indicates that the page has no local cache, the page needs to be loaded in full, that is, networking is needed to open the page in a normal mode; (2) state 1, which indicates that the data layer needs to be updated, the UI layer is unchanged, and the UI layer uses the local; (3) state 2, which indicates that the UI layer needs to be updated, the data of the data layer is unchanged, and the data layer uses the local; (4) state 3, showing that the data and UI do not need to be updated, and all the local resource files are directly used.
Obtaining all states of the page from a server by using a webview sending request, and storing the page states locally; the storage mode is stored in a kv mode, k is a key, k can be a page url address, v is a value, and v is a state value.
The WebSocket described above is a protocol that provides full duplex communication over a single TCP connection. It allows a persistent connection to be established between the browser and the server so that the server can actively push data into the browser. After the WebSocket connection is established, the server can send data directly to the client without waiting for the client's request.
The kv represents key value storage, and refers to a data storage manner, in which each data item is composed of a unique key and an associated value. Such data storage is typically used for applications that require fast reading and writing of data, such as caching, configuration files, and logging. The data is stored in a key-value store, i.e. each data item consists of a unique key and an associated value. The key represents a key, and the key is a page URL address; the value is the state, and the value refers to the state of the page.
The page URL address refers to a Uniform Resource Locator (URL), which is a character string used to identify a specific resource location on the internet. The URL is typically composed of a protocol, a hostname, and a resource path. For example, the following is a URL address: https:// workec. In this URL https is the protocol, workec.com is the hostname, getinfo.xml is the resource path. Typically, URL addresses are used to open Web pages in Web browsers, but they may also be used for other purposes, such as retrieving data in a Web application or performing other operations.
When the webview page is opened, the state is acquired according to the url address of the page, and if the state value (state) is:
state 0, which indicates that no cache exists locally, the page needs to be opened in full, that is, the web page needs to be opened in a normal networking mode;
when the state is 1, the UI is unchanged, the page loads local resources, then a network request is sent to acquire the latest data, the UI is refreshed again when the data is returned, the page is instantaneously opened from the angle of a user and then the UI is refreshed when the latest data is waited for to be returned, and the state value is updated to be 3;
when state is 2, the data is unchanged, only UI is changed, at the moment, the page firstly loads local resources, then the latest UI resource file is returned to the server, the page is replaced after the UI resource file is successfully obtained, the page is instantly opened from the angle of a user, the latest UI resource file is displayed after success, and at the moment, the state value is updated to be 3;
and when the state is 3, the data layer and the UI are not required to be changed, and the local resource file is directly used.
In the embodiment of the invention, when the front page is modified, the state change is performed on the APP end through the websocket, if the data layer is changed, the APP end is notified of the url address and state 1, if the UI layer is changed, the APP end is notified of the url address and state 2, the APP end receives the state change notification to notify the state corresponding to the url stored in the local state to perform the change, and when the websocket page is opened, the latest state is obtained from the local state to perform logic processing. The logic processing is the corresponding processing according to the state: n.
Example two
In this embodiment, based on the first embodiment, as shown in fig. 2, fig. 2 is a flowchart of an offline data display method according to an embodiment of the present application. Specifically, when APP is started, websocket is opened, and when APP is started, websocket long connection is initialized; acquiring all states of the page from a server by using a websocket sending request, and storing the page states locally; when the front page is modified, the APP end is informed to change the state through websocket.
The long connection mainly acquires the page state value and monitors the change of the page state value. Page status values refer to a status value for each page at the application. Based on the state value, the application may take different policies to handle the loading and updating of pages.
The WebSocket described above is a protocol that provides full duplex communication over a single TCP connection. It allows a persistent connection to be established between the browser and the server so that the server can actively push data into the browser. After the WebSocket connection is established, the server can send data directly to the client without waiting for the client's request.
In the embodiment of the invention, the page status value has four types in total: state 0, the page has no local cache and needs to be loaded in full; state 1, the data layer needs to be updated, and the UI layer uses the local; state 2, the UI layer needs to be updated, and the data layer uses the local; and state 3, the UI layer of the data layer does not need to be updated, and the local resources are fully used.
The storage mode is stored in a kv mode, k is a key, k can be a page url address, v is a value, and v is a state value. The kv represents key value storage, and refers to a data storage manner, in which each data item is composed of a unique key and an associated value. Such data storage is typically used for applications that require fast reading and writing of data, such as caching, configuration files, and logging. The data is stored in a key-value store, i.e. each data item consists of a unique key and an associated value. The key represents a key, and the key is a page URL address; the value is the state, and the value refers to the state of the page.
The page URL address refers to a Uniform Resource Locator (URL), which is a character string used to identify a specific resource location on the internet. The URL is typically composed of a protocol, a hostname, and a resource path. For example, the following is a URL address: https:// workec. In this URL https is the protocol, workec.com is the hostname, getinfo.xml is the resource path. Typically, URL addresses are used to open Web pages in Web browsers, but they may also be used for other purposes, such as retrieving data in a Web application or performing other operations.
When the webview page is opened, acquiring a state according to the url address of the page, and if the state value is:
state 0, which indicates that no cache exists locally, the page needs to be opened in full, that is, the web page needs to be opened in a normal networking mode;
state 1, which means that the data layer needs to be updated and the UI is unchanged, the page loads local resources, then sends a network request to acquire the latest data, refreshes the UI when the data returns, and instantly opens the page from the angle of a user and refreshes the UI when waiting for the latest data to return, and the state value is updated to be 3;
state 2, which means that the data is unchanged, but the UI is changed, the page firstly loads local resources, then returns the latest UI resource file to the server, the page is replaced after the UI resource file is successfully obtained, the page is instantly opened from the angle of a user, the latest UI resource file is displayed after success, and the state value is updated to be state 3;
state 3, indicating that the data layer and the UI do not need to be changed, and directly using the local resource file.
If the data layer is changed, the APP end is notified of the url address and state 1, the state 1 corresponding to url stored in the local state is changed after the APP end receives the state change, the latest data resource is obtained from the local state storage when the webview page is opened, the UI is refreshed when the data returns, and the state is updated to be state 3.
If the UI layer is changed, informing the APP end of the URL address and state 2; the APP terminal receives the state change to change the state 2 corresponding to url stored in the local state, when the webview page is opened, the latest UI resource file is obtained from the local state storage, the UI resource file is replaced after being successfully obtained, the latest UI style is displayed after waiting for the latest UI resource file to be loaded successfully, and the state is updated to be the state 3.
In the embodiment of the application, when the front page is modified, the APP end is notified to change the state through the websocket, and when the APP end receives the state change notification, the state corresponding to url stored in the local state is changed, and when the webview page is opened, the latest state is obtained from the local state storage to perform corresponding logic processing. The logic processing is the corresponding processing according to the state: n.
Example two
In this embodiment, fig. 3 shows a flowchart of another offline data display method according to an embodiment of the present application. As shown in fig. 3, the method includes steps S301 to S304. The specific implementation principle of each step is as follows:
s301, acquiring a page state value of a target webpage.
In the embodiment of the application, the web pages can be different types of web pages, such as static web pages, dynamic web pages, single-page application programs and the like. Static web pages are typically composed of static files such as HTML, CSS, and JavaScript. The content of the static web pages does not change when accessed because they do not interact with the server. Typically, static web pages are used to display static content, such as corporate information, news articles, and the like. The content of the dynamic web page changes upon access. This is because the content of the dynamic web page is dynamically generated from the server, typically implemented using server-side scripting languages (e.g., PHP, asp. Net, etc.). Dynamic web pages are commonly used to display personalized content, such as social media, e-commerce websites, and the like. The single-page application program is a Web application program realized by using technologies such as JavaScript and the like, and can realize dynamic update of content without refreshing pages. Single page applications typically use AJAX technology to retrieve data from a server and use client routers to implement page navigation and content updating.
The target web page may be a web page browsed by a user in the application program, and specifically may be a specific web page browsed by the user to be accessed.
In the embodiment of the invention, the webpage of the invention can be a webview page. The invention is specifically illustrated in the webview page. Webview is a technology that can embed a browser in an application. The method can enable the application program to display the webpage and simultaneously realize interaction with the webpage.
It should be noted that the web page includes a data layer and a UI layer. The data layer refers to a part related to data in an application program, and comprises storage, processing, management and the like of the data; the main responsibility of the data layer is to manage the data in the application program and provide an access interface for the data; the data layer is generally composed of a database and a data access layer, wherein the database is responsible for storing data, and the data access layer is responsible for managing and accessing the data; in an application, the data layer provides a reliable way of data storage and access to ensure the correctness and consistency of the data of the application. The UI layer refers to a part related to a user interface in an application program, and comprises design, layout, display and the like of the user interface; the main responsibility of the UI layer is to handle the user's input and output and present data to the user; in applications, the UI layer is typically composed of interface design, layout, controls, event handling, and the like to provide a good user experience and interactivity.
The page status value refers to a status value for each page in the application program. Based on the state value, the application may take different policies to handle the loading and updating of pages.
In the embodiment of the invention, the page status value has four types in total: (1) when state is 0, the state indicates that the local storage is not available and the page needs to be loaded in full quantity; (2) when the state is 1, the page state value can be the data layer needs to be updated, and the UI layer uses the local; (3) when state is 2, the UI layer needs to be updated, and the data layer uses the local; (4) and when the state is 3, the data layer and the UI layer do not need to be updated, and the local resources are fully used.
Optionally, the step of obtaining the page status value of the target webpage includes:
and requesting the page state value of the target webpage from the server so that the server returns the page state value of the target webpage.
In the embodiment of the present invention, the server refers to a program running on a server in a web application, and is configured to process a request of a client, generate a response, and return the response to the client. Specifically, the server looks up the page status value according to the request of the application program, and returns the status value as a response to the application program.
In the embodiment of the invention, the page state value of the target webpage is acquired to determine the currently used page state, so that an application program can adopt different strategies to process the loading and updating of the page to ensure the positive determination and the latest of the page.
S302, determining the non-change type of the target webpage according to the page state value.
In the embodiment of the invention, the non-change type refers to a type that the content and the state of the page do not change. The non-change type may be a UI layer or a data layer.
The page state values are four in total, (1) when the state is 0, the page state value indicates that the page is not stored locally and needs to be loaded in full; (2) when the state is 1, the page state value can be the data layer needs to be updated, and the UI layer uses the local; (3) when state is 2, the UI layer needs to be updated, and the data layer uses the local; (4) and when the state is 3, the data layer and the UI layer do not need to be updated, and the local resources are fully used.
In one possible embodiment, when state 1, this indicates that the page data layer needs to be updated, the UI layer uses locality. And determining the non-change type of the target webpage as a UI layer according to the webpage state value.
In another possible embodiment, when state 2, the UI layer is shown to need to be updated and the data layer is local. And determining the non-change type of the target webpage as a data layer according to the page state value.
In another possible embodiment, when state 3, no update is needed for both the presentation data layer and the UI layer, and the local resources are fully utilized. And determining the non-change type of the target webpage as a data layer and a UI layer according to the page state value.
In the embodiment of the invention, the user can determine whether the target webpage is of a non-change type through the state value of the webpage, the webpage and the state of the type are already stored in the local resource, and the application program can directly use the local resource webpage.
S303, determining target resources corresponding to the non-change type in the local resources.
In the embodiment of the present invention, the local resource may be a resource that an application program stores on a local device. In an application program, in order to improve the efficiency and response speed of data access, some common data is usually stored on a local device for quick access. The stored data may be files, pictures, audio, video, and other types of resources. The use of the locally stored data can reduce the dependence of the application program on the network and improve the performance and user experience of the application program.
The target resource is a local resource corresponding to a page of the page state value in the application program.
In one possible embodiment, when state 1, the target resource may be a local UI resource corresponding to the page of state 1 in the application program, and the data layer changes to need to be updated.
In another possible embodiment, when state 2, the target resource may be a local data resource corresponding to a page of state 2 in the application program, and the UI layer is changed and needs to be updated.
In another possible embodiment, when state 3, the target resource may be a local data resource and a UI resource corresponding to a page of state 3 in the application program, and the data layer and the UI layer are not changed.
It should be noted that UI resources are all resources for constructing UI layers, such as htkl, css, and jst files. A data resource is all resources used to store data, such as databases, files, js interfaces, and the like.
Specifically, a target UI layer resource corresponding to the UI layer is determined in the local resources. And determining the target data layer resource corresponding to the data layer in the local resource. And determining target data layer resources and UI layer resources corresponding to the data layer and the UI layer from the local resources.
In the embodiment of the invention, the target resource corresponding to the non-change type needs to be determined in the local resource. Depending on the page status values, the application may take different policies to handle the loading and updating of the page to ensure the correctness and the latest of the page.
S304, updating the target webpage through the target resource to obtain a first display page for display.
In the embodiment of the present invention, the target resource is a local resource corresponding to the application program and the page of the page status value. The target web page may be a web page browsed by a user in the application program, and specifically may be a specific web page browsed by the user to be accessed.
In one possible embodiment, when state 1, this indicates that the page data layer needs to be updated, the UI layer uses locality. And determining the non-change type of the target webpage as a UI layer according to the webpage state value. The target resource may be a local UI layer resource corresponding to the page of state 1 in the application program, and the data layer is changed and needs to be updated.
In another possible embodiment, when state 2, the UI layer is shown to need to be updated and the data layer is local. And determining the non-change type of the target webpage as a data layer according to the page state value. The target resource may be a local data layer resource corresponding to the page of state 2 in the application program, and the UI layer changes and needs to be updated.
In the embodiment of the invention, the page state value of the target webpage is obtained; determining the non-change type of the target webpage according to the page state value; determining a target resource corresponding to the non-change type in the local resource; and updating the target webpage through the target resource to obtain a first display page for display. The non-change type of the target webpage is determined according to the page state value of the target webpage, the target type corresponding to the non-change type is determined in the local resource, the target webpage is updated according to the target type corresponding to the non-change type, and the updated display page is obtained, so that the problem of page display loading failure in a weak network or no-network environment is solved.
Example IV
In this embodiment, please refer to fig. 4, fig. 4 is a flowchart of another offline data display method according to an embodiment of the present application. Specifically, after the APP is opened, when webview is started, if a local resource exists, the local resource is loaded first; then the js receiving data interface is started; judging whether the data layer is changed or not, requesting the latest data when the data is changed, and not giving the data to the js interface when the data is returned, and updating page data when the js interface receives the data; judging whether the UI is changed or not, when the UI needs to be changed, requesting the latest page resource file, and refreshing the page after the request is successful; the UI changes by only loading UI resources, and the data layer uses the local resources because the data layer has no change, which is much faster than the static resources (UI and data).
The js data receiving interface mainly has two tasks: data update and UI update; the js receive data interface has two main parameters: parameter 1 (url address or command word), parameter 2 (json dataset); this is done according to the interface modularity, and in case of many page modules, it is not necessary to acquire the data of the real page once, and which module has an update only needs to be updated.
In the embodiment of the present invention, the js data receiving interface refers to a mechanism used in JavaScript code, which allows the JavaScript code to acquire data from a Web server. By using json data format, the server can transfer data into JavaScript code in a manner that is easy to read and understand. The JavaScript receives the data interface so that the JavaScript code can retrieve the data from the server and use it in the Web application. The json dataset described above is typically used to transfer data between JavaScript code and a server. For example, when a user requests data from a server through an app end, the server returns the data to the user as a json dataset, which the user can then use in JavaScript code.
Example five
In the present embodiment, based on the third embodiment described above, as shown in fig. 5, step S302 includes steps S3021 to S3023. The specific implementation principle of each step is as follows:
s3021, when the page status value is a first preset value, determining that the non-change type of the target webpage is a UI layer.
In the embodiment of the invention, each page in the APP end corresponds to a page state value. There are four types of page status values: (1) when state is 0, the state indicates that the local storage is not available and the page needs to be loaded in full quantity; (2) when the state is 1, the page state value can be the data layer needs to be updated, and the UI layer uses the local; (3) when state is 2, the UI layer needs to be updated, and the data layer uses the local; (4) and when the state is 3, the data layer and the UI layer do not need to be updated, and the local resources are fully used.
The non-change type refers to a data type in which the content and state of the page do not change, and further can be understood as a data type that does not need to be downloaded in a networking manner. The non-change type may be a UI layer or a data layer.
The preset value may be a predefined default value in the system or the program.
The first preset value may specifically be state 1, where state 1 indicates that the data layer needs to be updated, and the UI layer is unchanged.
Specifically, when the page state value is state 1, determining the non-change type of the target webpage as the UI layer according to the page state value.
S3022, when the page status value is a second preset value, determining that the non-change type of the target webpage is a data layer.
In the embodiment of the present invention, the second preset value may specifically be state 2, where state 2 indicates that the UI layer needs to be updated, and the data layer is unchanged.
Specifically, when the page state value is state 2, determining the non-change type of the target webpage as a data layer according to the page state value.
And S3023, when the page state value is a third preset value, determining that the non-change type of the target webpage is a UI layer and a data layer.
In the embodiment of the present invention, the third preset value may specifically be state 3, where state 3 indicates that the data layer and the UI layer do not need to be updated, and all use local resources.
Specifically, when the page state value is state 3, determining the non-change type of the target webpage as a UI layer and a data layer according to the page state value.
Example six
In the present embodiment, based on the second embodiment described above, as shown in fig. 6, step S303 includes steps S3031 to S3033. The specific implementation principle of each step is as follows:
s3031, when the non-change type of the target webpage is the UI layer, determining target UI resources corresponding to the UI layer in the local resources.
In the embodiment of the present invention, the local resource refers to a resource stored on the user device, and may be a computer, a mobile phone, or a tablet computer of the user. The target web page may be a web page browsed by the user, and specifically may be a specific web page browsed by the user. The non-change type refers to a type in which the contents and states of the page do not change. The UI layer refers to a portion of the application program related to the user interface, including design, layout, display, and the like of the user interface.
When the non-change type of the target webpage is the UI layer, the page state value state corresponding to the target webpage is 1. The target UI resource refers to a local UI layer resource corresponding to the UI layer of state 1 in the application program. The UI layer content and state will not change, and the application may directly use the UI layer resource corresponding to the target web page in the local resource.
In the embodiment of the invention, when the non-change type of the target webpage is the UI layer, determining the target UI resource corresponding to the UI layer in the local resources. So that the application program can be accessed quickly, and the performance of the application program is improved.
S3032, when the non-change type of the target webpage is the data layer, determining the target data resource corresponding to the data layer in the local resources.
In the embodiment of the present invention, the data layer refers to a portion related to data in an application program, including storage, processing, management, and the like of the data.
When the non-change type of the target webpage is a data layer, the state value of the page corresponding to the target webpage is 2. The target data resource refers to a local data layer resource corresponding to a data layer of state 2 in the application program. The content and the state of the data layer are not changed, and the application program can directly use the data layer resource corresponding to the target page in the local resource.
In the embodiment of the invention, when the non-change type of the target webpage is a data layer, determining a target data layer resource corresponding to the data layer in the local resource. So that the application program can quickly access the content and the performance of the application program is improved.
S3033, when the non-change type of the target webpage is the UI layer and the data layer, determining the target UI resource corresponding to the UI layer and the target data resource corresponding to the data layer in the local resources.
In the embodiment of the invention, when the non-change type of the target webpage is a UI layer and a data layer, the page state value corresponding to the target webpage is state 3. The target UI resource refers to a local UI resource corresponding to a UI layer of state 3 in the application program; the target data resource refers to a local data layer resource corresponding to a data layer with a page status value=3 in the application program.
In the embodiment of the invention, when the non-change type of the target webpage is a UI layer and a data layer, determining a target UI resource corresponding to the UI layer and determining a target data resource corresponding to the data layer in the local resources. When the UI layer and the data layer do not need to be changed, local resources can be directly used without requesting data from a server, so that the page loading speed can be improved.
Example seven
In the present embodiment, based on the second embodiment described above, as shown in fig. 7, step S304 includes steps S3041 to S3042. The specific implementation principle of each step is as follows:
s3041, when the target UI resource is determined, requesting a data update resource corresponding to the data layer from the server, and updating the target webpage based on the target UI resource and the data update resource to obtain a first display page for display.
In the embodiment of the invention, the target UI resource refers to a local UI layer resource corresponding to the UI layer of state 1 in the application program. The UI layer contents and states are not changed, and the application program can directly use the UI layer resources of the local resources.
Specifically, when the target UI resource is determined, the non-change type of the target webpage is a UI layer, and the page state value state corresponding to the target webpage is 1.state 1 indicates that the data layer needs to be updated and the UI layer is unchanged.
Specifically, when the target UI resource is determined, the page firstly loads the local resource, then requests the data update resource corresponding to the data layer from the server, the page waits before data return, the UI layer cannot be refreshed, the application program can update the data layer of the page by using the latest data until the data return, and then the UI layer is refreshed, so that the display page for updating the data can be obtained.
S3042, when the target data resource is determined, requesting UI update resources corresponding to the UI layer from the server, and updating the target webpage based on the target data resource and the UI update resources to obtain a first display page for display.
In the embodiment of the invention, the target data resource refers to a local data layer resource corresponding to a data layer of state 2 in an application program. The data layer content and state will not change, and the application program can directly use the data layer resource of the local resource.
When the target data resource is determined, the non-change type of the target webpage is a data layer, and the page state value state corresponding to the target webpage is 2.state 2 indicates that the UI layer needs to be updated and the data layer is unchanged.
Specifically, when the target data resource is determined, the page firstly loads the local resource, then the server requests the UI update resource corresponding to the UI layer, the page is replaced after the UI resource file is successfully acquired, the web page is updated, and the display page with the latest UI style is obtained after the update.
In one possible embodiment, the target UI resource may refer to a local UI resource corresponding to the UI layer of state 3 in the application; the target data resource may be a local data layer resource corresponding to a data layer with a page status value=3 in the application program. When the target UI resource and the target data resource are determined, the page loads the local resource, and then the local resource file is directly and completely used to obtain the local resource display page.
Optionally, after step S304, the method further includes:
and when the first display page is abnormal, acquiring standby data of the target page through the original.
And updating the target page based on the standby data to obtain a second display page for display.
In an embodiment of the present application, the above-mentioned native may be understood as a native code of an application program, that is, a code written in a native language (e.g., java, objective-C, etc.).
The spare data may be substitute data for use when primary data is not available. In general, the spare data should be similar, but not necessarily identical, based on the primary data. The backup data is typically used to ensure that your website or application can still function properly when primary data is not available.
In the embodiment of the application, when the first display page is abnormal, the target page can be updated by using the standby data so as to obtain a second display page for display. The second display page is created based on the alternate data and should be similar enough so that the user can continue to use the web site or application.
Example eight
In this embodiment, please refer to fig. 8, fig. 8 is a schematic diagram of a web page update structure according to an embodiment of the present application. Specifically, a web page has a plurality of modules, each module obtains json data sets through an interface, which is called json data modularization; performing physical storage in an xml mode on the local storage, wherein key is request interface url or command word, and value is returned json data; one page is in an xml file, and the xml command mode is url page address, for example: https:// workec.com/getinfo.xml,
https:// workec.com/getinfo is the web address of the profile page, xml is the xml file suffix; webview definition calls js function, setJsonData (String url, string strJson) is mainly responsible for transmitting local data to a web page, url represents a data module interface, and strJson represents a data set corresponding to the data module interface; transmitting the data to a web page through a setJsonData interface to update the page data; defining a web page callback interface getJsonData, wherein the web page callback interface is mainly responsible for being used in a scene that data needs to be acquired from a native when the web page data is abnormal, interface parameters are consistent with setJsonData, and the getJsonData interface is called after the data is acquired; the getJsonData may be considered a native active call, while the setJsonData response passively calls the getJsonData interface.
Example nine
In this embodiment, please refer to fig. 9, fig. 9 is a schematic diagram of a data storage structure according to an embodiment of the present application. Specifically, in the local resources, page resource storage and data storage are both placed in the app private directory, and from the security aspect, the external app cannot access; taking the web address url as a folder name, wherein the folder is a page resource (UI) and a data resource which are all needed by the page; the data resource is stored in an xml file, one page is stored in an xml file, and the xml command mode is url page address, for example: https:// workec.com/getinfo.xml,
https:// workec.com/getinfo is the web address of the profile page, xml is the xml file suffix; the resource files comprise html files, css files and js files; resource folders such as pictures, media, etc.; if there is an update to the data or page resource, the resource and data update is performed under the folder.
Examples ten
In this embodiment, please refer to fig. 10, fig. 10 is a schematic diagram illustrating another offline data display method according to an embodiment of the present application. Specifically, the offline data are web page offline data, and the web page offline data display method mainly comprises three schemes of offline of page UI resources, offline of page data and offline of page total; carrying out state management on each web page locally, and notifying state change by websocket; the offline requirement is to store data and UI resources in a classified manner; and providing js method callback function, wherein the method mainly comprises that web page data needs to actively acquire data to native at a time; the native main provides data to the web page; if the page data is not updated, the data acquired by the original web can be transferred to the web page; or the data is changed, the latest data is requested to be transmitted to the page by the original server to refresh the data; a page change request, when the page UI is changed, the latest UI resource is originally requested to update the page; the page refreshing mechanism needs to refresh the page no matter whether the data is changed or the UI is changed, and the refresh only partially comprises the data and the UI; rather than being time consuming as it would be for a full load.
Example eleven
Corresponding to the offline data display method shown in fig. 3, fig. 11 is a schematic diagram of an offline data display device according to an embodiment of the present application, where the device M110 includes:
a first obtaining module M1101, configured to obtain a page status value of a target web page;
a first determining module M1102, configured to determine a non-change type of the target web page according to the page status value;
a second determining module M1103, configured to determine a target resource corresponding to the non-change type from the local resources;
and the first updating module M1104 is configured to update the target web page through the target resource, so as to obtain a first display page for display.
Optionally, the first obtaining module M1101 is further configured to request a page status value of the target web page from a server, so that the server returns the page status value of the target web page.
Alternatively, referring to fig. 12, fig. 12 is a schematic structural diagram of a first determining module according to an embodiment of the present application. The first determining module M1102 includes:
a first determining submodule M11021, configured to determine that the non-change type of the target web page is a UI layer when the page status value is a first preset value;
A second determining submodule M11022, configured to determine that the non-change type of the target web page is a data layer when the page status value is a second preset value;
and a third determining submodule M11023, configured to determine that the non-change type of the target webpage is a UI layer and a data layer when the page status value is a third preset value.
Optionally, referring to fig. 13, fig. 13 is a schematic structural diagram of a second determining module according to an embodiment of the present application. The second determining module M1103 includes:
a fourth determining submodule M11031, configured to determine, when the non-change type of the target web page is a UI layer, a target UI resource corresponding to the UI layer from local resources;
a fifth determining submodule M11032, configured to determine, when the non-change type of the target web page is a data layer, a target data resource corresponding to the data layer in a local resource;
and a sixth determining submodule M11033, configured to determine, when the non-change type of the target web page is a UI layer and a data layer, a target UI resource corresponding to the UI layer and a target data resource corresponding to the data layer from local resources.
Alternatively, referring to fig. 14, fig. 14 is a schematic structural diagram of a first update module according to an embodiment of the present application. The first update module M604 includes:
A first update submodule M11041, configured to request, when the target UI resource is determined, a data update resource corresponding to a data layer from a server, and update the target web page based on the target UI resource and the data update resource, so as to obtain a first display page for display;
and the second updating sub-module M11042 is configured to request, when the target data resource is determined, a UI update resource corresponding to the UI layer from the server, and update the target web page based on the target data resource and the UI update resource, so as to obtain a first display page for display.
Optionally, referring to fig. 15, a schematic diagram of another offline data display apparatus according to an embodiment of the present application is provided, where the apparatus M110 further includes:
a second obtaining module M1105, configured to obtain, when the first display page is abnormal, standby data of the target page through a native process;
and a second updating module M1106, configured to update the target page based on the standby data, so as to obtain a second display page for display.
Example twelve
Fig. 16 is a schematic structural diagram of an electronic device according to an embodiment of the present application. As shown in fig. 16, the electronic device D16 of this embodiment includes: at least one processor D160 (only one shown in fig. 16), a memory D161, a network interface D162, and a computer program stored in the memory D161 and executable on the at least one processor D160. The processor D160 is configured to call a computer program stored in the memory D161, and perform the following steps:
Acquiring a page state value of a target webpage;
determining the non-change type of the target webpage according to the page state value;
determining a target resource corresponding to the non-change type in the local resource;
and updating the target webpage through the target resource to obtain a first display page for display.
Optionally, the acquiring the page status value of the target web page performed by the processor D160 includes:
and requesting the page state value of the target webpage from a server so that the server returns the page state value of the target webpage.
Optionally, the determining, by the processor D160, the non-change type of the target web page according to the page status value includes:
when the page state value is a first preset value, determining that the non-change type of the target webpage is a UI layer;
when the page state value is a second preset value, determining that the non-change type of the target webpage is a data layer;
and when the page state value is a third preset value, determining that the non-change type of the target webpage is a UI layer and a data layer.
Optionally, the determining, by the processor D160, the target resource corresponding to the non-change type in the local resources includes:
When the non-change type of the target webpage is a UI layer, determining a target UI resource corresponding to the UI layer in the local resources;
when the non-change type of the target webpage is a data layer, determining a target data resource corresponding to the data layer in the local resources;
and when the non-change type of the target webpage is a UI layer and a data layer, determining a target UI resource corresponding to the UI layer in the local resources, and determining a target data resource corresponding to the data layer.
Optionally, the updating, by the processor D160, the target web page through the target resource to obtain a first display page for displaying, including:
when the target UI resource is determined, requesting a data update resource corresponding to a data layer from a server, and updating the target webpage based on the target UI resource and the data update resource to obtain a first display page for display;
and when the target data resource is determined, requesting a UI update resource corresponding to the UI layer from a server, and updating the target webpage based on the target data resource and the UI update resource to obtain a first display page for display.
Optionally, after the updating the target web page by the target resource to obtain the first display page for display, the method executed by the processor D160 further includes:
when the first display page is abnormal, acquiring standby data of the target page through a native source;
and updating the target page based on the standby data to obtain a second display page for display.
The electronic device D16 provided by the embodiment of the present invention can implement each implementation manner and corresponding beneficial effects in the embodiment of the offline data display method, and in order to avoid repetition, a description is omitted here.
It should be noted that only D160-D162 is shown with components, but it should be understood that not all of the illustrated components are required to be implemented and that more or fewer components may be implemented instead. It will be understood by those skilled in the art that the electronic device herein is a device capable of automatically performing numerical calculation and/or information processing according to a preset or stored instruction.
The processor D160 may be a central processing unit (Central Processing Unit, CPU) in some embodiments, the processor D160 may also be other general purpose processors, digital signal processors (Digital Signal Processor, DSPs), application specific integrated circuits (Application Specific Integrated Circuit, ASICs), off-the-shelf programmable gate arrays (Field-Programmable Gate Array, FPGAs) or other programmable logic devices, discrete gate or transistor logic devices, discrete hardware components, or the like. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
The memory D161 may be an internal storage unit of the electronic device D16 in some embodiments, such as a hard disk or a memory of the electronic device D16. The memory D161 may also be an external storage device of the electronic device D16 in other embodiments, for example, a plug-in hard disk, a Smart Media Card (SMC), a Secure Digital (SD) Card, a Flash Card (Flash Card) or the like, which are provided on the electronic device D16. Further, the memory D161 may also include both an internal storage unit and an external storage device of the electronic device D16. The memory D161 is used to store an operating system, an application program, a boot loader (BootLoader), data, and other programs, etc., such as program codes of the computer program. The memory D161 may also be used to temporarily store data that has been output or is to be output.
The network interface D162 may include a wireless network interface or a wired network interface, and the network interface D162 is typically used to establish communication connection between the electronic device D16 and other electronic devices.
The embodiment of the application also provides a computer readable storage medium, on which a computer program is stored, which when executed by the processor D160, implements each procedure of the embodiment of the offline data display method provided by the embodiment of the application, and can achieve the same technical effect, so that repetition is avoided, and no further description is given here.
The integrated units, if implemented in the form of software functional units and sold or used as stand-alone products, may be stored in a computer readable storage medium. Based on such understanding, the present application may implement all or part of the flow of the method of the above embodiments, and may be implemented by a computer program to instruct related hardware, where the computer program may be stored in a computer readable storage medium, and when the computer program is executed by a processor, the computer program may implement the steps of each of the method embodiments described above. Wherein the computer program comprises computer program code which may be in source code form, object code form, executable file or some intermediate form etc. The computer readable medium may include at least: any entity or device capable of carrying computer program code to a photographing device/terminal apparatus, recording medium, computer Memory, read-Only Memory (ROM), random access Memory (Random Access Memory, RAM), electrical carrier signals, telecommunications signals, and software distribution media. Such as a U-disk, removable hard disk, magnetic or optical disk, etc.
The terms first, second and the like in the description and in the claims or in the above-described figures, are used for distinguishing between different objects and not necessarily for describing a sequential or chronological order. Reference herein to "an embodiment" means that a particular feature, structure, or characteristic described in connection with the embodiment may be included in at least one embodiment of the application. The appearances of such phrases in various places in the specification are not necessarily all referring to the same embodiment, nor are separate or alternative embodiments mutually exclusive of other embodiments. Those of skill in the art will explicitly and implicitly appreciate that the embodiments described herein may be combined with other embodiments.
The foregoing description of the preferred embodiments of the application is not intended to be limiting, but rather is intended to cover all modifications, equivalents, and alternatives falling within the spirit and principles of the application.

Claims (10)

1. An offline data display method, comprising the steps of:
acquiring a page state value of a target webpage;
determining the non-change type of the target webpage according to the page state value;
determining a target resource corresponding to the non-change type in the local resource;
And updating the target webpage through the target resource to obtain a first display page for display.
2. The offline data display method as claimed in claim 1, wherein the obtaining the page status value of the target web page comprises:
and requesting the page state value of the target webpage from a server so that the server returns the page state value of the target webpage.
3. The offline data display method according to claim 2, wherein the determining the non-change type of the target web page according to the page status value includes:
when the page state value is a first preset value, determining that the non-change type of the target webpage is a UI layer;
when the page state value is a second preset value, determining that the non-change type of the target webpage is a data layer;
and when the page state value is a third preset value, determining that the non-change type of the target webpage is a UI layer and a data layer.
4. The offline data display method as claimed in claim 3, wherein the determining a target resource corresponding to the non-change type from among the local resources comprises:
when the non-change type of the target webpage is a UI layer, determining a target UI resource corresponding to the UI layer in the local resources;
When the non-change type of the target webpage is a data layer, determining a target data resource corresponding to the data layer in the local resources;
and when the non-change type of the target webpage is a UI layer and a data layer, determining a target UI resource corresponding to the UI layer in the local resources, and determining a target data resource corresponding to the data layer.
5. The offline data display method as claimed in claim 4, wherein the updating the target web page through the target resource to obtain a first display page for display includes:
when the target UI resource is determined, requesting a data update resource corresponding to a data layer from a server, and updating the target webpage based on the target UI resource and the data update resource to obtain a first display page for display;
and when the target data resource is determined, requesting a UI update resource corresponding to the UI layer from a server, and updating the target webpage based on the target data resource and the UI update resource to obtain a first display page for display.
6. The offline data display method according to claim 1, wherein after the updating of the target web page by the target resource to obtain the first display page for display, the method further comprises:
When the first display page is abnormal, acquiring standby data of the target page through a native source;
and updating the target page based on the standby data to obtain a second display page for display.
7. An offline data display device, comprising:
the first acquisition module is used for acquiring a page state value of the target webpage;
the first determining module is used for determining the non-change type of the target webpage according to the page state value;
the second determining module is used for determining a target resource corresponding to the non-change type in the local resources;
and the first updating module is used for updating the target webpage through the target resource to obtain a first display page for display.
8. An offline data display system, characterized in that the system comprises a service end and an APP end, the APP end comprising the offline data display device according to claim 7.
9. An electronic device comprising a memory, a processor and a computer program stored in the memory and capable of running on the processor, characterized in that the processor implements an off-line data display method according to any one of claims 1 to 6 when executing the computer program.
10. A computer readable storage medium storing a computer program, wherein the computer program when executed by a processor implements an offline data display method according to any one of claims 1 to 6.
CN202310684897.3A 2023-06-09 2023-06-09 Offline data display method and device, electronic equipment and readable storage medium Pending CN117112940A (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202310684897.3A CN117112940A (en) 2023-06-09 2023-06-09 Offline data display method and device, electronic equipment and readable storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202310684897.3A CN117112940A (en) 2023-06-09 2023-06-09 Offline data display method and device, electronic equipment and readable storage medium

Publications (1)

Publication Number Publication Date
CN117112940A true CN117112940A (en) 2023-11-24

Family

ID=88795464

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202310684897.3A Pending CN117112940A (en) 2023-06-09 2023-06-09 Offline data display method and device, electronic equipment and readable storage medium

Country Status (1)

Country Link
CN (1) CN117112940A (en)

Similar Documents

Publication Publication Date Title
US9565265B2 (en) Method and apparatus for automatically optimizing the loading of images in a cloud-based proxy service
US8527862B2 (en) Methods for making ajax web applications bookmarkable and crawlable and devices thereof
CN101147145B (en) Embedded web-based management method
US8868637B2 (en) Page rendering for dynamic web pages
US9298747B2 (en) Deployable, consistent, and extensible computing environment platform
US8255921B2 (en) Method and apparatus that enables a web-based client-server application to be used offline
US20050108418A1 (en) Method and system for updating/reloading the content of pages browsed over a network
US20070033290A1 (en) Normalization and customization of syndication feeds
KR20090073199A (en) Offline execution of web based applications
CN112559927B (en) Webpage loading method and device
US9088462B2 (en) Common web accessible data store for client side page processing
US8856365B2 (en) Computer-implemented method, computer system and computer readable medium
US20040267900A1 (en) Dynamic mobile device characterization
US20130268831A1 (en) Method, device, and system for acquiring start page
US8874687B2 (en) System and method for dynamically modifying content based on user expectations
KR20060080180A (en) Method of caching data assets
CN112926002A (en) Service request processing method and device
US20170147543A1 (en) Enabling legacy web applications for mobile devices
CN117112940A (en) Offline data display method and device, electronic equipment and readable storage medium
CN112783548B (en) Access method and device of network system
CN107103001B (en) Method, device and system for acquiring target front-end resource file based on browser
US7509433B1 (en) Selecting quick-to-download content through an alternative hypertext protocol
US9223758B1 (en) Determining a language encoding data setting for a web page, and applications thereof
CN107451182B (en) File caching method based on Appcache
CN117411847B (en) Mail out-link picture transfer method, system and medium

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