Page redirection methods and related devices

Abstract

This invention provides a page navigation method and related equipment, belonging to the field of web page development technology. The method includes: upon receiving a page navigation instruction, determining a transition screen based on the currently displayed first page and the corresponding second page to be navigated to; if the routing stack stores page information of the first page, sliding the transition screen in a first direction to switch the first page to the second page; if the routing stack does not store page information of the first page, sliding the transition screen in a second direction. In this invention, when navigating from a parent page to a lower page, the routing stack stores page information of the parent page. The hierarchical relationship between the current page and the page to be navigated to can be determined by whether the routing stack stores page information of the current page. The page switching is then achieved by sliding the transition screen based on this hierarchical relationship, eliminating the need for manual setting of page navigation parameters and reducing page switching costs.

Description

Technical Field

[0001] This invention relates to the field of web page development technology, and in particular to a page redirection method and related equipment. Background Technology

[0002] Vue-based web applications use a main page as the homepage, and other pages are navigated to each other using components.

[0003] Since page navigation is achieved through components, it is necessary to set the relevant parameters for page navigation in the components.

[0004] However, the hierarchical relationship between pages makes the page navigation parameters set in components quite complex. Furthermore, setting these parameters manually takes a long time, resulting in high page switching costs. Summary of the Invention

[0005] This invention provides a page redirection method and related equipment to solve the problem of large storage space occupied by stored list data.

[0006] On one hand, the present invention provides a page redirection method, including:

[0007] Upon receiving a page navigation instruction, the transition screen is determined based on the currently displayed first page and the second page to be navigated to corresponding to the page navigation instruction;

[0008] Determine whether the routing stack stores the page information of the first page, wherein the routing stack is used to record the page information of the parent page when navigating to the corresponding sub-page from any page;

[0009] When the routing stack stores the page information of the first page, it is determined that the first page is the parent page of the second page, and the transition screen is slid in the first direction to switch the first page to the second page;

[0010] When the routing stack does not store the page information of the first page, it is determined that the first page is a subordinate page of the second page, and the transition screen is slid in the second direction to switch the first page to the second page, wherein the first direction is opposite to the second direction.

[0011] In one embodiment, it further includes:

[0012] When the first page is switched to the second page, the first push information of the first page is released in the routing stack, wherein the push information of the page is stored in the routing stack when the page is displayed;

[0013] The second push information of the second page is stored in the routing stack.

[0014] In one embodiment, the step of sliding the transition screen in the first direction includes:

[0015] Obtain the rendering information of the second page and delete the cached information of the first page;

[0016] While the transition screen is slid in the first direction, the second page is rendered according to the rendering information.

[0017] In one embodiment, the step of sliding the transition screen in the second direction includes:

[0018] Retrieve the record information from the second page when the user was about to be redirected to the first page;

[0019] When the transition screen is slid in the second direction, the second page is rendered according to the recorded information.

[0020] In one embodiment, before the step of obtaining the record information of the last time the user was to be redirected to the first page on the second page, the method further includes:

[0021] When an instruction is received to jump from the currently displayed second page to the first page, the page information and operation information of the second page are obtained as record information;

[0022] The recorded information is stored in the cache component;

[0023] The step of obtaining the record information of the last time the user was about to be redirected to the first page on the second page includes:

[0024] The record information is obtained from the cache component.

[0025] In one embodiment, during the sliding of the transition screen, the graphics processor of the browser containing the second page is controlled to increase the sliding speed of the transition screen.

[0026] On the other hand, the present invention also provides a page navigation device, comprising:

[0027] The determination module is used to determine the transition screen when a page jump instruction is received, based on the currently displayed first page and the second page to be jumped to corresponding to the page jump instruction;

[0028] The determining module is further configured to determine whether the routing stack stores the page information of the first page, wherein the routing stack is configured to record the page information of the parent page when any page jumps to the corresponding sub-page;

[0029] The sliding module is used to determine that the first page is the parent page of the second page when the routing stack stores the page information of the first page, and to slide the transition screen in a first direction to switch the first page to the second page;

[0030] The sliding module is further configured to determine that the first page is a subordinate page of the second page when the routing stack does not store the page information of the first page, and slide the transition screen in a second direction to switch the first page to the second page, wherein the first direction is opposite to the second direction.

