2014. január 5., vasárnap

Chrome felhasználói szkriptek

Néhány napja támadt egy ötletem, miszerint egy weboldalt kiegészítenék egy mini-funkcióval (talán majd egy későbbi posztban írok erről is). Ehhez gondoltam, telepítem a Tampermonkey-t, ami a Greasemonkey Firefox add-on Chrome-ra íródott változata, ami felhasználói szkripteket (userscript) tud futtatni a böngészőben. Viszont valahol rábukkantam arra az infóra, hogy nem is kell Tampermonkey felhasználói szkriptek használatához! Alább ismertetem, hogyan lehet egyszerűen kiegészítő szkripteket írni weboldalakhoz. :)


1. Felhasználói szkript megírása

Első lépés egy *.user.js fájl létrehozása, ugyanis a Chrome csak ilyen végződésű fájlokat ismer fel telepíthető felhasználói szkriptként. A szkript elején szerepelnie kell egy ilyen definíciós blokknak:
// ==UserScript==
// @name         Kiegészítő neve
// @namespace    http://keszito.honlapja.hu/
// @version      1.0
// @description  Kiegészítő rövid ismertetése
// @match        http://melyik.oldalon.fusson.hu/*
// @copyright    YYYY.MM.DD., készítő neve
// ==/UserScript==
Ezután következhet is a szkript, ami lefut a megadott oldalon, oldalakon. Ha több oldalon akarjuk futtatni, akkor megadhatunk több @match definíciót. Léteznek még egyébként letöltő/frissítő URL paraméterek is, de a Chrome jelenleg nem képes frissíteni a felhasználói szkripteket. Ezen felül, ami még hasznos lehetne, a @require, amivel be lehetne hívni pl. a jQuery-t egyszerűen, de ezt sem támogatja a Chrome. Szerencsére a jQuery behívásához már egy ügyes emberke megírta a szkript keretet:
function addJQuery(callback) {
    var script = document.createElement("script");
    script.setAttribute("src", "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js");
    script.addEventListener('load', function() {
        var script = document.createElement("script");
        script.textContent = "window.jQ=jQuery.noConflict(true);(" + callback.toString() + ")();";
        document.body.appendChild(script);
    }, false);
    document.body.appendChild(script);
}
function main(){
    $(document).ready(function() {

        // ide jöhet a jQuery-t használó szkript! :-)

    });
}
addJQuery(main);

2. Felhasználói szkript telepítése

Pofonegyszerű dolog. Meg kell nyitni a chrome://extensions oldalt (Bővítmények), majd drag-n-drop módszerrel belehúzni a *.user.js fájlt (a Chrome csak ilyen végződésű fájlokat ismer fel telepíthető felhasználói szkriptként). A Chrome ekkor megerősítést kér, ennek leokézása után a szkript máris megjelenik a bővítmények sorában és működik is.

Nincsenek megjegyzések: