WO2020211379A1 - 网页页面加载方法、装置、计算机设备及存储介质 - Google Patents

网页页面加载方法、装置、计算机设备及存储介质 Download PDF

Info

Publication number
WO2020211379A1
WO2020211379A1 PCT/CN2019/119655 CN2019119655W WO2020211379A1 WO 2020211379 A1 WO2020211379 A1 WO 2020211379A1 CN 2019119655 W CN2019119655 W CN 2019119655W WO 2020211379 A1 WO2020211379 A1 WO 2020211379A1
Authority
WO
WIPO (PCT)
Prior art keywords
menu
loading
address
target
menu item
Prior art date
Application number
PCT/CN2019/119655
Other languages
English (en)
French (fr)
Inventor
陈林
丁磊磊
Original Assignee
平安科技（深圳）有限公司
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 平安科技（深圳）有限公司 filed Critical 平安科技（深圳）有限公司
Publication of WO2020211379A1 publication Critical patent/WO2020211379A1/zh

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/954—Navigation, e.g. using categorised browsing
    • Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
    • Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
    • Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
    • Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management

Definitions

  • This application relates to the field of computer technology, and in particular to a method, device, computer equipment, and storage medium for loading web pages.
  • AngularJS is a front-end MVC framework based on JavaScript. It is mainly used for the development of dynamic applications. It can effectively simplify the complexity of the development process and improve the efficiency of testing and development. Through AngularJS, multi-view single-page applications can be realized.
  • a single-page application refers to a web-based application or website. When the single-page interacts with the user, when the user clicks an object or button, it will not jump to other pages.
  • AngularJS routing is generally written in the js file of the main framework (that is, the routing is written in the code), and cannot be configured dynamically, and the menu and routing are in one-to-one correspondence (that is, different menus correspond to different Route), when you need to add, delete, or modify the menu, you usually need to frequently modify the js file of the main frame, so the flexibility is poor.
  • the main purpose of this application is to provide a web page loading method, device, computer equipment, and storage medium.
  • the web page loading method can dynamically configure menus. When menus need to be added, deleted, or modified, there is no need to modify the js file of the main frame, which improves flexibility. Sex.
  • this application proposes a web page loading method, including:
  • the menu content corresponding to the target menu item is loaded in response to the menu content access request.
  • This application also proposes a web page loading device, including:
  • the data processing module is used to generate the application interface containing the menu list according to the pre-stored menu data, and to load the routing of each menu item in the menu list;
  • the judgment module is used to receive the user's request for accessing the menu content of the target menu item, and to determine whether the menu item has completed the route loading, wherein the menu item includes the target menu item;
  • the loading module is used to respond to the menu content access request when the target menu item has finished loading the route, and load the menu content corresponding to the target menu item.
  • This application also proposes a computer device including a memory and a processor, the memory stores a computer program, and the processor implements the steps of any one of the above methods when the computer program is executed.
  • the present application also proposes a computer-readable storage medium on which a computer program is stored, and when the computer program is executed by a processor, the steps of any one of the above methods are implemented.
  • the web page loading method realizes the separation of logic and data by pre-storing the menu data in the database.
  • the menu data is asynchronously obtained from the database, and the menu is generated according to the obtained menu data.
  • the application interface of the list and at the same time, load each menu item in the menu list according to the menu data.
  • the target menu item completes the route loading, it can respond to the user’s request for access to the menu content of the target menu item and load
  • Corresponding menu content when you need to add, delete, or modify menus, you only need to maintain the menu data in the back-end database, without modifying the js file of the main framework, so that developers can focus on each item during the front-end development process.
  • the code of the menu function itself realizes the dynamic configuration of the menu and improves the flexibility.
  • Fig. 1 is a schematic flowchart of a web page loading method in an implementation of this application
  • FIG. 2 is a schematic diagram of the structure of a web page loading device in an implementation of the present application
  • Figure 3 is a schematic diagram of the structure of a data processing module in an implementation of this application.
  • FIG. 4 is a schematic diagram of the structure of a judgment module in an implementation of the present application.
  • FIG. 5 is a schematic diagram of the structure of a judgment module in another implementation of the present application.
  • Figure 6 is a schematic diagram of the structure of a loading module in an implementation of the present application.
  • FIG. 7 is a schematic structural diagram of a web page loading device in another implementation of the present application.
  • Fig. 8 is a schematic diagram of a framework page of AngularJS in an implementation of this application.
  • Fig. 9 is a schematic diagram of the structure of a computer device in an implementation of the present application.
  • a web page loading method of the present application is applicable to the situation of loading web pages in a single page application.
  • the method can be executed by a web page loading device, which can be implemented by hardware and/or It is composed of software and can generally be integrated in all intelligent terminal devices that include Web front-end system development functions.
  • the method includes:
  • S12 Receive a user's request for accessing menu content of the target menu item, and determine whether the target menu item has completed the route loading, where the menu item includes the target menu item;
  • the pre-stored menu data is the data corresponding to the information of the menu item stored in the database.
  • the menu item is "personal management”
  • the pre-stored menu data is stored in the database and related to "personal management”
  • the main function of the data corresponding to the information is to show the user the layout and page content of the application interface (that is, the menu items contained in the application interface and the menu content corresponding to each menu item), specifically, when the page load is triggered
  • the web page loading device will asynchronously obtain the menu data from the database and load the menu data to generate an application interface containing the menu list and load routing for each menu item in the menu list
  • the display interface of the front end can be rendered according to the menu data to generate an application interface containing a menu list, and the menu items are routed and loaded according to the menu data.
  • the purpose is to load the menu items in the menu list.
  • Each menu item is configured with the corresponding route.
  • the menu content corresponding to the menu item can be loaded by the route jump.
  • the menu list contains "device management” and For the two menu items of "personnel management", you need to configure the corresponding routing for these two menu items.
  • the menu content corresponding to "device management” and the corresponding "personnel management” can be loaded on the front-end application interface. "The content of the menu.
  • the user can click on the target menu item and enter the menu address corresponding to the target menu item (for example, enter the menu address corresponding to the target menu item in the web address input field of the browser) according to their own needs.
  • the menu content corresponding to the target menu item that is, the menu content access request can be issued by clicking the target menu item, entering the link address corresponding to the target menu item, etc., because accessing the menu content corresponding to the target menu item needs to be completed by a route jump, Therefore, when the web page loading device receives the menu content access request, it needs to determine whether the route corresponding to the menu item has been loaded. Specifically, different events will be triggered at different stages during the loading process of the menu item routing. Therefore, the route loading completion event can be monitored by setting a listener for these events. When the route loading completion event is monitored through the listener, the web page loading device can determine that the target menu item has completed the route loading based on this.
  • the web page loading device can immediately respond to the user's menu content access request, and jump to the menu item selected by the user (that is, the target menu item). Go to the route corresponding to the target menu item, and then use the route to obtain the menu content corresponding to the target menu item from the database for loading. For example, the user needs to access the menu content corresponding to the menu item "Personnel Management" (that is, the target menu at this time).
  • the item is "personnel management"
  • the web page loading device can jump to the route corresponding to the menu item "personnel management” accordingly, and obtain it from the database through the route
  • the corresponding menu content is then loaded onto the application interface for display, thereby loading the web page corresponding to the menu item "Personnel Management”.
  • the web page loading method realizes the separation of logic and data by pre-storing the menu data in the database.
  • the menu data is obtained asynchronously from the database and based on the obtained menu data.
  • Generate an application interface containing a menu list and at the same time load each menu item in the menu list according to the menu data, so that when the target menu item completes the route loading, it can respond to the user's menu content access request for the target menu item , Load the corresponding menu content, when you need to add, delete or modify the menu, you only need to maintain the menu data in the backend database, without modifying the js file of the main frame, so that developers can focus more on the front-end development process
  • the code of each menu function is used to realize the dynamic configuration of the menu and improve the flexibility.
  • the step of generating an application interface containing a menu list based on pre-stored menu data includes:
  • S11A Obtain pre-stored menu data from the target database and load the frame page, where the menu data includes the menu name and menu icon;
  • the frame page is rendered according to the menu name and menu icon to obtain the application interface.
  • the menu data may be stored in the background server or cached in the front-end memory (such as browser memory).
  • the web page loading device will call the preset link Address (ie URL), the corresponding menu data is queried from the backend server through the link address, and then saved in the front-end memory, so that when the page is loaded again later, the web page loading device will first check whether the front-end memory is The menu data already exists. If the menu data already exists in the front-end memory, there is no need to call the preset link address to obtain the menu data in the back-end server.
  • the web page loading device will asynchronously load the menu data from the target database (front-end memory or back-end server) while performing the frame page For subsequent operations.
  • the menu data includes multiple menu items and the name and icon corresponding to each menu item.
  • the menu data can be traversed through the angular.forEach method in AngularJS to obtain each menu item in the menu data Corresponding name and icon, and then assign the menu name to the corresponding menu icon through the assignment display operation of the menu item, so as to obtain the menu list.
  • the frame page is a static page, so it will be loaded in advance, and when the menu list is obtained, the application interface containing the menu list displayed to the user can be obtained by rendering the menu list to the designated area of the frame page, as shown in Figure 8.
  • the frame page of AngularJS includes three parts: the header area 100, the menu bar display area 200, and the menu content display area 300. Therefore, in the generated application interface, the user can view in the menu display area 200 Each menu item in the menu list.
  • the frame page of AngularJS is a static page, it can be loaded in advance, and then the menu item and corresponding menu content can be loaded later. Compared with the conventional technical means of synchronous loading of the traditional frame page and menu, Can save page loading time.
  • the menu data further includes the routing address, template address, and menu controller corresponding to each menu item.
  • the step of loading each menu item in the menu list includes:
  • S11a Associate the routing address, the template address and the menu controller to establish a mapping relationship between the routing address, the template address and the menu controller;
  • the menu data also includes the routing address, template address, and menu controller corresponding to each menu item.
  • the menu data can be traversed through the angular.forEach method in AngularJS to obtain each item in the menu data.
  • the routing address, template address and menu controller corresponding to the menu item are then associated with the routing address, template address, and menu controller through the built-in $routeProvider of AngularJS (i.e. routing provider, a built-in service for configuring routing) to establish Create a one-to-one mapping relationship between the three, and then bind the associated routing address, template address, and menu controller with the corresponding menu item, so as to realize the routing configuration of each menu item.
  • routing provider i.e. routing provider, a built-in service for configuring routing
  • the routing address can be Presented in the form of a hash value; specifically, in the embodiment of the present application, the menu data can be traversed through the following code to obtain the menu name, menu icon, routing address, template address, and menu controller corresponding to each menu item :
  • controller menuObj.controller
  • S12B is executed to determine that the target menu item has completed the route loading.
  • the link address used to query the menu data can be set in the routing provider in advance.
  • the link address can be called by the routing provider, and the routing provider can then use the The link address queries the corresponding menu data from the backend server, and then saves it in the front-end memory. Since the menu data is loaded and the frame page is loaded at the same time, the routing provider queries the menu data and the main controller loads the frame page at the same time. Yes, when the routing provider queries the menu data, the routing provider will load each menu item at the same time (that is, configure the routing for each menu item). When all the menu items have been loaded, the router provider A broadcast notification of "route loading complete" will be sent to the main controller. When the main controller listens to the broadcast notification, it can determine that the target menu item has finished loading the route, and then enter S13 for related operations.
  • the preset global variable is set to true. At this time, it can be judged whether the target menu item has completed the route loading by the following methods:
  • a variable can be set in the global scope in advance and defined as a global variable.
  • the global variable can be set to true (ie "true") through the route provider, and then before the main controller opens the monitoring function to monitor the route loading completion event, the main controller can first determine the Whether the global variable is true (true), if the global variable is true, it means that all the menu items have completed the route loading, and the main controller can directly jump to the route based on this, without having to open the monitor to receive the route offer.
  • the main controller can turn on the monitoring function accordingly to monitor the route loading completion event; Therefore, before the monitoring function of the main controller is enabled, the main controller can first determine whether the global variable is true, which can avoid the occurrence of the aforementioned situation, thereby improving the efficiency of page loading.
  • the menu content access request includes a routing address
  • the step of loading the menu content corresponding to the target menu item includes:
  • S132 Query the content of the menu corresponding to the template address from the target database according to the template address;
  • S133 Render the menu content into the designated display area of the application interface, and load the menu content corresponding to the target menu item.
  • step S131 when the routing of each menu item is loaded through the routing provider, the routing jump can be performed through the main controller. Specifically, since each menu item has its corresponding routing address and template There is a one-to-one mapping between the address and the menu controller, and the routing address, template address, and menu controller. Therefore, the main controller can determine the corresponding menu control according to the routing address in the menu content access request And the address of the template. At this time, step S132 can be entered.
  • step S132 when the corresponding menu controller and template address are determined, the menu controller can be handed over to execute the process of loading menu content. Specifically, the menu controller calls the template address from the target database (back-end server or front-end memory). ) To query the menu content corresponding to the template address, and then fill the obtained menu content on the view page pre-bound with the menu controller, and combine it into an html file that the user can actually see, and then enter Step S133.
  • the target database back-end server or front-end memory
  • step S133 specifically, after the html file is obtained, the menu content of the corresponding menu item can be loaded by rendering it into the designated display area of the application interface, thereby realizing the loading of the web page, wherein the designated display area Display area for menu content.
  • the aforementioned web page loading method further includes:
  • S15 Select the designated routing address according to the historical visit record, where the designated route address is the route address that appears most frequently in the historical visit record;
  • a default routing address is generally set through AngularJS's $urlRouterProvider (in AngularJS, $urlRouterProvider is a built-in service that can be used to set default routing).
  • the system will automatically load the default page according to the default routing address (generally the default page is the home page), and then the user can access the corresponding menu content by clicking on the menu item, etc.
  • the user needs for different menu items are The difference is that if the default page is not the page that the user needs, the user needs to access the required menu content by clicking menu items, which is not conducive to improving the user experience. Therefore, it is necessary to improve this situation.
  • the web page loading device can obtain the history access records of menu content access requests at regular intervals (that is, the preset time interval), and then learn the user needs for different menu items according to the routing address in the historical access request For example, a certain routing address appears the most times in historical access records, and since each menu item has its corresponding routing address, it can be inferred from this that the user has the greatest demand for the menu item corresponding to the routing address.
  • the preset time can be set by the user according to the actual situation, or it can be the default setting of the system and cannot be changed.
  • the preset time can be One day, two days, three days, etc., as long as it can meet the requirements of use, there is no specific restriction on this.
  • an embodiment of the present application also proposes a web page loading device, including:
  • the data processing module 11 is used to generate an application interface containing a menu list according to the pre-stored menu data, and to load each menu item in the menu list by routing;
  • the judging module 12 is used to receive a user's request for accessing menu content of a target menu item, and to determine whether the target menu item has completed the route loading, wherein the menu item includes the target menu item;
  • the loading module 13 is used to respond to the menu content access request when the target menu item has finished loading the route, and load the menu content corresponding to the target menu item.
  • the pre-stored menu data is the data corresponding to the information of the menu item stored in the database.
  • the menu item is "personal management”
  • the pre-stored menu data is stored in the database and "personal management”
  • Data corresponding to related information its main function is to show the user the layout of the application interface and page content (that is, the menu items contained in the application interface and the menu content corresponding to each menu item), specifically, when the trigger is turned on
  • the data processing module 11 will asynchronously obtain the menu data from the database and load the menu data to generate the application interface containing the menu list and route each menu item in the menu list
  • the data processing module 11 renders the front-end display interface according to the menu data to generate an application interface containing the menu list, and the data processing module 11 routes the menu items according to the menu data
  • the purpose of loading is to configure the corresponding route for each menu item in the menu list.
  • the menu content corresponding to the menu item can be loaded through the route jump, for example ,
  • the menu list contains the two menu items "device management” and "personnel management", you need to configure the corresponding routing for these two menu items.
  • the corresponding "device management” can be loaded on the front-end application interface.
  • the user can click on the target menu item and enter the menu address corresponding to the target menu item (for example, enter the menu address corresponding to the target menu item in the web address input field of the browser) according to their own needs.
  • Access to the menu content corresponding to the target menu item that is, the menu content access request can be issued by clicking the target menu item, entering the link address corresponding to the target menu item, etc., because accessing the menu content corresponding to the target menu item needs to be completed by a route jump Therefore, when the webpage page loading device receives the menu content access request, it needs to determine whether the route corresponding to the menu item has been loaded through the judgment module 12, specifically, because the menu item is loaded at different stages in the routing process Different events will be triggered. Therefore, you can set up listeners for these events to monitor the route loading completion event. When the judgment module 12 monitors the route loading completion event through the listener, the judgment module 12 can judge that the target menu item has been Complete the loading of the route.
  • the loading module 13 can immediately respond to the user's menu content access request, and jump to the menu item selected by the user (that is, the target menu item). Go to the route corresponding to the target menu item, and then use the route to obtain the menu content corresponding to the menu item from the database and load it. For example, the user needs to access the menu content corresponding to the menu item "Personnel Management" (that is, the target menu at this time).
  • the loading module 13 can jump to the route corresponding to the menu item "personnel management" according to this, and use the route to get from the database Obtain the corresponding menu content in the, and then load the menu content to the application interface for display, thereby loading the web page corresponding to the menu item "personnel management".
  • the webpage page loading device realizes the separation of logic and data by pre-storing the menu data in the database.
  • the menu data is asynchronously obtained from the database and based on the obtained menu data.
  • Generate an application interface containing a menu list and at the same time load each menu item in the menu list according to the menu data, so that when the target menu item completes the route loading, it can respond to the user's menu content access request for the target menu item , Load the corresponding menu content, when you need to add, delete or modify the menu, you only need to maintain the menu data in the backend database, without modifying the js file of the main frame, so that developers can focus more on the front-end development process
  • the code of each menu function is used to realize the dynamic configuration of the menu and improve the flexibility.
  • the data processing module 11 includes:
  • the obtaining unit 11A is configured to obtain pre-stored menu data from the target database and load the frame page, where the menu data includes a menu name and a menu icon;
  • the rendering unit 11B is used to render the frame page according to the menu name and menu icon to obtain an application interface.
  • the menu data may be stored in the background server or cached in the front-end memory (such as browser memory).
  • the obtaining unit 11A will call the preset link Address (ie URL), the corresponding menu data is queried from the back-end server through the link address, and then saved in the front-end memory, so that when the page is loaded again later, the acquiring unit 11A will first check whether the front-end memory is already There is menu data. If the menu data already exists in the front-end memory, there is no need to call the preset link address to obtain the menu data in the back-end server.
  • the acquisition unit 11A will asynchronously load the menu data from the target database (front-end memory or back-end server) and load the frame page at the same time For subsequent operations.
  • the menu data includes multiple menu items and the name and icon corresponding to each menu item.
  • the acquiring unit 11A can traverse the menu data through the angular.forEach method in AngularJS to obtain the menu data.
  • the name and icon corresponding to each menu item and then assign the menu name to the corresponding menu icon through the assignment display operation of the menu item, so as to obtain the menu list.
  • the AngularJS frame page is a static page, so it will be loaded in advance, and then when the menu list is obtained, the menu list can be rendered to the designated area of the frame page through the rendering unit 11B to obtain the menu list displayed to the user
  • the application interface as shown in Figure 8, generally, the AngularJS frame page includes three parts: head area 100, menu bar display area 200 and menu content display area 300, so in the generated application interface, the user can In the menu display area 200, each menu item in the menu list can be viewed.
  • the frame page of AngularJS is a static page, it can be loaded in advance, and then the menu item and corresponding menu content can be loaded later. Compared with the conventional technical means of synchronous loading of the traditional frame page and menu, Can save page loading time.
  • the menu data further includes the routing address, template address, and menu controller corresponding to each menu item, and the data processing module 11 also includes:
  • the associating unit 11a is used to associate the routing address, the template address and the menu controller to establish a mapping relationship between the routing address, the template address and the menu controller;
  • the binding unit 11b is configured to bind the associated routing address, template address, and menu controller with the corresponding menu item.
  • the menu data also includes the routing address, template address, and menu controller corresponding to each menu item.
  • the obtaining unit 11A can traverse the menu data through the angular.forEach method in AngularJS to obtain the menu data
  • the controller associates, establishes a one-to-one mapping relationship between the three, and then binds the associated routing address, template address, and menu controller with the corresponding menu item through the binding unit 11b, so as to realize the The routing configuration of the menu item, where the routing address can be presented in the form of a hash value; specifically, in the embodiment of the present application, the obtaining unit 11A can traverse the menu data through the following code to obtain the menu corresponding to each menu item Name, menu icon, routing address, template address and menu controller:
  • controller menuObj.controller
  • the judgment module 12 includes:
  • the first judging unit 12A is used to judge whether a broadcast notification of the completion of route loading is received
  • the first determining unit 12B is configured to determine that the target menu item has completed the route loading when the broadcast notification of the completion of the route loading is received.
  • the link address used to query the menu data can be set in the routing provider in advance.
  • the obtaining unit 11A can call the link address through the routing provider to provide routing
  • the router queries the corresponding menu data from the background server according to the link address, and then saves it in the front-end memory. Since the menu data and the frame page are loaded at the same time, the routing provider queries the menu data and the main controller loads the frame page. It is also carried out at the same time.
  • the routing loading unit 11a can load each menu item through the routing provider at the same time (that is, configure the routing for each menu item).
  • the router provider After all items have been loaded, the router provider will send a "route loading complete" broadcast notification to the main controller.
  • the first judging unit 12A can determine the main The controller receives the broadcast notification that the route loading is completed, and the first determining unit 12B can determine that the target menu item has completed the route loading based on this, and the loading module 13 can perform related operations at this time.
  • the judgment module 12 includes:
  • the second judgment unit 12a is used to judge whether the global variable is true
  • the second judging unit 12b is used for judging that the target menu item has finished loading the route when the global variable is true.
  • a variable can be set in the global scope in advance and defined as a global variable.
  • the global variable can be set to true (ie "true") through the routing provider, and before the main controller turns on the monitoring function to monitor the routing loading completion event, the second judgment unit 12a can pass the main The controller first judges whether the global variable is true.
  • the second judging unit 12b can judge that the target menu item has completed the route loading based on this, and the main controller can directly carry out routing according to this
  • the second determination unit 12b can determine that the target menu item has not completed the route loading based on this, without the need to turn on monitoring to receive the "route loading complete" broadcast notification sent by the routing provider; if the global variable is not true, At this time, the main controller can turn on the monitoring function based on this to monitor the route loading completion event; therefore, before the main controller has turned on the monitoring function, the main controller can first determine whether the global variable is true, so as to avoid the occurrence of the aforementioned situation , Which helps to improve the efficiency of page loading.
  • the menu content access request includes a routing address
  • the loading module 13 includes:
  • the determining unit 131 is configured to determine the menu controller and template addresses corresponding to the routing address according to the routing address;
  • the query unit 132 is configured to query the menu content corresponding to the template address from the target database according to the template address;
  • the loading unit 133 is configured to render the menu content into the designated display area of the application interface, and load the menu content corresponding to the target menu item.
  • the routing jump can be performed through the main controller.
  • the template address and the menu controller, and the routing address, template address, and menu controller have a one-to-one mapping relationship. Therefore, the determining unit 131 can determine the routing address in the menu content access request through the main controller.
  • the corresponding menu controller and template address can be handed over to the query unit 132 to perform related operations at this time.
  • the menu controller can be handed over to the menu controller to execute the process of loading the menu content.
  • the query unit 132 can call the template address through the menu controller. , And then query the menu content corresponding to the template address from the target database (back-end server or front-end memory) according to the template address, and then the query unit 132 fills the obtained menu content into the view page pre-bound with the menu controller.
  • the target database back-end server or front-end memory
  • the query unit 132 obtains the html file, it can be rendered into the designated display area of the application interface through the loading unit 133 to load the menu content of the corresponding menu item, thereby realizing a web page Loading, where the designated display area is the menu content display area.
  • the aforementioned web page page loading device further includes:
  • the obtaining module 14 is used to obtain historical access records of menu content access requests at intervals of a preset time;
  • the selection module 15 is used to select the designated routing address according to the historical access records, where the designated routing address is the routing address that appears most frequently in the historical access records;
  • the setting module 16 is used to set the designated routing address as the default routing address.
  • a default routing address is generally set through AngularJS's $urlRouterProvider.
  • the system automatically loads the default page according to the default routing address (generally default The page is the home page), and then the user can access the corresponding menu content by clicking on the menu item, etc., but because the user’s requirements for different menu items are different, if the default page is not the page that the user needs, the user needs to go through Clicking on the menu item or other methods to access the required menu content is not conducive to improving the user experience. Therefore, it is necessary to improve this situation.
  • the acquisition module 14 can pass a certain period of time (that is, the interval preview).
  • the selection module 15 can learn the user's usage requirements for different menu items according to the routing address in the historical access request, for example, a certain routing address appears the most times in the historical access record , And since each menu item has its corresponding routing address, the selection module 15 can infer from this that the user has the greatest demand for the menu item corresponding to the routing address, and then the setting module 16 can use the $urlRouterProvider of AngularJS.
  • the routing address is set as the default routing address, so that when subsequent users log in to the page again, the system will automatically load the corresponding page according to the modified default routing address, and the menu content displayed on this page is largely what users need to access , So as to help improve the user experience; among them, the preset time can be set by the user according to the actual situation, or it can be set by the system default and cannot be changed. For example, the preset time can be one day, two days, three days, etc. , As long as it can meet the requirements of use, there is no specific restriction on this.
  • an embodiment of the present application also provides a computer device.
  • the computer device may be a server, and its internal structure may be as shown in FIG. 9.
  • the computer equipment includes a processor, a memory, a network interface and a database connected through a system bus. Among them, the computer designed processor is used to provide calculation and control capabilities.
  • the memory of the computer device includes a readable storage medium and an internal memory.
  • the readable storage medium may be volatile or non-volatile.
  • the readable storage medium stores an operating system, a computer program, and a database.
  • the internal memory provides an environment for the operation of the operating system and computer programs in the readable storage medium.
  • the database of the computer device is used to store data such as web page loading methods.
  • the network interface of the computer device is used to communicate with an external terminal through a network connection.
  • the computer program executes the processes of the above-mentioned method embodiments.
  • FIG. 9 is only a block diagram of a part of the structure related to the solution of the present application, and does not constitute a limitation on the computer device to which the solution of the present application is applied.
  • An embodiment of the present application also provides a computer-readable storage medium on which a computer program is stored, and when the computer program is executed, it executes the processes of the above-mentioned method embodiments.
  • a computer program is stored, and when the computer program is executed, it executes the processes of the above-mentioned method embodiments.
  • the above are only the preferred embodiments of this application, and do not limit the scope of this application. Any equivalent structure or equivalent process transformation made using the content of this application description and drawings, or directly or indirectly applied to other related The technical field is equally included in the scope of patent protection of this application.

Landscapes

  • Engineering & Computer Science (AREA)
  • Databases & Information Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Radar, Positioning & Navigation (AREA)
  • Remote Sensing (AREA)
  • Data Mining & Analysis (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本申请揭示了一种网页页面加载方法、装置、计算机设备及存储介质，其中，网页页面加载方法，包括：根据预存的菜单数据生成含有菜单列表的应用界面，并对菜单列表中的各个菜单项进行路由的加载；接收用户针对目标菜单项的菜单内容访问请求，并判断目标菜单项是否已完成路由的加载；若目标菜单项已完成路由的加载，则响应菜单内容访问请求，加载出对应目标菜单项的菜单内容。该网页页面加载方法可动态配置菜单，当需要增删改菜单时，无需修改主框架的js文件，提高了灵活性。

Description

网页页面加载方法、装置、计算机设备及存储介质
本申请要求于2019年4月16日提交中国专利局、申请号为201910305172.2，发明名称为“网页页面加载方法、装置、计算机设备及存储介质”的中国专利申请的优先权，其全部内容通过引用结合在本申请中。
技术领域
本申请涉及计算机技术领域，特别是涉及到一种网页页面加载方法、装置、计算机设备及存储介质。
 背景技术
AngularJS是一款基于JavaScript的前端MVC框架，主要用于动态应用程序的开发工作，能有效的简化开发过程的复杂度，提高测试和开发效率，通过 AngularJS可以实现多视图的单页面应用，而所谓单页面应用是指一种基于Web的应用或者网站，这种单页面在与用户交互的时候，当用户点击某个物件或者按键的时候不会跳转到其他的页面。
其中，在单页面应用的开发中，路由是前端构建单页面应用必不可少的组成部分，通过AngularJS路由，用户可通过不同的 URL（Uniform Resource Locator，统一资源定位符）访问不同的内容，实现单页面跳转。
然而AngularJS的路由一般都是写在主框架的js文件中的（即路由是写在代码中的），无法动态进行配置，而菜单与路由又是一一对应的关系（即不同的菜单对应不同的路由），当需要增删改菜单时，通常需要频繁地修改主框架的js文件，因此灵活性较差。
 技术问题
本申请的主要目的为提供一种网页页面加载方法、装置、计算机设备及存储介质，该网页页面加载方法可动态配置菜单，当需要增删改菜单时，无需修改主框架的js文件，提高了灵活性。
 技术解决方案
为了实现上述申请目的，本申请提出一种网页页面加载方法，包括：
根据预存的菜单数据生成含有菜单列表的应用界面，并对菜单列表中的各个菜单项进行路由的加载；
接收用户针对目标菜单项的菜单内容访问请求，并判断目标菜单项是否已完成路由的加载，其中，菜单项包括目标菜单项；
若目标菜单项已完成路由的加载，则响应菜单内容访问请求，加载出对应目标菜单项的菜单内容。
本申请还提出了一种网页页面加载装置，包括：
数据处理模块，用于根据预存的菜单数据生成含有菜单列表的应用界面，并对菜单列表中的各个菜单项进行路由的加载；
判断模块，用于接收用户针对目标菜单项的菜单内容访问请求，并判断菜单项是否已完成路由的加载，其中，菜单项包括目标菜单项；
加载模块，用于当目标菜单项已完成路由的加载时，响应菜单内容访问请求，加载出对应目标菜单项的菜单内容。
本申请还提出了一种计算机设备，包括存储器和处理器，所述存储器中存储有计算机程序，所述处理器执行所述计算机程序时实现上述任一项所述方法的步骤。
本申请还提出了一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任一项所述方法的步骤。
 有益效果
本申请提供的网页页面加载方法通过将菜单数据预存于数据库中，实现了逻辑与数据的分离，当进行页面加载时，通过从数据库中异步获取菜单数据，并根据获取到的菜单数据生成含有菜单列表的应用界面，同时根据菜单数据对菜单列表中的各个菜单项进行路由的加载，这样，当目标菜单项完成路由的加载时，即可响应用户针对目标菜单项的菜单内容访问请求，加载出对应的菜单内容，当需要增删改菜单时，只需对后台数据库中的菜单数据进行维护即可，而无需修改主框架的js文件，使得开发人员在前端开发过程中，可更专注于每个菜单功能自身的代码，从而实现了菜单的动态配置，提高了灵活性。
 附图说明
图1是本申请一实施中网页页面加载方法的流程示意图；
图2是本申请一实施中网页页面加载装置的结构示意图；
图3是本申请一实施中数据处理模块的结构示意图；
图4是本申请一实施中判断模块的结构示意图；
图5是本申请另一实施中判断模块的结构示意图；
图6是本申请一实施中加载模块的结构示意图；
图7是本申请另一实施中网页页面加载装置的结构示意图；
图8是本申请一实施中AngularJS的框架页面示意图；
图9是本申请一实施中计算机设备的结构示意图。
 本发明的最佳实施方式
应当理解，此处所描述的具体实施例仅仅用以解释本申请，并不用于限定本申请。
参照图1，本申请一种网页页面加载方法，可适用于在单页面应用中进行网页页面的加载的情况，该方法可以由网页页面加载装置来执行，该网页页面加载装置可由硬件和/或软件组成，且一般可集成在所有包含Web前端系统开发功能的智能终端设备中，该方法包括：
S11，根据预存的菜单数据生成含有菜单列表的应用界面，并对菜单列表中的各个菜单项进行路由的加载；
S12，接收用户针对目标菜单项的菜单内容访问请求，并判断目标菜单项是否已完成路由的加载，其中，菜单项包括目标菜单项；
若是，则执行S13，响应菜单内容访问请求，加载出对应目标菜单项的菜单内容。
在上述步骤S11中，预存的菜单数据为存储在数据库中与菜单项的信息相对应的数据，例如菜单项为“人员管理”，则预存的菜单数据为存储在数据库中与“人员管理”相关的信息所对应的数据，其主要作用在于向用户展示应用界面的布局及页面内容（即应用界面中所含有的菜单项以及各个菜单项所对应的菜单内容），具体地，当触发开启页面加载时（如通过登录页面进行触发），网页页面加载装置将从数据库中异步获取菜单数据并进行菜单数据的加载，以生成含有菜单列表的应用界面以及对菜单列表中的各个菜单项进行路由的加载，其中，在菜单数据加载的过程中，根据菜单数据对前端的显示界面进行渲染可生成含有菜单列表的应用界面，而根据菜单数据对菜单项进行路由的加载，其目的在于为菜单列表中的各个菜单项配置对应的路由，当某个菜单项配置好对应的路由后，后续才能通过路由的跳转加载出与该菜单项相对应的菜单内容，例如，菜单列表中含有“设备管理”和“人员管理”这两个菜单项，则需要为这两个菜单项配置对应的路由，路由配置好后，在前端的应用界面上才能加载出对应“设备管理”的菜单内容和对应“人员管理”的菜单内容。
在上述步骤S12中，具体地，用户可根据自身需求通过点击目标菜单项、输入目标菜单项对应的菜单地址（如在浏览器的网址输入栏输入目标菜单项对应的菜单地址）等方式来访问目标菜单项对应的菜单内容，即菜单内容访问请求可通过点击目标菜单项、输入目标菜单项对应的链接地址等方式发出，由于访问目标菜单项对应的菜单内容需要通过路由的跳转来完成，因此当网页页面加载装置接收到该菜单内容访问请求时，需要判断该菜单项对应的路由是否已加载完成，具体地，由于在菜单项进行路由的加载过程中，不同的阶段会触发不同的事件，因此可通过为这些事件设置监听器，监听路由加载完成事件，当通过监听器监听到路由加载完成事件时，则网页页面加载装置可据此判断出目标菜单项已完成路由的加载。
在上述步骤S13中，具体地，当目标菜单项完成路由的加载后，则网页页面加载装置可即刻响应用户的菜单内容访问请求，针对用户所选定的菜单项（即目标菜单项），跳转至对应目标菜单项的路由上，进而通过该路由从数据库中获取对应目标菜单项的菜单内容进行加载，例如，用户需要访问菜单项“人员管理”对应的菜单内容（即此时的目标菜单项为“人员管理”），则当通过监听器监听到路由加载完成事件时，网页页面加载装置可据此跳转到与菜单项“人员管理”对应的路由上，通过该路由从数据库中获取对应的菜单内容，然后将该菜单内容加载到应用界面上进行显示，从而加载出对应菜单项“人员管理”的网页页面。
在本实施例中，该网页页面加载方法通过将菜单数据预存于数据库中，实现了逻辑与数据的分离，当进行页面加载时，通过从数据库中异步获取菜单数据，并根据获取到的菜单数据生成含有菜单列表的应用界面，同时根据菜单数据对菜单列表中的各个菜单项进行路由的加载，这样，当目标菜单项完成路由的加载时，即可响应用户针对目标菜单项的菜单内容访问请求，加载出对应的菜单内容，当需要增删改菜单时，只需对后台数据库中的菜单数据进行维护即可，而无需修改主框架的js文件，使得开发人员在前端开发过程中，可更专注于每个菜单功能自身的代码，从而实现了菜单的动态配置，提高了灵活性。
在一个优选的实施例中，根据预存的菜单数据生成含有菜单列表的应用界面的步骤，包括：
S11A，从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，菜单数据包括菜单名称和菜单图标；
S11B，根据菜单名称和菜单图标，对框架页面进行渲染，获得应用界面。
在上述步骤S11A中，菜单数据可能存储在后台服务器中，也可能缓存在前端内存（如浏览器内存）中，一般地，当首次进行页面的加载时，网页页面加载装置会调用预设的链接地址（即URL），通过该链接地址从后台服务器中查询出对应的菜单数据，然后保存至前端内存中，这样，当后续再次进行页面的加载时，网页页面加载装置会先检查前端内存中是否已存在菜单数据，如果前端内存中已存在菜单数据，则无需再调用预设的链接地址来获取后台服务器中的菜单数据，这样既可减轻服务器的运行负担，又可提高数据的获取效率，进而提高网页页面加载的效率；具体地，当触发开启页面加载时（如通过登录页面进行触发），网页页面加载装置将从目标数据库（前端内存或后台服务器）中异步加载菜单数据，同时进行框架页面的加载，以便进行后续操作。
在上述步骤S11B中，菜单数据包括多个菜单项以及每个菜单项对应的名称和图标，具体地，可通过AngularJS中的angular.forEach方法对菜单数据进行遍历，获得菜单数据中每个菜单项对应的名称和图标，然后通过对菜单项进行赋值显示操作，将菜单名称赋值给对应的菜单图标，从而可获得菜单列表，另外，由于加载菜单数据和加载框架页面是同时进行的，而AngularJS的框架页面是静态页面，因此会提前加载出来，进而当获得菜单列表时，通过将菜单列表渲染至框架页面的指定区域上即可获得展示于用户的含有菜单列表的应用界面，其中，如图8所示，一般地，AngularJS的框架页面包括三部分区域：头部区域100、菜单栏展示区域200和菜单内容展示区域300，因此在生成的应用界面中，用户可在菜单展示区域200中查看到菜单列表中的各个菜单项。
在本实施例中，由于AngularJS的框架页面是静态页面，因此可提前先加载出来，后续再加载菜单项和对应的菜单内容，与传统的框架页面和菜单同步进行加载的常规技术手段相比，可节省页面加载的时间。
在一个优选的实施例中，菜单数据还包括各个菜单项对应的路由地址、模板地址和菜单控制器，对菜单列表中的各个菜单项进行路由的加载的步骤，包括：
S11a，将路由地址、模板地址和菜单控制器进行关联，以建立路由地址、模板地址和菜单控制器之间的映射关系；
将关联后的路由地址、模板地址和菜单控制器与对应的菜单项进行绑定。
在本实施例中，菜单数据还包括每个菜单项对应的路由地址、模板地址和菜单控制器，具体地，可通过AngularJS中的angular.forEach方法对菜单数据进行遍历，获得菜单数据中每个菜单项对应的路由地址、模板地址和菜单控制器，然后通过AngularJS内置的$routeProvider（即路由提供器，一个用于配置路由的内置服务）将路由地址、模板地址和菜单控制器进行关联，建立起三者之间一一对应的映射关系，进而将关联后的路由地址、模板地址和菜单控制器与对应的菜单项进行绑定，从而实现对各个菜单项的路由配置，其中，路由地址可通过哈希值的形式呈现；具体地，在本申请实施例中，可通过以下代码对菜单数据进行遍历，获得每个菜单项对应的菜单名称、菜单图标、路由地址、模板地址和菜单控制器：
function initRouter(trees) {
         angular.forEach(trees, function(menuObj) {
               if (!menuObj.nodes) {
                     var viewObj = {};
                     var hashVal = menuObj.hashVal;
                     viewObj[hashVal + '@'] = {
                          templateUrl : menuObj.requestUrl,
                          controller : menuObj.controller
                     };
在一个优选的实施例中，可通过以下方式判断目标菜单项是否已完成路由的加载：
S12A，判断是否接收到路由加载完成的广播通知；
若接收到路由加载完成的广播通知，则执行S12B，判定目标菜单项已完成路由的加载。
在本实施例中，具体地，由于在菜单项进行路由的加载过程中，不同的阶段会触发不同的事件，而这些事件都是自动从AngularJS的$rootScope（即全局作用域）中广播下去的，因此最好的做法是在全局作用域中设置监听器，监听路由加载完成事件，然而在AngularJS的全局作用域中设置监听器具有现实的技术困难，因此可在菜单内容的路由作用区域（相当于应用界面的菜单内容展示区域）之外设置一个主控制器（即设置一个Controller，该Controller的名称为“MainController”），这样，既可通过主控制器实现对路由加载完成事件的监听，又可通过主控制器负责路由的跳转，而且还可通过主控制器负责框架页面的加载；
具体地，可事先将用于查询菜单数据的链接地址（即上述URL）设进路由提供器中，当首次进行页面的加载时，可通过路由提供器调用该链接地址，进而路由提供器根据该链接地址从后台服务器中查询出对应的菜单数据，然后保存至前端内存中，由于加载菜单数据和加载框架页面是同时进行的，因此路由提供器查询菜单数据和主控制器加载框架页面也是同时进行的，当路由提供器查询出菜单数据后，路由提供器会同时对各个菜单项进行路由的加载（即为各个菜单项配置路由），当所有菜单项均已完成路由的加载后，路由器提供器会向主控制器发送一个“路由加载完成”的广播通知，当主控制器监听到该广播通知时，则可据此判定目标菜单项已完成路由的加载，此时可进入S13进行相关操作。
在一个优选的实施例中，当各个菜单项均已已完成路由的加载时，将预设的全局变量设置为真，此时可通过以下方式判断目标菜单项是否已完成路由的加载：
S12a，判断全局变量是否为真；
若全局变量为真，则执行S12b，判定目标菜单项已完成路由的加载。
在本实施例中，由于在页面加载的过程中，可能会出现以下情况：在主控制器开启监听功能去监听路由加载完成事件之前，路由提供器已经完成路由的加载并发送“路由加载完成”的广播通知，这就会导致此时即便路由已经加载完成了，但由于主控器还没开启监听功能，进而不能及时接收到“路由加载完成”的广播通知，从而后续主控制器也不会进行路由的跳转，导致无法及时加载出对应的菜单内容，为防止这种情况的发生，具体地，可事先在全局作用域中设置一个变量，将其定义为全局变量，当所有菜单项均已完成路由的加载时，可通过路由提供器将该全局变量设置为真（即“true”），进而在主控制器开启监听功能去监听路由加载完成事件之前，可通过主控制器先判断该全局变量是否为真（true），若全局变量为真，则说明所有菜单项均已完成路由的加载，此时主控制器可据此直接进行路由的跳转，而无需开启监听来接收路由提供器发送的“路由加载完成”的广播通知；若全局变量并非为真，则说明并未完成对所有菜单项的路由加载，此时主控制器可据此开启监听功能，监听路由加载完成事件；因此在主控器还没开启监听功能之前，可先通过主控制器判断全局变量是否为真，这样可避免前述情况的发生，从而有利于提高页面加载的效率。
在一个优选的实施例中，菜单内容访问请求包括路由地址，响应菜单内容访问请求，加载出对应目标菜单项的菜单内容的步骤，包括：
S131，根据路由地址，确定出与路由地址相对应的菜单控制器和模板地址；
S132，根据模板地址从目标数据库中查询出与模板地址相对应的菜单内容；
S133，将菜单内容渲染至应用界面的指定显示区域内，加载出对应目标菜单项的菜单内容。
在上述步骤S131中，当通过路由提供器完成对各个菜单项的路由的加载时，可通过主控制器进行路由的跳转，具体地，由于每个菜单项都有其对应的路由地址、模板地址和菜单控制器，而且路由地址、模板地址、菜单控制器三者之间又是一一对应的映射关系，因此主控制器可根据菜单内容访问请求中的路由地址确定出相对应的菜单控制器和模板地址，此时可进入步骤S132。
在上述步骤S132中，当确定出对应的菜单控制器和模板地址时，可交由菜单控制器执行加载菜单内容的过程，具体地，菜单控制器调用模板地址从目标数据库（后台服务器或前端内存）中查询出与模板地址相对应的菜单内容，然后将获取到的菜单内容填充到预先与菜单控制器相绑定的视图页面上，结合成用户可真正看到的html文件，此时可进入步骤S133。
在上述步骤S133中，具体地，获得html文件后，通过将其渲染至应用界面的指定显示区域内即可加载出对应菜单项的菜单内容，从而实现网页页面的加载，其中，该指定显示区域为菜单内容显示区域。
在一个优选的实施例中，前述的网页页面加载方法，还包括：
S14，间隔预设时间获取菜单内容访问请求的历史访问记录；
S15，根据历史访问记录，挑选出指定路由地址，其中，指定路由地址为历史访问记录中出现次数最多的路由地址；
S16，将指定路由地址设置为默认路由地址。
在本实施例中，一般地，在单页面应用的开发中，一般会通过AngularJS的$urlRouterProvider（在AngularJS中，$urlRouterProvider为一个可用于设置默认路由的内置服务）设置一个默认路由地址，当用户登录页面后，系统会根据默认路由地址自动加载出默认页面（一般默认页面为首页页面），然后用户再通过点击菜单项等方式访问对应的菜单内容，但由于用户对不同菜单项的使用需求是不一样的，如果默认页面不是用户所需要的页面，则用户需要通过点击菜单项等方式访问所需的菜单内容，从而不利于提高用户体验，因此需要针对此情况进行改善，具体地，由于用户在使用过程中是通过点击菜单项等方式发出菜单内容访问请求，系统再根据菜单内容访问请求的路由地址加载出对应的菜单内容的，而且用户在使用过程中会在前端（如浏览器）留下浏览痕迹，因此网页页面加载装置可通过每隔一段时间（即间隔预设时间）获取菜单内容访问请求的历史访问记录，进而根据历史访问请求中的路由地址获知用户对不同菜单项的使用需求，例如，某个路由地址在历史访问记录中出现次数最多，而由于每个菜单项都有其对应的路由地址，因此可据此推断出用户对该路由地址对应的菜单项的使用需求最大，进而通过AngularJS的$urlRouterProvider将该路由地址设置为默认路由地址，这样当后续用户再次登录页面后，系统会根据修改后的默认路由地址自动加载出对应的页面，而该页面中展示的菜单内容很大程度上是用户所需要访问的，从而有利于提高用户体验；其中，预设时间可根据实际情况由用户自行设定，也可以是系统默认设置而不可更改的，例如，预设时间可以是一天、两天、三天等，只要能满足使用要求即可，对此不作具体的限制。
参照图2，本申请实施例还提出一种网页页面加载装置，包括：
数据处理模块11，用于根据预存的菜单数据生成含有菜单列表的应用界面，并对菜单列表中的各个菜单项进行路由的加载；
判断模块12，用于接收用户针对目标菜单项的菜单内容访问请求，并判断目标菜单项是否已完成路由的加载，其中，菜单项包括所述目标菜单项；
加载模块13，用于当目标菜单项已完成路由的加载时，响应菜单内容访问请求，加载出对应目标菜单项的菜单内容。
在上述数据处理模块11中，预存的菜单数据为存储在数据库中与菜单项的信息相对应的数据，例如菜单项为“人员管理”，则预存的菜单数据为存储在数据库中与“人员管理”相关的信息所对应的数据，其主要作用在于向用户展示应用界面的布局及页面内容（即应用界面中所含有的菜单项以及各个菜单项所对应的菜单内容），具体地，当触发开启页面加载时（如通过登录页面进行触发），数据处理模块11将从数据库中异步获取菜单数据并进行菜单数据的加载，以生成含有菜单列表的应用界面以及对菜单列表中的各个菜单项进行路由的加载，其中，在菜单数据加载的过程中，数据处理模块11根据菜单数据对前端的显示界面进行渲染可生成含有菜单列表的应用界面，而数据处理模块11根据菜单数据对菜单项进行路由的加载，其目的在于为菜单列表中的各个菜单项配置对应的路由，当某个菜单项配置好对应的路由后，后续才能通过路由的跳转加载出与该菜单项相对应的菜单内容，例如，菜单列表中含有“设备管理”和“人员管理”这两个菜单项，则需要为这两个菜单项配置对应的路由，路由配置好后，在前端的应用界面上才能加载出对应“设备管理”的菜单内容和对应“人员管理”的菜单内容。
在上述判断模块12中，具体地，用户可根据自身需求通过点击目标菜单项、输入目标菜单项对应的菜单地址（如在浏览器的网址输入栏输入目标菜单项对应的菜单地址）等方式来访问目标菜单项对应的菜单内容，即菜单内容访问请求可通过点击目标菜单项、输入目标菜单项对应的链接地址等方式发出，由于访问目标菜单项对应的菜单内容需要通过路由的跳转来完成，因此当网页页面加载装置接收到该菜单内容访问请求时，需要通过判断模块12判断该菜单项对应的路由是否已加载完成，具体地，由于在菜单项进行路由的加载过程中，不同的阶段会触发不同的事件，因此可通过为这些事件设置监听器，监听路由加载完成事件，当判断模块12通过监听器监听到路由加载完成事件时，则判断模块12可据此判断出目标菜单项已完成路由的加载。
在上述加载模块13中，具体地，当目标菜单项完成路由的加载后，则加载模块13可即刻响应用户的菜单内容访问请求，针对用户所选定的菜单项（即目标菜单项），跳转至对应目标菜单项的路由上，进而通过该路由从数据库中获取对应该菜单项的菜单内容进行加载，例如，用户需要访问菜单项“人员管理”对应的菜单内容（即此时的目标菜单项为“人员管理”），则当判断模块12通过监听器监听到路由加载完成事件时，加载模块13可据此跳转到与菜单项“人员管理”对应的路由上，通过该路由从数据库中获取对应的菜单内容，然后将该菜单内容加载到应用界面上进行显示，从而加载出对应菜单项“人员管理”的网页页面。
在本实施例中，该网页页面加载装置通过将菜单数据预存于数据库中，实现了逻辑与数据的分离，当进行页面加载时，通过从数据库中异步获取菜单数据，并根据获取到的菜单数据生成含有菜单列表的应用界面，同时根据菜单数据对菜单列表中的各个菜单项进行路由的加载，这样，当目标菜单项完成路由的加载时，即可响应用户针对目标菜单项的菜单内容访问请求，加载出对应的菜单内容，当需要增删改菜单时，只需对后台数据库中的菜单数据进行维护即可，而无需修改主框架的js文件，使得开发人员在前端开发过程中，可更专注于每个菜单功能自身的代码，从而实现了菜单的动态配置，提高了灵活性。
参照图3，在一个优选的实施例中，数据处理模块11，包括：
获取单元11A，用于从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，菜单数据包括菜单名称和菜单图标；
渲染单元11B，用于根据菜单名称和菜单图标，对框架页面进行渲染，获得应用界面。
在上述获取单元11A中，菜单数据可能存储在后台服务器中，也可能缓存在前端内存（如浏览器内存）中，一般地，当首次进行页面的加载时，获取单元11A会调用预设的链接地址（即URL），通过该链接地址从后台服务器中查询出对应的菜单数据，然后保存至前端内存中，这样，当后续再次进行页面的加载时，获取单元11A会先检查前端内存中是否已存在菜单数据，如果前端内存中已存在菜单数据，则无需再调用预设的链接地址来获取后台服务器中的菜单数据，这样既可减轻服务器的运行负担，又可提高数据的获取效率，进而提高网页页面加载的效率；具体地，当触发开启页面加载时（如通过登录页面进行触发），获取单元11A将从目标数据库（前端内存或后台服务器）中异步加载菜单数据，同时进行框架页面的加载，以便进行后续操作。
在上述渲染单元11B中，菜单数据包括多个菜单项以及每个菜单项对应的名称和图标，具体地，获取单元11A可通过AngularJS中的angular.forEach方法对菜单数据进行遍历，获得菜单数据中每个菜单项对应的名称和图标，然后通过对菜单项进行赋值显示操作，将菜单名称赋值给对应的菜单图标，从而可获得菜单列表，另外，由于加载菜单数据和加载框架页面是同时进行的，而AngularJS的框架页面是静态页面，因此会提前加载出来，进而当获得菜单列表时，可通过渲染单元11B将菜单列表渲染至框架页面的指定区域上即可获得展示于用户的含有菜单列表的应用界面，其中，如图8所示，一般地，AngularJS的框架页面包括三部分区域：头部区域100、菜单栏展示区域200和菜单内容展示区域300，因此在生成的应用界面中，用户可在菜单展示区域200中查看到菜单列表中的各个菜单项。
在本实施例中，由于AngularJS的框架页面是静态页面，因此可提前先加载出来，后续再加载菜单项和对应的菜单内容，与传统的框架页面和菜单同步进行加载的常规技术手段相比，可节省页面加载的时间。
参照图3，在一个优选的实施例中，菜单数据还包括各个菜单项对应的路由地址、模板地址和菜单控制器，数据处理模块11还包括：
关联单元11a，用于将路由地址、模板地址和菜单控制器进行关联，以建立路由地址、模板地址和菜单控制器之间的映射关系；
绑定单元11b，用于将关联后的所述路由地址、模板地址和菜单控制器与对应的菜单项进行绑定。
在本实施例中，菜单数据还包括每个菜单项对应的路由地址、模板地址和菜单控制器，具体地，获取单元11A可通过AngularJS中的angular.forEach方法对菜单数据进行遍历，获得菜单数据中每个菜单项对应的路由地址、模板地址和菜单控制器，然后关联单元11a通过AngularJS内置的$routeProvider（即路由提供器，一个用于配置路由的内置服务）将路由地址、模板地址和菜单控制器进行关联，建立起三者之间一一对应的映射关系，进而通过绑定单元11b将关联后的路由地址、模板地址和菜单控制器与对应的菜单项进行绑定，从而实现对各个菜单项的路由配置，其中，路由地址可通过哈希值的形式呈现；具体地，在本申请实施例中，获取单元11A可通过以下代码对菜单数据进行遍历，获得每个菜单项对应的菜单名称、菜单图标、路由地址、模板地址和菜单控制器：
function initRouter(trees) {
         angular.forEach(trees, function(menuObj) {
               if (!menuObj.nodes) {
                     var viewObj = {};
                     var hashVal = menuObj.hashVal;
                     viewObj[hashVal + '@'] = {
                          templateUrl : menuObj.requestUrl,
                          controller : menuObj.controller
                     };
参照图4，在一个优选的实施例中，判断模块12，包括：
第一判断单元12A，用于判断是否接收到路由加载完成的广播通知；
第一判定单元12B，用于当接收到路由加载完成的广播通知时，判定目标菜单项已完成路由的加载。
在本实施例中，具体地，由于在菜单项进行路由的加载过程中，不同的阶段会触发不同的事件，而这些事件都是自动从AngularJS的$rootScope（即全局作用域）中广播下去的，因此最好的做法是在全局作用域中设置监听器，监听路由加载完成事件，然而在AngularJS的全局作用域中设置监听器具有现实的技术困难，因此可在菜单内容的路由作用区域（相当于应用界面的菜单内容展示区域）之外设置一个主控制器（即设置一个Controller，该Controller的名称为“MainController”），这样，既可通过主控制器实现对路由加载完成事件的监听，又可通过主控制器负责路由的跳转，而且还可通过主控制器负责框架页面的加载；
具体地，可事先将用于查询菜单数据的链接地址（即上述URL）设进路由提供器中，当首次进行页面的加载时，获取单元11A可通过路由提供器调用该链接地址，进而路由提供器根据该链接地址从后台服务器中查询出对应的菜单数据，然后保存至前端内存中，由于加载菜单数据和加载框架页面是同时进行的，因此路由提供器查询菜单数据和主控制器加载框架页面也是同时进行的，当获取单元11A通过路由提供器查询出菜单数据后，路由加载单元11a可通过路由提供器同时对各个菜单项进行路由的加载（即为各个菜单项配置路由），当所有菜单项均已完成路由的加载后，路由器提供器会向主控制器发送一个“路由加载完成”的广播通知，当主控制器监听到该广播通知时，则第一判断单元12A可据此判断出主控制器接收到路由加载完成的广播通知，进而第一判定单元12B可据此判定目标菜单项已完成路由的加载，此时可交由加载模块13进行相关操作。
参照图5，在另一个优选的实施例中，当菜单项已完成路由的加载时，将预设的全局变量设置为真，此时判断模块12包括：
第二判断单元12a，用于判断全局变量是否为真；
第二判定单元12b，用于当全局变量为真时，判定目标菜单项已完成路由的加载。
在本实施例中，由于在页面加载的过程中，可能会出现以下情况：在主控制器开启监听功能去监听路由加载完成事件之前，路由提供器已经完成路由的加载并发送“路由加载完成”的广播通知，这就会导致此时即便路由已经加载完成了，但由于主控器还没开启监听功能，进而不能及时接收到“路由加载完成”的广播通知，从而后续主控制器也不会进行路由的跳转，导致无法及时加载出对应的菜单内容，为防止这种情况的发生，具体地，可事先在全局作用域中设置一个变量，将其定义为全局变量，当所有菜单项均已完成路由的加载时，可通过路由提供器将该全局变量设置为真（即“true”），进而在主控制器开启监听功能去监听路由加载完成事件之前，第二判断单元12a可通过主控制器先判断该全局变量是否为真（true），若全局变量为真，则第二判定单元12b可据此判定目标菜单项已完成路由的加载，此时主控制器可据此直接进行路由的跳转，而无需开启监听来接收路由提供器发送的“路由加载完成”的广播通知；若全局变量并非为真，则第二判定单元12b可据此判定目标菜单项未完成路由的加载，此时主控制器可据此开启监听功能，监听路由加载完成事件；因此在主控器还没开启监听功能之前，可先通过主控制器判断全局变量是否为真，这样可避免前述情况的发生，从而有利于提高页面加载的效率。
参照图6，在一个优选的实施例中，菜单内容访问请求包括路由地址，加载模块13包括：
确定单元131，用于根据路由地址，确定出与路由地址相对应的菜单控制器和模板地址；
查询单元132，用于根据模板地址从目标数据库中查询出与模板地址相对应的菜单内容；
加载单元133，用于将菜单内容渲染至应用界面的指定显示区域内，加载出对应目标菜单项的菜单内容。
在上述确定单元131中，当通过路由提供器完成对各个菜单项的路由的加载时，可通过主控制器进行路由的跳转，具体地，由于每个菜单项都有其对应的路由地址、模板地址和菜单控制器，而且路由地址、模板地址、菜单控制器三者之间又是一一对应的映射关系，因此确定单元131可通过主控制器根据菜单内容访问请求中的路由地址确定出相对应的菜单控制器和模板地址，此时可交由查询单元132执行相关操作。
在上述查询单元132中，当确定单元131确定出对应的菜单控制器和模板地址时，可交由菜单控制器执行加载菜单内容的过程，具体地，查询单元132可通过菜单控制器调用模板地址，进而根据模板地址从目标数据库（后台服务器或前端内存）中查询出与模板地址相对应的菜单内容，然后查询单元132将获取到的菜单内容填充到预先与菜单控制器相绑定的视图页面上，结合成用户可真正看到的html文件，此时可交由加载单元133执行相关操作。
在上述加载单元133中，具体地，当查询单元132获得html文件后，可通过加载单元133将其渲染至应用界面的指定显示区域内即可加载出对应菜单项的菜单内容，从而实现网页页面的加载，其中，该指定显示区域为菜单内容显示区域。
参照图7，在一个优选的实施例中，前述的网页页面加载装置还包括：
获取模块14，用于间隔预设时间获取菜单内容访问请求的历史访问记录；
挑选模块15，用于根据历史访问记录，挑选出指定路由地址，其中，指定路由地址为历史访问记录中出现次数最多的路由地址；
设置模块16，用于将指定路由地址设置为默认路由地址。
在本实施例中，一般地，在单页面应用的开发中，一般会通过AngularJS的$urlRouterProvider设置一个默认路由地址，当用户登录页面后，系统会根据默认路由地址自动加载出默认页面（一般默认页面为首页页面），然后用户再通过点击菜单项等方式访问对应的菜单内容，但由于用户对不同菜单项的使用需求是不一样的，如果默认页面不是用户所需要的页面，则用户需要通过点击菜单项等方式访问所需的菜单内容，从而不利于提高用户体验，因此需要针对此情况进行改善，具体地，由于用户在使用过程中是通过点击菜单项等方式发出菜单内容访问请求，系统再根据菜单内容访问请求的路由地址加载出对应的菜单内容的，而且用户在使用过程中会在前端（如浏览器）留下浏览痕迹，因此获取模块14可通过每隔一段时间（即间隔预设时间）获取菜单内容访问请求的历史访问记录，进而挑选模块15可根据历史访问请求中的路由地址获知用户对不同菜单项的使用需求，例如，某个路由地址在历史访问记录中出现次数最多，而由于每个菜单项都有其对应的路由地址，因此挑选模块15可据此推断出用户对该路由地址对应的菜单项的使用需求最大，进而设置模块16可通过AngularJS的$urlRouterProvider将该路由地址设置为默认路由地址，这样当后续用户再次登录页面后，系统会根据修改后的默认路由地址自动加载出对应的页面，而该页面中展示的菜单内容很大程度上是用户所需要访问的，从而有利于提高用户体验；其中，预设时间可根据实际情况由用户自行设定，也可以是系统默认设置而不可更改的，例如，预设时间可以是一天、两天、三天等，只要能满足使用要求即可，对此不作具体的限制。
参照图9，本申请实施例中还提供一种计算机设备，该计算机设备可以是服务器，其内部结构可以如图9所示。该计算机设备包括通过系统总线连接的处理器、存储器、网络接口和数据库。其中，该计算机设计的处理器用于提供计算和控制能力。该计算机设备的存储器包括可读存储介质、内存储器。该可读存储介质存储可以是易失性，也可以是非易失性。该可读存储介质存储有操作系统、计算机程序和数据库。该内存储器为可读存储介质中的操作系统和计算机程序的运行提供环境。该计算机设备的数据库用于存储网页页面加载方法等数据。该计算机设备的网络接口用于与外部的终端通过网络连接通信。该计算机程序在执行时，执行如上述各方法的实施例的流程。本领域技术人员可以理解，图9中示出的结构，仅仅是与本申请方案相关的部分结构的框图，并不构成对本申请方案所应用于其上的计算机设备的限定。
本申请一实施例还提供一种计算机可读存储介质，其上存储有计算机程序，该计算机程序在执行时，执行如上述各方法的实施例的流程。以上所述仅为本申请的优选实施例，并非因此限制本申请的专利范围，凡是利用本申请说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本申请的专利保护范围内。

Claims (20)

  1. 一种网页页面加载方法，其特征在于，包括：
    根据预存的菜单数据生成含有菜单列表的应用界面，并对所述菜单列表中的各个菜单项进行路由的加载；
    接收用户针对目标菜单项的菜单内容访问请求，并判断所述目标菜单项是否已完成路由的加载，其中，所述菜单项包括所述目标菜单项；
    若所述目标菜单项已完成路由的加载，则响应所述菜单内容访问请求，加载出对应所述目标菜单项的菜单内容。
  2. 根据权利要求1所述的网页页面加载方法，其特征在于，所述根据预存的菜单数据生成含有菜单列表的应用界面的步骤，包括：
    从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，所述菜单数据包括菜单名称和菜单图标；
    根据所述菜单名称和菜单图标，对所述框架页面进行渲染，获得所述应用界面。
  3. 根据权利要求2所述的网页页面加载方法，其特征在于，所述菜单数据还包括各个所述菜单项对应的路由地址、模板地址和菜单控制器，所述对所述菜单列表中的各个菜单项进行路由的加载的步骤，包括：
    将所述路由地址、模板地址和菜单控制器进行关联，以建立所述路由地址、模板地址和菜单控制器之间的映射关系；
    将关联后的所述路由地址、模板地址和菜单控制器与对应的所述菜单项进行绑定。
  4. 根据权利要求3所述的网页页面加载方法，其特征在于，所述判断所述目标菜单项是否已完成路由的加载的步骤，包括：
    判断是否接收到路由加载完成的广播通知；
    若接收到路由加载完成的广播通知，则判定所述目标菜单项已完成路由的加载。
  5. 根据权利要求3所述的网页页面加载方法，其特征在于，当各个所述菜单项均已完成路由的加载时，将预设的全局变量设置为真，所述判断所述目标菜单项是否已完成路由的加载的步骤，包括：
    判断所述全局变量是否为真；
    若所述全局变量为真，则判定所述目标菜单项已完成路由的加载。
  6. 根据权利要求3所述的网页页面加载方法，其特征在于，所述菜单内容访问请求包括所述路由地址，所述响应所述菜单内容访问请求，加载出对应所述目标菜单项的菜单内容的步骤，包括：
    根据所述路由地址，确定出与所述路由地址相对应的所述菜单控制器和模板地址；
    根据所述模板地址从所述目标数据库中查询出与所述模板地址相对应的菜单内容；
    将所述菜单内容渲染至所述应用界面的指定显示区域内，加载出对应所述目标菜单项的菜单内容。
  7. 根据权利要求6所述的网页页面加载方法，其特征在于，还包括：
    间隔预设时间获取所述菜单内容访问请求的历史访问记录；
    根据所述历史访问记录，挑选出指定路由地址，其中，所述指定路由地址为历史访问记录中出现次数最多的所述路由地址；
    将所述指定路由地址设置为默认路由地址。
  8. 一种网页页面加载装置，其特征在于，包括：
    数据处理模块，用于根据预存的菜单数据生成含有菜单列表的应用界面，并对所述菜单列表中的各个菜单项进行路由的加载；
    判断模块，用于接收用户针对目标菜单项的菜单内容访问请求，并判断所述目标菜单项是否已完成路由的加载，其中，所述菜单项包括所述目标菜单项；
    加载模块，用于当所述目标菜单项已完成路由的加载时，响应所述菜单内容访问请求，加载出对应所述目标菜单项的菜单内容。
  9. 如权利要求8所述的网页页面加载装置，其特征在于，所述数据处理模块，包括：
    获取单元，用于从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，所述菜单数据包括菜单名称和菜单图标；
    渲染单元，用于根据所述菜单名称和菜单图标，对所述框架页面进行渲染，获得所述应用界面。
  10. 如权利要求9所述的网页页面加载装置，其特征在于，所述菜单数据还包括各个所述菜单项对应的路由地址、模板地址和菜单控制器，所述数据处理模块，还包括：
    关联单元，用于将所述路由地址、模板地址和菜单控制器进行关联，以建立所述路由地址、模板地址和菜单控制器之间的映射关系；
    绑定单元，用于将关联后的所述路由地址、模板地址和菜单控制器与对应的所述菜单项进行绑定。
  11. 如权利要求10所述的网页页面加载装置，其特征在于，所述判断模块，包括：
    第一判断单元，用于判断是否接收到路由加载完成的广播通知；
    第一判定单元，用于当接收到路由加载完成的广播通知时，判定所述目标菜单项已完成路由的加载。
  12. 如权利要求10所述的网页页面加载装置，其特征在于，当各个所述菜单项均已完成路由的加载时，将预设的全局变量设置为真，所述判断模块，包括：
    第二判断单元，用于判断所述全局变量是否为真；
    第二判定单元，用于当全局变量为真时，判定所述目标菜单项已完成路由的加载。
  13. 如权利要求10所述的网页页面加载装置，其特征在于，所述菜单内容访问请求包括所述路由地址，所述加载模块，包括：
    确定单元，用于根据所述路由地址，确定出与所述路由地址相对应的所述菜单控制器和模板地址；
    查询单元，用于根据所述模板地址从所述目标数据库中查询出与所述模板地址相对应的菜单内容；
    加载单元，用于将所述菜单内容渲染至所述应用界面的指定显示区域内，加载出对应所述目标菜单项的菜单内容。
  14. 如权利要求13所述的网页页面加载装置，其特征在于，所述装置还包括：
    获取模块，用于间隔预设时间获取所述菜单内容访问请求的历史访问记录；
    挑选模块，用于根据所述历史访问记录，挑选出指定路由地址，其中，所述指定路由地址为历史访问记录中出现次数最多的所述路由地址；
    设置模块，用于将所述指定路由地址设置为默认路由地址。
  15. 一种计算机设备，包括存储器和处理器，所述存储器中存储有计算机程序，其特征在于，所述处理器执行所述计算机程序时实现网页页面加载方法，该网页页面加载方法，包括：
    根据预存的菜单数据生成含有菜单列表的应用界面，并对所述菜单列表中的各个菜单项进行路由的加载；
    接收用户针对目标菜单项的菜单内容访问请求，并判断所述目标菜单项是否已完成路由的加载，其中，所述菜单项包括所述目标菜单项；
    若所述目标菜单项已完成路由的加载，则响应所述菜单内容访问请求，加载出对应所述目标菜单项的菜单内容。
  16. 如权利要求15所述的计算机设备，其特征在于，所述据预存的菜单数据生成含有菜单列表的应用界面的步骤，包括：
    从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，所述菜单数据包括菜单名称和菜单图标；
    根据所述菜单名称和菜单图标，对所述框架页面进行渲染，获得所述应用界面。
  17. 如权利要求16所述的计算机设备，其特征在于，所述菜单数据还包括各个所述菜单项对应的路由地址、模板地址和菜单控制器，所述对所述菜单列表中的各个菜单项进行路由的加载的步骤，包括：
    将所述路由地址、模板地址和菜单控制器进行关联，以建立所述路由地址、模板地址和菜单控制器之间的映射关系；
    将关联后的所述路由地址、模板地址和菜单控制器与对应的所述菜单项进行绑定。
  18. 一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现网页页面加载方法，该网页页面加载方法，包括：
    根据预存的菜单数据生成含有菜单列表的应用界面，并对所述菜单列表中的各个菜单项进行路由的加载；
    接收用户针对目标菜单项的菜单内容访问请求，并判断所述目标菜单项是否已完成路由的加载，其中，所述菜单项包括所述目标菜单项；
    若所述目标菜单项已完成路由的加载，则响应所述菜单内容访问请求，加载出对应所述目标菜单项的菜单内容。
  19. 如权利要求18所述的计算机可读存储介质，其特征在于，所述处理器根据预存的菜单数据生成含有菜单列表的应用界面的步骤，包括：
    从目标数据库中获取预存的菜单数据并进行框架页面的加载，其中，所述菜单数据包括菜单名称和菜单图标；
    根据所述菜单名称和菜单图标，对所述框架页面进行渲染，获得所述应用界面。
  20. 如权利要求19所述的计算机可读存储介质，其特征在于，所述菜单数据还包括各个所述菜单项对应的路由地址、模板地址和菜单控制器，所述处理器对所述菜单列表中的各个菜单项进行路由的加载的步骤，包括：
    将所述路由地址、模板地址和菜单控制器进行关联，以建立所述路由地址、模板地址和菜单控制器之间的映射关系；
    将关联后的所述路由地址、模板地址和菜单控制器与对应的所述菜单项进行绑定。
PCT/CN2019/119655 2019-04-16 2019-11-20 网页页面加载方法、装置、计算机设备及存储介质 WO2020211379A1 (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
CN201910305172.2A CN110162720B (zh) 2019-04-16 2019-04-16 网页页面加载方法、装置、计算机设备及存储介质
CN201910305172.2 2019-04-16

Publications (1)

Publication Number Publication Date
WO2020211379A1 true WO2020211379A1 (zh) 2020-10-22

Family

ID=67639602

Family Applications (1)

Application Number Title Priority Date Filing Date
PCT/CN2019/119655 WO2020211379A1 (zh) 2019-04-16 2019-11-20 网页页面加载方法、装置、计算机设备及存储介质

Country Status (2)

Country Link
CN (1) CN110162720B (zh)
WO (1) WO2020211379A1 (zh)

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114237747A (zh) * 2021-12-17 2022-03-25 深圳壹账通智能科技有限公司 应用程序接口网关配置方法、装置、终端设备及存储介质

Families Citing this family (11)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN110162720B (zh) * 2019-04-16 2023-07-18 平安科技（深圳）有限公司 网页页面加载方法、装置、计算机设备及存储介质
CN111046310B (zh) * 2019-12-12 2024-03-19 北京奇艺世纪科技有限公司 页面处理方法、装置、服务器及计算机可读存储介质
CN111273964B (zh) * 2020-02-14 2024-03-08 抖音视界有限公司 一种数据加载方法及装置
CN111666585B (zh) * 2020-04-16 2023-08-18 北京百度网讯科技有限公司 子应用访问的方法、装置、电子设备以及可读存储介质
CN111666516A (zh) * 2020-04-24 2020-09-15 北京奇艺世纪科技有限公司 页面加载方法、装置、电子设备及存储介质
CN111708962A (zh) * 2020-06-23 2020-09-25 中国平安财产保险股份有限公司 骨架屏的渲染方法、装置、设备及存储介质
CN111857878B (zh) * 2020-07-21 2024-04-09 北京蚂蜂窝网络科技有限公司 骨架屏页面生成方法、装置、电子设备及存储介质
CN112115337B (zh) * 2020-09-09 2023-12-29 北京奇艺世纪科技有限公司 展示数据的方法及装置、电子设备、计算机可读存储介质
CN113010224B (zh) * 2021-03-03 2024-01-30 南方电网数字平台科技(广东)有限公司 前端微服务化方法、装置、计算机设备和存储介质
CN113031951B (zh) * 2021-04-30 2024-02-02 爱捷软件开发(深圳)有限公司 菜单生成方法、装置、计算机设备和存储介质
CN116010015B (zh) * 2023-03-27 2023-07-11 西安热工研究院有限公司 监控画面右键菜单生成方法、装置、设备和存储介质

Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2008035137A2 (en) * 2005-12-05 2008-03-27 Bmenu As System, method and computer software for providing a sitemap for small displays
CN106598591A (zh) * 2016-12-12 2017-04-26 深圳竹信科技有限公司 一种网页动态菜单生成方法及装置
CN109240568A (zh) * 2018-08-21 2019-01-18 杭州迪普科技股份有限公司 一种菜单页面的显示方法、装置及存储介质
CN110162720A (zh) * 2019-04-16 2019-08-23 平安科技（深圳）有限公司 网页页面加载方法、装置、计算机设备及存储介质

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102446222B (zh) * 2011-12-22 2014-12-10 华为技术有限公司 一种网页内容预加载方法、装置及系统
US9727354B2 (en) * 2014-05-02 2017-08-08 Kofax International Switzerland Sarl System and methods for loading an application and its modules in a client device
CN105574207A (zh) * 2016-01-21 2016-05-11 上海谦讯网络科技有限公司 一种wap网页开发方法
CN108021614A (zh) * 2017-08-18 2018-05-11 口碑(上海)信息技术有限公司 一种用于页面动态加载的方法及系统
US20190066204A1 (en) * 2017-08-31 2019-02-28 FlexFunds Ltd. System for issuing and managing exchange traded products as financial instruments and associated method
CN108255974B (zh) * 2017-12-27 2021-05-18 武汉天喻教育科技有限公司 一种模块化的Web页面展现系统及方法

Patent Citations (4)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
WO2008035137A2 (en) * 2005-12-05 2008-03-27 Bmenu As System, method and computer software for providing a sitemap for small displays
CN106598591A (zh) * 2016-12-12 2017-04-26 深圳竹信科技有限公司 一种网页动态菜单生成方法及装置
CN109240568A (zh) * 2018-08-21 2019-01-18 杭州迪普科技股份有限公司 一种菜单页面的显示方法、装置及存储介质
CN110162720A (zh) * 2019-04-16 2019-08-23 平安科技（深圳）有限公司 网页页面加载方法、装置、计算机设备及存储介质

Cited By (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN114237747A (zh) * 2021-12-17 2022-03-25 深圳壹账通智能科技有限公司 应用程序接口网关配置方法、装置、终端设备及存储介质

Also Published As

Publication number Publication date
CN110162720B (zh) 2023-07-18
CN110162720A (zh) 2019-08-23

Similar Documents

Publication Publication Date Title
WO2020211379A1 (zh) 网页页面加载方法、装置、计算机设备及存储介质
JP6272933B2 (ja) 遠隔ブラウジングセッション管理
US7805670B2 (en) Partial rendering of web pages
JP6742650B2 (ja) モバイルブラウザを用いたアプリケーションの呼び出し方法及び装置
US8849914B2 (en) System and method for synchronized co-browsing by users in different web sessions
US7770185B2 (en) Interceptor method and system for web services for remote portlets
WO2018014657A1 (zh) 一种统一门户方法、装置及系统
US20160191355A1 (en) Presenting execution of a remote application in a mobile device native format
US11126680B2 (en) Dynamic web page navigation
US9727354B2 (en) System and methods for loading an application and its modules in a client device
US20210337015A1 (en) Method and system of application development for multiple device client platforms
WO2013143403A1 (zh) 一种访问网站的方法和系统
US8392911B2 (en) Download discovery for web servers
JP2014529153A (ja) 履歴上のブラウジングセッション管理
CN111212154A (zh) 服务绑定方法、装置、终端、服务器和存储介质
KR20110022030A (ko) 현재 페이지 자동 로그인 프로그램 및 그 방법
US10725747B1 (en) Dynamically customizable portal
US11115462B2 (en) Distributed system
CN116827604B (zh) 应用登录控制方法、系统、终端及存储介质
US20230283677A1 (en) Multi-session cookie swap
CN104346228A (zh) 共享应用程序的方法及终端
JP5074434B2 (ja) 分散処理システム、分散処理方法、分散処理システムの開発支援装置および開発支援方法
JP2001005714A (ja) プロキシーサーバ変更装置
US11055196B1 (en) System and method for optimizing technology stack architecture
WO2023226887A1 (zh) 业务容灾方法、终端设备、软件开发包服务器和通信系统

Legal Events

Date Code Title Description
121 Ep: the epo has been informed by wipo that ep was designated in this application

Ref document number: 19924754

Country of ref document: EP

Kind code of ref document: A1

NENP Non-entry into the national phase

Ref country code: DE

122 Ep: pct application non-entry in european phase

Ref document number: 19924754

Country of ref document: EP

Kind code of ref document: A1