[0031] On the other hand, the present invention also provides a page navigation device, including: a memory and a processor;

[0032] The memory stores computer-executed instructions;

[0033] The processor executes the computer execution instructions stored in the memory, causing the processor to perform the page jump method as described above.

[0034] On the other hand, the present invention also provides a computer-readable storage medium storing computer-executable instructions, which, when executed by a processor, are used to implement the page jump method described above.

[0035] On the other hand, the present invention also provides a computer program product, including a computer program, which, when executed by a processor, implements the page redirection method described above.

[0036] The page navigation method and related device provided by this invention, upon receiving a page navigation instruction, determine a transition screen based on the current first page and the corresponding second page to be navigated to, and determine whether the routing stack stores page information of the first page. If the routing stack stores page information, it determines that the first page is the parent page of the second page, and then slides the transition screen in the first direction to achieve page navigation; if the routing stack does not store page information, it determines that the first page is the child page of the second page, and slides the transition screen in the second direction, opposite to the first direction, to achieve page navigation. In this invention, when navigating from a parent page to a child page, the routing stack stores the page information of the parent page, thereby determining the hierarchical relationship between the current page and the page to be navigated to based on whether the routing stack stores the page information of the current page. Then, the page switching is achieved by sliding the transition screen based on the hierarchical relationship. This eliminates the need to set page navigation parameters to determine the hierarchical relationship between the current page and the page to be navigated to, thus reducing page switching costs. Attached Figure Description

[0037] The accompanying drawings, which are incorporated in and form a part of this specification, illustrate embodiments consistent with this disclosure and, together with the description, serve to explain the principles of this disclosure.

[0038] Figure 1 This is a schematic diagram illustrating a scenario in which the page redirection method of the present invention is implemented;

[0039] Figure 2 This is a flowchart illustrating the first embodiment of the page redirection method of the present invention;

[0040] Figure 3 This is a flowchart illustrating the second embodiment of the page redirection method of the present invention;

[0041] Figure 4 This is a detailed flowchart of step S30 in the third embodiment of the page redirection method of the present invention;

[0042] Figure 5 This is a detailed flowchart of step S40 in the fourth embodiment of the page redirection method of the present invention;

[0043] Figure 6 This is a schematic diagram of the page navigation device of the present invention;

[0044] Figure 7 This is a schematic diagram of the hardware structure of the page redirection device of the present invention.

[0045] The accompanying drawings have illustrated specific embodiments of this disclosure, which will be described in more detail below. These drawings and descriptions are not intended to limit the scope of the concept in any way, but rather to illustrate the concepts of this disclosure to those skilled in the art through reference to particular embodiments. Detailed Implementation

[0046] Exemplary embodiments will now be described in detail, examples of which are illustrated in the accompanying drawings. When the following description relates to the drawings, unless otherwise indicated, the same numerals in different drawings denote the same or similar elements. The embodiments described in the following exemplary embodiments do not represent all embodiments consistent with this disclosure. Rather, they are merely examples of apparatuses and methods consistent with some aspects of this disclosure as detailed in the appended claims.

[0047] This invention provides a page redirection method. For example... Figure 1 As shown, the page transition device 100 is equipped with an application. When the page transition device 100 detects that the current first page 110 needs to transition to the second page 120, it generates a transition screen 130 using the first page 110 and the second page 120. During the transition from the first page 110 to the second page 120, the first page 110 slides to one side (e.g., ...). Figure 1(As the first page slides to the left), the transition screen 130 slides accordingly, and the page jump device 100 drags a portion of the second page 120 into the display interface. When the first page 110 has completely slid out of the display interface, the second page 120 is fully displayed on the display interface of the page jump device 100. It is understandable that... Figure 1 The display shows a portion of the first page 110 and a portion of the second page 120. When the first page 110 slides out of the display interface, the display interface shows the complete second page 120; or when the second page 120 slides out of the display interface, the display interface shows the complete first page 110. The first page 110 and the second page 120 can be web pages.

[0048] The technical solutions of the present invention and how they solve the above-mentioned technical problems will be described in detail below with specific embodiments. These specific embodiments can be combined with each other, and the same or similar concepts or processes may not be repeated in some embodiments. The embodiments of the present invention will now be described with reference to the accompanying drawings.

