Greasemonkey Uživatelské skriptování (nejen) ve Firefoxu
Úvod Co jsou uživatelské skripty? Umožňují spouštět uživatelem definované skripty na(cizích) webových stránkách Typicky v JavaScriptu K čemu je to dobré? Přidání funkčnosti, změna vzhledu,... Co je Greasemonkey? Rozšíření do Firefoxu, které toto umožňuje Sám od sebe nedělá nic, jen zprostředkovává spouštění skriptů
Motivace Čeho se dá s Greasemonkey dosáhnout? Book Burro
Hello World skript v Greasemonkey helloworld.user.js // ==UserScript== // @name Hello World // @description display "Hello World" on every page // @include * // ==/UserScript== alert('hello, world!');
Instalace a spuštění skriptu Instalace se spustí automaticky při otevření libovolného souboru *.user.js ve Firefoxu (pokud je nainstalován Greasemonkey plugin)
Metadata U každého skriptu jsou metainformace, které určují název skriptu, kdy se má spouštět, // ==UserScript== // @name Hello World // @namespace http://www.example.com/ // @description "Hello World" on every page // @include * // @exclude http://google.com/* // @exclude http://www.google.com/* // ==/UserScript== @exclude má přednost před @include
Příklad využití Greasemonkey Google Image Search Odkazy z obrázků vedou na frameset, kde je thumbnail a až po kliknutí na něj se zobrazí žádáný obrázek Chceme změnit toto chování, aby odkaz vedl rovnou na cílový obrázek
Podrobnosti o Google Image Search Obrázky mají link na takovouto URL: /imgres?imgurl=http://ex.com/image.gif&imgrefurl=http://ex.com/index.html Stačí najít všechny elementy <a>, které mají odkaz na URL tohoto formátu, a změnit jim atribut href Pro nalezení elementů lze použít document.getelementsbytagname('a'), nebo document.evaluate document.evaluateje k dispozici pouze ve Firefoxu a vyhodnocuje Xpath výrazy
Uživatelský skript pro Google Image Search // ==UserScript== // @name Google Image Search Upgrade // @include http://images.google.*/* // ==/UserScript== nodes = document.getelementsbytagname('a'); for (var i = 0; i < nodes.length; i++) for (var i = 0; i < nodes.length; i++) { var linkelement = nodes[i]; var match = linkelement.href.match( /\/imgres\?imgurl\=(.*?)\&imgrefurl\=/ ); if (match) linkelement.href = decodeuri(match[1]); }
Greasemonkey API GM_log(message); Zapíše zprávu do JavaScriptové konzole, ladící účely GM_getValue(key, defaultvalue); GM_setValue(key, value); Uloží nebo načte konfigurační hodnotu, ukládají se trvale, specifické pro jednotlivé skripty, k dispozici v přehledu konfigurace about:config GM_registerMenuCommand(menuText, callbackfunction); Umožňuje přidat do menu Nástroje GreaseMonkey Příkazy uživatelských skriptůpoložku, která spustí zadanou funkci GM_xmlhttpRequest(details); Provede HTTP požadavek (GET nebo POST) na libovolné URL (bez bezpečnostních omezení!)
Použití API Chceme za každý odkaz připsat velikost dokumentu, na který odkaz směřuje (GM_xmlhttpRequest) Možnost vypnout a zapnout (GM_registerMenuCommand), toto nastavení aby se ukládalo (GM_setValue, GM_getValue) Logovat všechny tyto odkazy (GM_log)
Použití API řešení // ==UserScript== // @name Linker // @include http://www.google.com/ // ==/UserScript== GM_registerMenuCommand("Enable Linker", function() { GM_setValue("enabled", true); }); GM_registerMenuCommand("Disable Linker", function() { GM_setValue("enabled", false); }); function MakeRequest(linkElement) { GM_xmlhttpRequest({ method: 'GET', url: linkelement.href, onload: function(responsedetails) { GM_log(linkElement.href + ": " + responsedetails.responsetext.length); linkelement.innerhtml += " (" + responsedetails.responsetext.length + " bytes)"; } }); } if (GM_getValue("enabled", false)) { GM_log("Linker is enabled, processing all links."); nodes = document.getelementsbytagname('a'); for (var i = 0; i < nodes.length; i++) MakeRequest(nodes[i]); }
Bezpečnost uživatelských skriptů Greasemonkey spouští skripty v sandboxu, cílový web k nim nemá přístup Všechny API funkce jsou přístupné pouze z tohoto sandboxu Je zakázáno přepisování metod a vlastností objektů document a window Kvůli sandboxu je prostředí uživatelských skriptů mírně pozměněno
Drobné rozdíly v DOM/JavaScriptu Nefunguje string eval na funkce window.settimeout("func", 1000); window.settimeout(func, 1000); Nelze přistupovast přímo k event-handlerům e.onclick = 'func(this)'; e.onclick = func; e.addeventlistener("click", func, true); K vlastním atributům elementů lze přistupovat pouze pomocí.setattribute a.getattribute Nelze iterovat pomocí for (var e in elements)
Drobné rozdíly v DOM/JavaScriptu, #2 K formulářům a jejich prvkům je nutné přistupovat přes document.forms.nameditem("form1")a f.elements.nameditem("input1") Nefunguje window.location = "...", používat window.location.href = "..." Proměnné unsafewindow, unsafedocument Nefunguje e.setattribute("style", "color: blue;"), používat e.style.color = 'blue'
Kompilace skriptů Greasemonkey Compiler Webová aplikace, z uživatelského skriptu (*.user.js) vytvoří samostatné rozšíření do Firefoxu (*.xpi)
Neocenitelní pomocníci při vývoji uživatelských skriptů DOM Inspector Pro procházení DOM stromu dokumentu Firebug Inspect Elementnajde element v DOM stromu, živé editování JavaScript Shell Bookmarklet, umožňuje vyhodnocovat JavaScriptové příkazy v kontextu aktuálního dokumentu, umí zobrazit všechny metody a vlastnosti nějakého objektu Web Developer Toolbar View Generated Sourcezobrazí HTML obsah dokumentu po vykonání JavaScriptu
Uživatelské skriptování v jiných prohlížečích Opera Od verze 8 má vestavěnou podporu uživatelských skriptů, nemá GM API Internet Explorer Greasemonkey for IE, Trixie, Turnabout (včetně GM API) Safari GreaseKit Konqueror Konqueror Userscript
Možné problémy Některé služby zakazují používání uživatelských skriptů Např. webové hry, internetové obchody Změny na webu způsobí nefunkčnost GM skriptů Bezpečnostní riziko Špatně napsané uživatelské skripty mohou webové stránce zpřístupnit nepovolené údaje nebo funkce (GM_xmlhttpRequest)
Odkazy GM Homepage http://www.greasespot.net/ GM Wiki http://wiki.greasespot.net/ Kniha/manuál ke Greasemonkey http://diveintogreasemonkey.org/ Kniha Greasemonkey Hacks (O'Reilly 2005) Databáze uživatelských skriptů http://userscripts.org/, http://userjs.org/
Otázky?