How to run window.history (javascript) if user clicks back button?

Question

I want to run the following:

window.history.go(-2);

on pages which the script is being run, when the user clicks the back button in a Chrome Extension. How can I do this?

(note: there is a page linked, but this is a different situation then that question.)

I've summarized the (now deleted) conversation in [this answer](http://stackoverflow.com/a/16295004/938089). The code in the answer really fetched the resource from the server, because of the cache breaker. Did you have any reason to repost this question? Please be more specific than "it doesn't work!". — Rob W, May 03 '13 at 22:09
That does not answer the question. You're trying to give me a separate method. However, I do not want a separate method. I want the answer to **this** question. Specifically. Your other method does not apply here. — , May 03 '13 at 22:10
It's not possible to distinguish between Back and Forward. If you find a creative solution to combat this problem, have a look at the [`chrome.webNavigation` API](https://developer.chrome.com/extensions/webNavigation.html), and filter by transition type "forward_back". — Rob W, May 03 '13 at 22:16
You gave an irrelevant response that did not answer my question. Your answer is valid (supported, etc.) **but does not in any way pertain to my question**. Perhaps you should drop the attitude. `Metaphorically and rhetorically speaking, if I ask for red and you give me blue, then that doesn't help me at all, does it?` — , May 03 '13 at 22:40

score 2 · Answer 1 · edited May 23 '17 at 11:49

The back button fires a browser level event meaning that it cannot be listened to at a content script level. You can, however, listen to it in a background script, but only in a limited way. The only point at which you become aware that the forward or back buttons were pressed is during the chrome.webNavigation.onCommitted event. At this point in the navigation process the new page has already been at least partially loaded and the new document has already been swapped in. This means that any changes we make using the knowledge of the back button press will only happen after the previous page has loaded, not the most seamless experience.

An example of determining if the back button was pressed and then going back twice instead is as follows:

content script

chrome.runtime.sendMessage({method:'setReferrer',referrer:document.referrer});

background.js

var referrer;
chrome.runtime.onMessage.addListener(function(message,sender,sendResponse){
  if(message.method == 'setReferrer')
    referrer = message.referrer;
});

chrome.webNavigation.onCommitted.addListener(function(details) {
  if(details.url == referrer && details.transitionQualifiers[0]=='forward_back')
    chrome.tabs.executeScript(details.tabId,{code:'window.history.go(-1);'}); 
});

This uses the referrer to gain knowledge of the previous url and compare it to the url of the currently loading page. The only time it would be incorrect is if you use the forward button to go to the same page that was the previous page, an event I consider highly unlikely. This has the limitation of needing to load, or at least partially load, the previous page before going back once more. You could potentially compare the url from the chrome.webNavigation.onBeforeNavigate event instead, but that would lead to a bunch of false positives and make it very difficult to directly navigate to that particular page again.

A much more elegant solution would be to do as Rob suggests and instead use location.replace on the middle page so that there is no history for that particular page and hitting back once would do exactly what you want.

How to run window.history (javascript) if user clicks back button?

1 Answers1