[0049] Reference Figure 2 , Figure 2 This is a first embodiment of the page redirection method of the present invention, which includes the following steps:

[0050] Step S10: Upon receiving a page jump instruction, determine the transition screen based on the currently displayed first page and the second page to be jumped to corresponding to the page jump instruction.

[0051] In this embodiment, the page navigation device includes a plugin that provides route navigation functionality, enabling page switching. The plugin can be the vue-router plugin. The plugin can monitor application route changes. For example, when the vue-router plugin detects a browser route change, it can determine that the page navigation device needs to perform a page navigation.

[0052] When the page navigation mechanism detects a route change in the currently running application through a plugin, it considers itself to have received a page navigation instruction. Based on this instruction, the mechanism determines the page to navigate to. The currently displayed page is defined as the first page, and the page to be navigated to is defined as the second page.

[0053] When the page navigation device receives a page navigation command, it generates a transition screen based on the first page and the second page. The transition screen is the screen that shows the transition from the first page to the second page, such as... Figure 1As shown, the transition screen is created by stitching together the first and second pages. For example, if the pages are switched by swiping left and right, the second page is placed to the right of the first page, and the first and second pages are horizontally aligned. The horizontally aligned first and second pages can then be stitched together to generate the transition screen.

[0054] Step S20: Determine whether the routing stack stores the page information of the first page. The routing stack is used to record the page information of the parent page when navigating to the corresponding sub-page from any page.

[0055] The page navigation mechanism includes route hook functions. During page loading and navigation, the mechanism records page information and stores it in a local cache via these hook functions, serving as a route stack for page maintenance. In other words, the page navigation mechanism contains a route stack. When navigating to a sub-page of the page from any page on the mechanism, the route stack stores the page information of the parent page, effectively loading the parent page. It's important to note that this is a single-page application; therefore, the route stack only stores the page information of one parent page. Thus, if the page information of the currently displayed first page is not stored in the route stack, it can be determined that the first page is a sub-page of the second page. If the route stack stores the page information of the first page, it can be determined that the first page is a parent page of the second page.

[0056] In step S30, when storing the page information of the first page in the routing stack, it is determined that the first page is the parent page of the second page, and the transition screen is slid in the first direction to switch the first page to the second page.

[0057] When it is determined that the routing stack stores page information for the first page, it can be confirmed that the first page is a loaded page. Since the loaded page is a parent page, it can be determined that the first page is the parent page of the second page. The page transition device slides the transition screen in a first direction, thereby switching the first page to the second page. The first direction can be horizontal to the left (within the first direction). Figure 1 The first direction (as shown in the diagram) can be horizontal to the left, or it can also be horizontal to the right. The specific first direction can be set according to the hierarchical arrangement of the pages in the application.

[0058] Step S40: When the routing stack does not store the page information of the first page, determine that the first page is a subordinate page of the second page, and slide the transition screen in the second direction to switch the first page to the second page. The first direction is opposite to the second direction.

[0059] When the routing stack does not store the page information of the first page, it can be determined that the currently displayed first page is not a loaded page, that is, the first page is not the parent page. Therefore, it can be determined that the first page is the lower page of the second page. The page jump device then slides the transition screen in the second direction to switch the first page to the second page. The first direction and the second direction are opposite.

[0060] If the application hosting the page is a browser, then during the transition screen scrolling process, the graphics processor of the browser hosting the second page is controlled to increase the scrolling speed of the transition screen, thereby improving the smoothness of the transition screen scrolling.

[0061] In the technical solution provided in this embodiment, upon receiving a page jump instruction, a transition screen is determined based on the current first page and the second page to be jumped to corresponding to the page jump instruction. It is also determined whether the routing stack stores page information for the first page. If the routing stack stores page information, it is determined that the first page is the parent page of the second page, and the page jump is achieved by sliding the transition screen in the first direction. If the routing stack does not store page information, it is determined that the first page is the child page of the second page, and the page jump is achieved by sliding the transition screen in the second direction, opposite to the first direction. In this invention, when jumping from a parent page to a child page, the routing stack stores the page information of the parent page. Therefore, based on whether the routing stack stores the page information of the current page, the hierarchical relationship between the current page and the page to be jumped to is determined. The page switching is then achieved by sliding the transition screen based on this hierarchical relationship. This eliminates the need to set page jump parameters to determine the hierarchical relationship between the current page and the page to be jumped to, thus reducing page switching costs.

