N solutions to web page back without refreshing

fromN solutions to web page back without refreshing

When a page needs to be backed up, you can call the go and back methods of the history object to control page back.

window.history.go(- 1);
window.history.back();
Copy the code

However, in some mobile browsers and WebViews, the page is backward but not refreshed, but cached.

Here’s a summary of several ways to force a page back to refresh the previous page.

Plan 1: Jump to the source page

When page A opens page B, the Document. referrer in page B is page A, and the previous page can be refreshed by actively jumping to The Document. referrer, but the side effect is that additional historical records will be generated, leading to the return to the current page when clicking back again.

window.location.href = document.referrer
Copy the code

Compatibility:

Scheme 2: Listen for page PagesHow eventsThe mobile side returns the forced refresh page pageshow event persisted always false solution

When page A opens page B, the PagesHow event is listened on page A. When page B returns to page A, the PagesHow event is triggered.

window.addEventListener('pageshow'.function(e) {
   if (e.persisted) {
      window.location.reload(); }});Copy the code

Compatibility:

Solution 3: Use the History object to modify the current History

When page A opens page B, replace the current historical record point first and then open page B.

var  json={time:newDate().getTime()};
window.history.replaceState(json,"".window.location.href+"&t="+newDate().getTime());
window.location.href= url;
Copy the code

Compatibility:

Plan 4:

If it is in the APP of your own company, you can agree with the APP to splice a field in the URL. When the APP detects this field, it is forced to trigger the page refresh at the APP level.