- Two methods can be used to manage the browser "Back" button
- Example of desynchronization
Managing the browser "Back" button
The browser "Back" button allows the Web users to display the pages that have already been visited.
In a WEBDEV site in Session mode, each HTML page displayed on the browser is associated with a page context, found on the server. Each action performed in a page displayed by the browser must trigger an identical action on the corresponding page context found on the server.
However, the browser "Back" button is used to perform an action on the browser only: the page displayed in the browser and its context found on the server can be desynchronized when using the browser "Back" button.
Special case: Single Page App sites: A Single Page App corresponds to a single page! Therefore, the Back button returns to the page displayed when starting the application! To manage the "Back" button properly, see Single Page App.
Two methods can be used to manage the browser "Back" button
To avoid any out-of-sync problems between the pages displayed on the browser and the corresponding contexts found on the server, WEBDEV proposes two methods for managing the browser "Back" key:
- Solution 1: Prevent from using the browser "Back" button to go back to this page.
If the browser "Back" button is used to display the previous page, this action will have no effect.
For more details, see: Prevent from using the browser "Back" button.
- Solution 2: Managing the synchronization (default solution)
For each action performed in a page from the browser, a synchronization test is automatically run between the HTML page and its context.
Two modes can be used to manage the synchronization:
- default synchronization (mode used by default when creating a new page).
- programmed synchronization.
For more details, see: Managing the synchronization
Example of desynchronization
Let's see a site example:
- A browser page contains a browsing Table control linked to the ITEM file and a "Next" link.
- The ITEM file contains a single item, each record includes a letter of the alphabet.
- The page is used to display 6 rows of the Table control, the "Next" link is used to display the next 6 rows.
When opening the page, the Table control displays the 6 first records of the file (from 'A' to 'F'). Let's see the sequence of actions performed by the user:
- Click on the "Next" link
Result: the server is positioned on the next 6 records of the ITEM file and returns their contents to the browser. The browser displays the next page of the Table control with the 6 new contents ('G' to 'L').
- Click on the browser "Back" button
Result: the browser displays the page preceding the first action. The Table control displayed contains the letters 'A' to 'F'. The server was not contacted, therefore it is still positioned on the records 'G' to L'.
- Click on the "Next" link
Result: the server is positioned on the next 6 records of ITEM ('M' to 'R'). The browser is synchronized with the server and it displays the same elements: the Web user has the feeling that some information is missing.
This behavior can have unexpected consequences when modifying a file record (modification of a record other than the one viewed by the Web user for example).
Reminder: each action on the browser must trigger a server action: the server sends a response to the browser. The click on the browser "Back" button being a browser action independent of your WEBDEV site, the second condition may not be performed.