dodanie niestandardowej funkcjonalności do konsoli Chrome

Question

Czy możliwe jest posiadanie niestandardowych funkcji w google-chrome, które będą zawsze dostępne w konsoli (bez względu na załadowaną stronę)? Na przykład chciałbym mieć funkcję o nazwie echo, która byłaby tylko opakowaniem wokół pliku console.log. To po prostu oszczędza trochę pisania, ale później mogę chcieć stworzyć użyteczną funkcjonalność debugowania.

Answer 1

Cóż, łatwo to zrobić. To, czego potrzebujesz, to stworzyć content script. Ten skrypt zostanie wprowadzony na dowolnej stronie i utworzy niezbędne funkcje globalne, których użyjesz w konsoli. Najtrudniejszą częścią jest to, jak sprawić, by te funkcje scrtipt do zawartości niestandardowej były częścią rzeczywistego obiektu window, ponieważ zwykle nie można uzyskać dostępu do funkcji lub zmiennych zdefiniowanych w skrypcie treści z reszty kodu javascript, który nie znajduje się w treści. scenariusz. Skrypty treści działają w tak zwanym środowisku izolowanym.

Skrypty treści są wykonywane w specjalnym środowisku zwanym izolowanym światem. Mają dostęp do DOM strony, do której są wstrzykiwani, ale nie do żadnych zmiennych JavaScript ani funkcji tworzonych przez stronę. Wygląda na każdy skrypt treści tak, jakby na stronie, na której jest uruchomiony, nie ma innych skryptów JavaScript. To samo dotyczy odwrotnej strony: JavaScript działający na stronie nie może wywoływać żadnych funkcji ani dostępu do zmiennych zdefiniowanych przez skrypty treści.

Ale istnieje wymyślne rozwiązanie.
zdefiniować swój plik manifestu następująco:

manifest.json

{ 
    "name": "Content script", 
    "version": "0.1", 
    "manifest_version": 2, 
    "content_scripts": [{ 
     "matches": ["http://*/*"], 
     "js": ["console.js"] 
    }] 
} 

I skrypt treści:

console.js

function customConsole() { 
    window.myNewFunction = function() { 
     console.log("Hello I'm available from console."); 
    }; 
} 

var script = document.createElement('script'), 
    code = document.createTextNode('(' + customConsole + ')();'); 
script.appendChild(code); 
(document.body || document.head || document.documentElement).appendChild(script); 

więc określić twoje nowe funkcje jako funkcje globalne, więc t Kapelusz, którego możesz użyć w console.
Zobacz także ten post