TWI720721B - Browsing operating system for web applications and method thereof - Google Patents

Abstract

This invention provides a browsing operating system for web applications and a method thereof that after a webpage application is loaded in a browser, a probe page is added to the previous and next page, respectively, of the current webpage records of the browser's browsing history, such that when a user clicks the back button or the forward button of the browser, the browsing operation will not be performed in the original browsing order, instead, the browsing operation is performed according to the predefined browsing path of the web application so as to improve the user experience of using the web application and increase the efficiency of the web application. This invention also provides a browsing operating method for a web application.

Description

Browsing operating system and method for webpage application

The present invention relates to the technology of browsing context-oriented web pages, and more particularly to a browsing operating system and method for web application programs.

At present, various internal service or customer service information systems of enterprises generally use web applications as user interfaces, and most of today's web applications need to be browsed through a browser.

In the conventional browser, the browser includes a back button, a forward button, a address bar, and a web page display area. When entering a web address in the address bar, the server will obtain the web page corresponding to the web address and display it in the web page display area, and at the same time record the web address in the browser's history. The browser will record the URLs of web pages that have been browsed in the order of browsing and store them in the history. Browser history is generally a stacked data structure for storing URLs and statuses, URLs with indicators pointing to currently browsed webpages, and operation history records that can replace current records, add records, and move indicators, and change browser browsing pages.

For example, the user can browse the previously opened web pages in the order of the URLs recorded in the history through the back or forward buttons of the browser. In this case, if the calendar If the current webpage in the history record has a previous page, the back button will be available. At this time, if the user clicks the back button, the browser will move the current webpage indicator to point to the previous page, request the URL of the previous page and display it The webpage of the previous page is in the webpage display area. Similarly, if the current webpage in the history has a next page, the forward button will be available. At this time, if the user clicks the forward button, the browser will move the current page indicator to point to the next page and request the next page The URL to display the next page in the page display area.

However, today's web applications usually contain more than one web page. Generally speaking, a web application will design a set of browsing context, such as a tree browsing context, to guide the user to browse the entire web application. For example, each web page in the web application will have its own button or link set so that the user can click the button or link in the browser to navigate to the next web page according to the web application's intention to guide the user's browsing context.

In one case, if you want to browse a web application with a tree browsing context, the user must enter from the root page of the web application (for example, the portal page), click a button or link in the web page to browse, so that the browser can record The correct browsing sequence (that is, the browsing path) is in the history record, causing the user to click the back button or the forward button to follow the browsing path to the webpage to be browsed (for example, back to the portal webpage).

However, in this case, if the user does not start browsing from the portal page (for example, from another page of the web application), since the history record does not fully record the browsing path of the web application, the user clicks the back button to browse The browser will leave the web application and cannot return to the portal page. In addition, if the browser has not recorded the previous browsing history when browsing the page, the forward button will become unavailable, wasting the design of the forward button.

On the other hand, if the user wants to quickly find the webpage he wants to go to (for example, back to the portal page), he must first browse all the webpages in the browsing path, or the web application needs to set up links or buttons on the webpage. To help guide users, thus affecting the user experience. Although the browser provides a drop-down list of history records to help find the previous URL records, the user may not know clearly that the URL or page title displayed in the list represents the portal page, and when the user is on a mobile phone or other special When browsing web applications on the device, due to the design of the browser, it is not so easy to open the history list to perform quick web-oriented operations.

Therefore, how to design a browsing operating system and method for web applications so that the browsing control of the browser can be integrated into the web applications, so that it can become a holistic application and improve the user’s browsing experience, and increase the efficiency of the web application Efficiency has become one of the important issues in related fields.

In order to solve at least the above-mentioned problems, the present invention provides a browsing operating system for web applications, including: web pages for loading into browsers including back button, forward button, web page display area and history records; and navigation The module is included in the webpage, and includes: a loading event processing unit, which is used to create in the history record when detecting the loading event that the webpage is loaded into the webpage display area by the browser Detecting the structure of the webpage; a detection event processing unit for detecting a detection event triggered by the click of the back button or the forward button; and a browsing context calculation unit, which is connected to the detection event processing unit, wherein the detection event is processed When the unit detects the detection event, it makes the browsing context calculation unit calculate the web application The URL of the next webpage of the program is provided by the detection event processing unit for the browser to load into the webpage display area and update the detection webpage structure.

