monitoraggio history.pushstate da un'estensione cromata

Question

Sto sviluppando un'estensione Chrome per modificare Facebook. Tuttavia, la cattura di azioni di navigazione all'interno di siti abilitati a HTML5 come Facebook richiede una sostituzione di window.history.pushState come spiegato in this SO question.

Sfortunatamente, sembra che i mondi isolati di Chrome impediscano questo tipo di override. Esiste un altro metodo per rilevare i cambiamenti della cronologia (oltre al polling document.location.href)?

Answer 1

Sì,

Un modo è quello di creare un tag script e inserire il codice c'è:

html = "window.history.pushState = function(a,b,c) { alert('Change !'); };"; 

var headID = document.getElementsByTagName("head")[0];   
var newScript = document.createElement('script'); 
newScript.type = 'text/javascript'; 
newScript.innerHTML = html; 
headID.appendChild(newScript); 

Answer 2

Per continuare con l'azione di default, salvare un riferimento alla funzione pushState originale, e quindi chiamare IT:

var headID = document.getElementsByTagName("head")[0];   
var newScript = document.createElement('script'); 
newScript.type = 'text/javascript'; 
newScript.src = chrome.extension.getURL('script.js'); 
headID.appendChild(newScript); 

script.js:

window.history.pushState = (function(nativePushState) { 
    return function(a,b,c) { 
     // Do something 
     nativePushState.apply(this, arguments); //Continue by calling native history.pushState 
    }; 
})(window.history.pushState) 

Answer 3

Non è sicuro se si cerca di fare questo in background.js o content.js, ma se è la prima, è possibile farlo utilizzando eventi webNavigation:

È necessario impostare le autorizzazioni per webNavigation in manifesto. jSON:

"permissions": [ 
    "webNavigation" 
    ], 

Poi nel background.js:

chrome.webNavigation.onHistoryStateUpdated.addListener(function(details) { 
     console.log('Page uses History API and we heard a pushSate/replaceState.'); 
     // do your thing 
    }); 

Fonte: Chrome Extension docs for webNavigation