[0062] Reference Figure 3 , Figure 3 This is a second embodiment of the page redirection method of the present invention, which, based on the first embodiment, further includes:

[0063] Step S50: When the first page is switched to the second page, the first push information of the first page is released in the routing stack. The routing stack stores the first push information when the first page is displayed.

[0064] Step S60: Store the second push information of the second page into the routing stack.

[0065] In this embodiment, when the page navigation device displays a page, it stores the page's push information into the routing stack. The push information refers to the identifier of the currently displayed page. If the routing stack were to store the push information of all already displayed pages, it would result in an excessive amount of information stored in the routing stack. Therefore, the routing stack only stores the push information of the currently displayed page.

[0066] When switching from the first page to the second page, the first push information of the first page is released from the routing stack, and then the second push information of the second page is stored in the routing stack. This method not only alleviates the problem of excessive routing stack caching but also achieves synchronization between page routing and push information. The device can determine the currently displayed page through the push information stored in the routing stack.

[0067] In the technical solution provided in this embodiment, after the first page is switched to the second page, the first push information of the first page is released in the routing stack, and the second push information of the second page is stored, which alleviates the problem of excessive caching of the routing stack and realizes the synchronization of page routing and push information.

[0068] Reference Figure 4 , Figure 4 This is a third embodiment of the page redirection method of the present invention. Based on the first or second embodiment, step S30 includes:

[0069] Step S31: Obtain the rendering information of the second page and delete the cached information of the first page.

[0070] Step S32: When sliding the transition screen in the first direction, render the second page according to the rendering information.

[0071] In this embodiment, when the first page is the parent page of the second page, that is, the second page is a new page, the new second page needs to be rendered completely, and the information of the first page needs to be destroyed to improve the user experience.

[0072] In response, the device obtains the rendering information of the second page, deletes the cached information of the first page, and performs a completely new rendering of the second page based on the rendering information when the transition screen is slid in the first direction.

[0073] Furthermore, the second page can be rendered in a personalized manner, which can be configured by the user. The second page's push-in information can be associated with and stored in the corresponding personalized rendering information. While the page navigation device retrieves the second push-in information and stores it in the routing stack, it can also retrieve the personalized rendering information associated with the second push-in information, thereby performing personalized rendering of the second page based on this information.

[0074] In the technical solution provided in this embodiment, when it is determined that the first page is the parent page of the second page, the rendering information of the second page is obtained and the cached information of the first page is deleted. When the transition screen is slid in the first direction, the second page is rendered according to the rendering information, thereby improving the user experience.

[0075] Reference Figure 5 , Figure 5This is a fourth embodiment of the page redirection method of the present invention. Based on the first or second embodiment, step S40 includes:

[0076] Step S41: Obtain the record information from the second page when the user was about to be redirected to the first page.

[0077] Step S42: When the transition screen is slid in the second direction, the second page is rendered according to the recorded information.

[0078] In this embodiment, when the first page is a subordinate page of the second page, the second page has previously been jumped from the second page to the first page, which is the subordinate page. The desired effect of the page jump device is that the content of the second page is still retained in the state before jumping to the first page.

[0079] To address this, the page navigation device records all information about the next page to be navigated to when loading the parent page; this information is defined as recorded information. When the page navigation device determines that the second page is the parent page of the first page, it can retrieve the recorded information from the previous navigation to the first page, i.e., the state information of the second page before the navigation to the first page. When the page navigation device slides the transition screen in the second direction, it renders the second page based on the recorded information, avoiding the loss of the second page's previous state due to re-rendering. This rendering method allows the device to restore all content of the second page before the navigation when switching to the second page.

[0080] It should be noted that the page navigation mechanism includes a routing component. Wrapping the routing component with a keep-alive component creates a caching component. The keep-alive component has an include property, which allows the caching component to cache state information.

[0081] When the page navigation device is currently displaying the second page and receives an instruction to navigate from the second page to the first page, since the second page is the parent page of the first page, the page navigation device retrieves the operation information and page information of the second page as record information. This record information is then cached in the cache component. If the first page needs to navigate, and the first page navigates to the second page, the record information is retrieved from the cache component. In other words, the steps to retrieve the record information from the second page when navigation to the first page was last performed include: retrieving the record information from the cache component.