In one embodiment, the browsing context calculation unit further includes a browsing context model, and the browsing context model stores a browsing path predefined by the web application.

In one embodiment, the detection event includes a backward detection and a forward detection. In a further embodiment, the browsing context calculation unit calculates the URL of the next webpage to which the backward detection or the forward detection will go according to the browsing path and the usage status of the webpage.

In one embodiment, the loading event includes the first loading and repeated loading of the webpage. In a further embodiment, the detection webpage structure includes a back detection webpage record, a target webpage record, and a forward webpage record with the same URL but different tags.

In one embodiment, the detection event is moved by the browser in response to the back button or the forward button being clicked to move the current webpage index in the history record from the target webpage record to the back detection webpage record or the forward detection Triggered by web records.

The present invention further provides a browsing operation method for a webpage application, including: providing a webpage including a navigation module of the webpage application for the browser to load into the webpage display area of the browser; When a web page is loaded by the browser, the navigation module creates a detection page structure in the browser’s history; it is triggered by detecting that the browser’s back button or forward button is clicked When detecting the event, the navigation module calculates the URL of the next web page of the web application; and provides the next web page of the web application for the browser to load into the web display area, and the The navigation module updates the structure of the detected webpage.

In one embodiment, establishing the detection webpage structure includes: replacing the current webpage record of the webpage in the history record with the back detection webpage record; adding the target webpage record of the webpage to the history record; and in the history record Join the forward detection page record of the page Records, where the backward detection webpage record, the target webpage record, and the forward detection webpage record all have the same URL as the webpage and are distinguished from each other by different tags.

In one embodiment, the detection event is moved by the browser in response to the back button or the forward button being clicked to move the current webpage indicator in the history record from the target webpage record to the back detection webpage record or the forward Detect triggered by web records.

In one embodiment, the movement of the current webpage index from the target webpage record to the back detection webpage record is back detection, and the movement of the current webpage index from the target webpage record to the forward detection webpage record is Forward detection.

In one embodiment, the navigation module stores a predefined browsing path of the web application program. In a further embodiment, the calculating the URL of the next webpage of the webpage application includes calculating the URL of the next webpage that the webpage application will go back or forward according to the browsing path and the usage status of the webpage.

In one embodiment, the loading event includes the first loading and repeated loading of the webpage.

It can be seen from the above that the present invention mainly implements guided operations by adding navigation modules to each page of the web application, monitoring browser loading events or detection events of the back button and forward button, and operating history records. Therefore, when using the browsing operating system of the present invention, clicking the back button or the forward button will not load the web page in the order of the history record list, but the navigation module will calculate the current web page URL and the operating status of the current web page. URL. For example, in a web application with a tree structure, pressing the back button does not return to the previous page, but instead leads to the root page in the tree structure (or to a subpage or related page based on the operating status of the current web page). Next page). In addition, the navigation module is included in the web page of the web application Download together, so there is no need to install additional browser add-on modules, and there will be no security issues that the browser does not allow to change the navigation operation of the browser back and forward buttons.

100‧‧‧Browser

101‧‧‧Back button

102‧‧‧Forward button

103‧‧‧Address bar

104‧‧‧Webpage display area

200‧‧‧Web

210‧‧‧Navigation Module

211‧‧‧Load event processing unit

212‧‧‧Detection event processing unit

213‧‧‧Browse context calculation unit

214‧‧‧Browse the context model

301‧‧‧Landing page

302‧‧‧Backward detection webpage

303‧‧‧Forward detection webpage

304‧‧‧Current page index

510, 510’‧‧‧Status

710, 710’‧‧‧Status

720, 720’‧‧‧Status

S401~S409‧‧‧Step

S601~S610‧‧‧Step

The present invention can be understood by referring to the following description in conjunction with the accompanying drawings, in which the same reference numerals identify similar elements, and in which:

Figure 1 is a system architecture diagram illustrating the browsing operating system of the present invention according to some embodiments;

Figure 2 is a partial enlarged view illustrating the browsing operating system of the present invention according to some embodiments;

Figure 3 illustrates the implementation of the browsing operating system applying the present invention according to some embodiments;

FIG. 4 is a flowchart illustrating the steps of a usage mode of the browsing operating system of the present invention according to some embodiments;

Figure 5 illustrates another implementation aspect of the browsing operating system using the present invention according to some embodiments;

Fig. 6 is a flowchart illustrating another usage pattern of the browsing operating system of the present invention according to some embodiments; and

FIG. 7 illustrates another implementation aspect of the browsing operating system of the present invention according to some embodiments.

The following specific examples illustrate the implementation of the present invention. Those who are familiar with the art can easily understand the other advantages and effects of this case from the content disclosed in this article. The structure, ratio, size, etc. shown in the drawings in this specification are only used to match the content disclosed in the specification for the understanding and reading of those who are familiar with the art, and are not used to limit the implementation of the present invention. Therefore, any modification, change or adjustment shall still fall within the scope of the technical content disclosed in the present invention, without affecting the effects and objectives that can be achieved in this case.

Fig. 1 is a diagram showing the system architecture of the browsing operating system used in web applications of the present invention.

The web application can be executed through a browser. The browser 100 can be provided with a back button 101, a forward button 102, a address bar 103, and a web page display area 104. The webpage corresponding to the web address loaded in the address bar 103 will be displayed in the webpage display area 104, and the back button 101 and the forward button 102 can provide the user to click to enter the previous browser based on the current browser history of the browser 100 (not shown) One page or the next page. In one embodiment, the browser 100 is displayed on a display, and the display is set in a host with a processor or is electrically connected to a host with a processor.

When a user loads a webpage application through the browser 100, the server returns a corresponding webpage 200 that includes a webpage navigation module 210. The web navigation module 210 can monitor events (for example, detection events) emitted when the back button 101 or the forward button 102 is clicked, and perform guided operations in the web application by operating history records.

The web page navigation module 210 includes a loading event processing unit 211, a detection event processing unit 212, and a browsing context calculation unit 213 to provide corresponding services corresponding to the loading event or detection event of the web application. Specifically, the loading event processing unit 211 can be used for The detection event processing unit 212 can be used to detect the detection event triggered by clicking the back button 101 or the forward button 102 when detecting the loading event issued by the browser 100 when the web page is loaded by the browser 100. And when the detection event processing unit 212 detects the detection event, the browsing context calculation unit 213 is made to calculate the URL of the next webpage, so that the detection event processing unit 212 provides the next webpage for the browser 100 to load and update the detection. Web page structure. In addition, the browsing context calculation unit 213 includes a pre-established browsing context model 214, and the browsing context model 214 defines the browsing path of the web application.

FIG. 2 shows the browsing path of the web application recorded by the browsing context model 214 of the present invention according to some embodiments. As shown in Figure 2, the solid line points to the URL of the next web page that should be displayed in the web page display area when performing backward browsing in the web application, and the dotted line points to the URL of the previous web page that should be displayed in the web page display area when performing forward browsing. According to design requirements, the browsing path of the web application can also determine the web page that should be displayed on the next or previous page according to the current web page usage status. For example, the browsing path can be designed to be the URL of the next page when the judgment variable "LeafOnly" is "true" for the usage status of the current webpage (for example, "http://www.myweb/home/page12") It will be "http://www.myweb/home/page21"; on the contrary, if the judgment variable "LeafOnly" of the current web page usage status is "false", the URL of the next page will be "http://www. .myweb/home/page2". However, the aforementioned judgment of the current web page usage status can also be achieved by using multiple variables or by other judgment mechanisms, and there is no particular limitation.

FIG. 3 is a diagram illustrating the historical record stack data structure created by the browsing operating system of the present invention in response to the processing of the loading event or the detection event according to some embodiments. Different from the historical record stack data structure of conventional browsers (that is, only records that have been browsed are recorded in the order of browsing) Web page URL), the present invention adds a back detection web page 302 and a forward detection web page 303 before and after the target web page 301 to be displayed to form a detection web page structure. The target webpage 301, the backward detection webpage 302, and the forward detection webpage 303 all have the same URL but different tags are added to indicate that the webpage has been processed and the above three different pages can be distinguished. The history record stack data structure of the present invention also has a current web page indicator 304, which points to the target web page 301 after the browsing operating system completes the establishment of the back detection web page 302 and the forward detection web page 303.

Secondly, the browsing operation method for a web application program of the present invention includes: providing a web page including a navigation module of the web application program for the browser to load into the web page display area of the browser; When the loading event issued by the browser is loaded, the navigation module creates a detection page structure in the browser’s history; it is triggered by detecting that the browser’s back button or forward button is clicked When detecting an event, the navigation module calculates the URL of the next web page of the web application; and provides the next web page of the web application for the browser to load into the web display area, and the navigation The module updates the structure of the detection webpage. The detailed steps will be described in detail in Figures 4 to 7.

Figure 4 is a flow chart showing the steps of the browser operating system of the present invention in response to a loading event to establish a detection webpage structure. In one embodiment, the loading event may occur when the web page of the web application is first loaded or reloaded.

In step S401, when the loading event processing unit receives the loading event, it first checks whether the webpage has a mark attached. If there is no mark, it means that the web page is loaded for the first time, and step S402 is executed continuously. In step S402, the loading event processing unit modifies the historical record so that the back-detected webpage record replaces the current webpage record (that is, the unprocessed webpage record in the historical record). Then, step S403 is executed to add the target webpage record that should be displayed to the historical record (for example For example, it is stacked on the back detection webpage record in the history record stack data structure), and the forward detection webpage record is added to the history record in step S404. During the aforementioned steps S402 to S404, the current webpage index corresponding to the creation sequence of the backward detection webpage record, the target webpage record, and the forward detection webpage record points to the corresponding records in order. Since in step S404, the current webpage indicator points to the forward detection webpage record, in step S405, the current webpage indicator is moved back one page to the target webpage record to complete the establishment of the detection webpage structure.

Continuing to refer to FIG. 4, if the loading event processing unit determines in step S401 that the loaded webpage has been tagged, then step S406 is executed to check whether the tag of the webpage is a forward detection webpage. If it is a forward detection webpage, step S407 is executed to move the current webpage index back by two pages, pointing to the backward detection webpage record of the webpage previously added to the history record, and then perform steps S402, S403, S404 and S405 to re-create the backward detection webpage record, Advance detection of webpage records and target webpage records.

On the other hand, if the loading event processing unit determines in step S406 that the mark of the webpage is not a forward detection webpage, step S408 is executed to check whether the webpage is a backward detection webpage. If it is a backward detection webpage, steps S402, S403, S404 and S405 are successively executed to re-create the backward detection webpage record, the forward detection webpage record and the target webpage record. On the contrary, if the mark of the checked webpage in step S408 is not the back detection webpage, it means that the current webpage indicator points to the target webpage record that was added to the history before the webpage. Therefore, step S409 is executed to move the current webpage indicator back one page to the previous history. Record the backward detection webpage, and execute steps S402, S403, S404, and S405 to re-create the backward detection webpage record, the forward detection webpage record, and the target webpage record.

Fig. 5 shows the state change of the historical record before and after the processing procedure shown in Fig. 4 is executed by the loading event processing unit according to some embodiments. For example, when the webpage "http://www.myweb/home/page1" is opened, the history record will be 510 as shown on the left side of Figure 5, with only the target page "http://www.myweb/home/page1" "Is recorded in the history stack structure. After the loading event processing unit executes the processing procedure in Figure 4, the historical record is shown in the state 510' on the right. The current target webpage record has been detected by the back detection webpage record, the target webpage record, and the forward detection webpage record. replace.

Figure 6 is a diagram showing the processing flow steps of the detection event processing unit in response to the detection event according to some embodiments. In one embodiment, the detection event can occur when the user clicks the back button or the forward button on the browser to move the current web page indicator in the history record, or the web application moves the current web page indicator in the history record according to the operation needs. Time (for example, the aforementioned load event processing unit moves the current web page indicator when executing the processing of the load event).

Specifically, the detection event processing unit will receive the event that the current webpage indicator is moved, and determine in step S601 whether these events are triggered by the back button or the forward button, and in the event that the event is not triggered by the back button or the forward button The processing of the detection event is ended. The judgment method is: the web application will set up a flag before moving the current web page indicator according to the operation needs, and remove the flag after the current web page indicator is moved. Therefore, checking the flag is The trigger source of the detection event can be judged.