[0082] In the technical solution provided in this embodiment, the recorded information of the second page when it was about to jump to the first page is obtained. When the transition screen is slid in the second direction, the second page is rendered according to the recorded information to avoid repeatedly rendering the second page and causing the previous state of the second page to be lost.

[0083] The present invention also provides a page navigation device, with reference to Figure 6 The page redirection device 600 includes:

[0084] The determining module 610 is used to determine the transition screen based on the currently displayed first page and the second page to be jumped to corresponding to the page jump instruction when a page jump instruction is received;

[0085] The determination module 610 is used to determine whether the routing stack stores the page information of the first page. The routing stack is used to record the page information of the parent page when navigating to the corresponding sub-page from any page.

[0086] The sliding module 620 is used to determine that the first page is the parent page of the second page when storing the page information of the first page in the routing stack, and to slide the transition screen in the first direction to switch the first page to the second page.

[0087] The sliding module 620 is used to determine that the first page is a subordinate page of the second page when the routing stack does not store the page information of the first page, and to slide the transition screen in the second direction to switch the first page to the second page. The first direction is opposite to the second direction.

[0088] In one embodiment, the page navigation device 600 includes:

[0089] The release module is used to release the first push information of the first page in the routing stack when the first page is switched to the second page. The page's push information is stored in the routing stack when the page is displayed.

[0090] The storage module is used to store the second push information of the second page into the routing stack.

[0091] In one embodiment, the page navigation device 600 includes:

[0092] The acquisition module is used to acquire rendering information of the second page and delete the cached information of the first page;

[0093] The rendering module is used to render the second page based on rendering information when the transition screen is slid in the first direction.

[0094] In one embodiment, the page navigation device 600 includes:

[0095] The acquisition module is used to retrieve the record information from the second page when the user was about to be redirected to the first page.

[0096] The rendering module is used to render the second page based on the recorded information when the transition screen is slid in the second direction.

[0097] In one embodiment, the page navigation device 600 includes:

[0098] The acquisition module is used to acquire page information and operation information of the second page as record information when it receives an instruction to jump from the currently displayed second page to the first page;

[0099] The storage module is used to store recorded information in the cache component;

[0100] The steps to retrieve the record information from the second page when the user was about to be redirected to the first page include:

[0101] Retrieve record information from the cache component.

[0102] Figure 7 This is a hardware structure diagram of a page navigation device according to an exemplary embodiment.

[0103] The page redirection device 700 may include: a processing unit 701, such as a CPU, a memory 702, and a transceiver 703. Those skilled in the art will understand that... Figure 7 The structure shown does not constitute a limitation on the page jump device and may include more or fewer components than illustrated, or combine certain components, or have different component arrangements. Memory 702 may be implemented by any type of volatile or non-volatile storage device or combination thereof, such as static random access memory (SRAM), electrically erasable programmable read-only memory (EEPROM), erasable programmable read-only memory (EPROM), programmable read-only memory (PROM), read-only memory (ROM), magnetic storage, flash memory, magnetic disk, or optical disk.

[0104] The processor 701 can call the computer program stored in the memory 702 to complete all or part of the steps of the page jump method described above.

[0105] Transceiver 703 is used to receive information sent by external devices and to send information to external devices.

[0106] A non-transitory computer-readable storage medium, wherein when instructions in the storage medium are executed by a processor of a page jump device, the page jump device is able to perform the page jump method described above.

[0107] A computer program product includes a computer program that, when executed by a processor of a page redirection device, enables the page redirection device to perform the page redirection method described above.

[0108] Other embodiments of this disclosure will readily occur to those skilled in the art upon consideration of the specification and practice of the invention disclosed herein. This invention is intended to cover any variations, uses, or adaptations of this disclosure that follow the general principles of this disclosure and include common knowledge or customary techniques in the art not disclosed herein. The specification and examples are to be considered exemplary only, and the true scope and spirit of this disclosure are indicated by the following claims.

[0109] It should be understood that this disclosure is not limited to the precise structures described above and shown in the accompanying drawings, and various modifications and changes can be made without departing from its scope. The scope of this disclosure is limited only by the appended claims.