Then, if it is determined that the detection event is triggered by the back button or the forward button, step S602 is executed to determine whether the current web page indicator points to the back detection web page record (ie, the back detection when the user clicks the back button). If it is a backward detection, step S610 is executed to call the browsing context calculation unit to store the browsing path of the web application according to the browsing context model (e.g. For example, as shown in Figure 2) Calculate the URL of the new target webpage after the current webpage is backed up, and then perform steps S604, S605, S606, and S607 to re-create a new backpage detection webpage record, a new forward detection webpage record, and a new webpage record in the history record. Landing page records. In addition, steps S604, S605, S606, and S607 are the same as the steps S402, S403, S404, and S405 in Figure 4 above for establishing a backward detection webpage record, a forward detection webpage record, and a target webpage record, and will not be repeated here.

Continuing to refer to Figure 6, when the detection event processing unit determines in step S602 that the current web page indicator does not point to the backward detection web page record, step S608 is executed to determine whether the current web page indicator points to the forward web page record (that is, the user clicks the forward button to go forward). Detection). If it is forward detection, step S608 is executed to call the browsing context calculation unit to calculate the URL of the new target webpage after the current webpage is forwarded according to the browsing path of the webpage application stored in the browsing context model (for example, as shown in Figure 2). In an embodiment, the web application may have different forward browsing paths according to the current web page usage status, for example, in the browsing path shown in Figure 2, the current web page "http://www.myweb/home/page12" When the judgment variable "LeafOnly" is "true", the URL of the new target webpage that is forwarded will be "http://www.myweb/home/page21"; on the contrary, if the judgment variable of the current webpage is used When "LeafOnly" is "false", the URL of the new target webpage will be "http://www.myweb/home/page2". After the browsing context calculation unit has completed calculating the URL of the new target webpage, the detection event processing unit then executes step S609, which points the current webpage index back two pages to the back detection webpage record of the current webpage added to the previous history record, and executes steps S604, S605, S606 and S607 can re-create a new backward detection webpage record, a new forward detection webpage record and a new target webpage record in the historical record.

Fig. 7 shows the state changes of the history records before and after the processing procedure of Fig. 6 is executed by the detection event processing unit according to some embodiments.

In some embodiments, the state 710 on the upper left side of Fig. 7 represents the state of the history record when the back button is pressed. At this time, the current webpage index is recorded from the target webpage (in one embodiment, it is recorded in the browsing path in Fig. 2 The URL "http://www.myweb/home/page12") is moved to the back detection webpage record and triggers back detection. The status 710' on the upper right side of Figure 7 represents the status of the new back detection web page record, the new forward detection web page record, and the history record of the new target web page record created after the detection event processing unit completes back detection. At this time, the new target web page record has been Change to the new URL "http://www.myweb/home/pagel" after the back, and the current page indicators have also pointed to the new landing page record.

The state 720 on the lower left side of Figure 7 represents the state of the history record when the forward button is pressed. At this time, the current web page index is recorded from the target web page (for example, the URL recorded in the browsing path in Figure 2 "http://www.myweb/" "home/page12", and the current web page usage status is "LeafOnly=true") is moved to the forward detection webpage record and triggers forward detection. Similarly, the state 720' on the lower right side of Figure 7 represents the state of the new forward detection webpage record, the new backward detection webpage record, and the history record after the new target webpage record after the detection event processing unit completes the forward detection. At this time, the new The landing page record has been changed to the new URL "http://www.myweb/home/page21" after the forwarding, and the current page indicators have also pointed to the new landing page record.

In summary, the browsing operating system of the present invention mainly adds navigation modules to each web page of the web application, and monitors browser loading events or back buttons and forwards. The detection event of the button, through the operation history record to achieve the oriented operation. Therefore, when using the browsing operating system of the present invention, clicking the back button or the forward button will not load the web page in the order of the history record list, but the navigation module calculates the desire based on the current web page URL and the operating status of the current web page. The URL to go to. For example, in a web application with a tree structure, pressing the back button does not return to the previous page, but instead leads to the root page in the tree structure (or to a subpage or related page based on the operating status of the current web page). Next page). In addition, the navigation module is included in the web page and downloaded together, so there is no need to install additional browser add-on modules, and there will be no security issues that the browser does not allow to change the navigation operation of the browser back and forward buttons.

The above-mentioned embodiments are used to exemplify the principles and effects of the present invention, but not to limit the present invention. Anyone who is familiar with this technique can modify the above-mentioned embodiments without departing from the spirit and scope of the present invention. Therefore, the scope of protection of the rights of the present invention should be listed in the scope of patent application described later.

100‧‧‧Browser

101‧‧‧Back button

102‧‧‧Forward button

103‧‧‧Address bar

104‧‧‧Webpage display area

200‧‧‧Web

210‧‧‧Navigation Module

211‧‧‧Load event processing unit

212‧‧‧Detection event processing unit

213‧‧‧Browse context calculation unit

214‧‧‧Browse the context model

Claims (11)

A browsing operating system for web applications, including: a web page for carrying people to a browser including a back button, a forward button, a web page display area, and history records; and a navigation module included in the web page, It also includes: a loading event processing unit for establishing a detection webpage structure in the history record when detecting a loading event that the webpage is loaded into the webpage display area by the browser; a detection event processing unit, For detecting the detection event triggered by the click of the back button or the forward button; and a browsing context calculation unit connected to the detection event processing unit, wherein the browsing context calculation unit further includes a browsing context model, the browsing context The model stores the pre-defined browsing path of the web application program, and wherein, when the detection event processing unit detects the detection event, the browsing context calculation unit is made to calculate the next web page of the web application program based on the browsing path The website address is used by the detection event processing unit to provide the next webpage for the browser to load into the webpage display area of the browser and update the detection webpage structure. For example, the browsing operating system described in item 1 of the scope of patent application, wherein the detection event includes back detection and forward detection, and the browsing context calculation unit calculates the back detection or the forward detection according to the browsing path and the usage status of the webpage The URL of the next page that will go to. Such as the browsing operating system described in item 1 of the scope of patent application, wherein the loading event includes the first loading and repeated loading of the webpage, and the detection webpage structure includes the detection webpage with the same URL but different tags. Record, landing page record and forward page record. For example, the browsing operating system described in item 3 of the scope of patent application, wherein the detection event is recorded by the browser in response to the back button or the forward button being clicked and the current web page indicator in the history record from the target web page Move to the back detection web page record or the forward detection web page record to trigger. For example, the browsing operating system described in item 1 of the scope of patent application, wherein the browser includes a web address bar for entering the web address to load the webpage of the webpage application. A browsing operation method for a webpage application program, comprising: providing a webpage including a navigation module of the webpage application program for the browser to load into the webpage display area of the browser, wherein the navigation module is Store the pre-defined browsing path of the webpage application; when detecting the loading event that the webpage is loaded by the browser, the navigation module builds the detection webpage structure in the browser's history record; When detecting a detection event triggered by the browser’s back button or forward button being clicked, the navigation module calculates the URL of the next web page of the web application based on the browsing path; and provides the web application’s URL The next webpage is loaded into the webpage display area by the browser, and the detection webpage structure is updated by the navigation module. For example, the browsing operation method described in item 6 of the scope of patent application, wherein, establishing the structure of the detection webpage includes: Replace the current webpage record of the webpage in the history record with the back detection webpage record; add the target webpage record of the webpage in the history record; and add the forward detection webpage record of the webpage to the history record, where the backpage The detection webpage record, the target webpage record, and the forward detection webpage record all have the same URL as the webpage and are distinguished from each other by different tags. For example, the browsing operation method described in item 7 of the scope of patent application, wherein the detection event is recorded by the browser in response to the back button or the forward button being clicked and the current webpage index in the history record from the target webpage It is triggered by moving to the backward detection webpage record or the forward detection webpage record. For example, the browsing operation method described in item 8 of the scope of patent application, wherein the situation in which the current webpage indicator moves from the target webpage record to the back detection webpage record is back detection, and the current webpage indicator moves from the target webpage record The situation of the forward detection web page record is the forward detection. For example, the browsing operation method described in item 6 of the scope of patent application, wherein the calculation of the URL of the next webpage of the web application includes the calculation of the web application going back or forward according to the browsing path and the usage status of the webpage The URL of the next page. According to the browsing operation method described in item 6 of the scope of patent application, the loading event includes the first loading and repeated loading of the webpage.

Images