Claims

1. A page jump method, characterized by, Comprise: Upon receiving a page jump instruction, determine a transition picture according to a first page currently displayed and a second page to be jumped corresponding to the page jump instruction, the transition picture being obtained by horizontally aligning and splicing the first page and the second page; Determine whether a route stack stores page information of the first page, wherein the route stack is used to record page information of an upper-level page when any page jumps to a corresponding lower-level page; the route stack only stores page information of one upper-level page; When the route stack stores the page information of the first page, determine that the first page is an upper-level page of the second page, and slide the transition picture in a first direction to switch the first page to the second page; When the route stack does not store the page information of the first page, determine that the first page is a lower-level page of the second page, and slide the transition picture in a second direction to switch the first page to the second page, the first direction being opposite to the second direction; The step of sliding the transition picture in the first direction comprises: Obtain rendering information of the second page, and delete information cached by the first page; When sliding the transition picture in the first direction, render the second page according to the rendering information; The step of sliding the transition picture in the second direction comprises: Obtain recorded information of the second page when last time to be jumped to the first page stored in a cache component; the recorded information comprising page information and operation information of the second page; When sliding the transition picture in the second direction, render the second page according to the recorded information; During the sliding process of the transition picture, control a graphics processing unit of a browser in which the second page is located to increase a sliding speed of the transition picture; Further comprise: After the first page is switched to the second page, release first stack information of the first page in the route stack, wherein when a page is displayed, stack information of the page is stored in the route stack; Store second stack information of the second page to the route stack, the route stack only storing stack information of a currently displayed page.

2. The page jump method of claim 1, wherein, Before the step of obtaining recorded information of the second page when last time to be jumped to the first page stored in a cache component, further comprise: Upon receiving an instruction of jumping from the second page currently displayed to the first page, obtain page information and operation information of the second page as recorded information; Store the recorded information in the cache component.

3. A page jump apparatus characterized by comprising: Comprise: A determination module, configured to, upon receiving a page jump instruction, determine a transition picture according to a first page currently displayed and a second page to be jumped corresponding to the page jump instruction, the transition picture being obtained by horizontally aligning and splicing the first page and the second page; The determining module is further configured to determine whether a routing stack stores page information of the first page, wherein the routing stack is configured to record page information of an upper-level page when any page jumps to a corresponding lower-level page, and the routing stack stores only page information of one upper-level page. The sliding module is configured to determine that the first page is an upper-level page of the second page when the routing stack stores the page information of the first page, and slide the transition picture in a first direction to switch the first page to the second page. The sliding module is further configured to determine that the first page is a lower-level page of the second page when the routing stack does not store the page information of the first page, and slide the transition picture in a second direction to switch the first page to the second page, wherein the first direction is opposite to the second direction. When the transition picture is slid in the first direction, the sliding module is specifically configured to obtain rendering information of the second page, and delete information cached by the first page; and when the transition picture is slid in the first direction, render the second page according to the rendering information. When the transition picture is slid in the second direction, the sliding module is specifically configured to obtain recorded information of the second page when the second page is to be jumped to the first page last time, and the recorded information includes page information and operation information of the second page; and when the transition picture is slid in the second direction, render the second page according to the recorded information. The sliding module is further configured to control a graphic processing unit of a browser in which the second page is located to increase a sliding speed of the transition picture during a sliding process of the transition picture. The device further includes: A releasing module is configured to release first stack information of the first page in the routing stack after the first page is switched to the second page, wherein the stack information of the page is stored in the routing stack when the page is displayed. A storage module is configured to store second stack information of the second page in the routing stack, and the routing stack stores only stack information of a currently displayed page.

4. A page jump apparatus characterized by comprising: The device includes: A memory and a processor; The memory stores computer execution instructions; The processor executes the computer execution instructions stored in the memory, so that the processor executes the page jump method in claim 1 or 2.

5. A computer readable storage medium, characterized in that, The computer readable storage medium stores computer execution instructions, and the computer execution instructions are executed by the processor to implement the page jump method in claim 1 or 2.

6. A computer program product comprising a computer program, characterized in that, The computer program is executed by the processor to implement the page jump method in claim 1 or 2.

Images