Cum de a crea o extensie pentru Google Chrome

Google Chrome - este una dintre cele mai populare browsere, și există mai multe motive: este rapid, este fiabil și oferă un set incredibil de instrumente pentru dezvoltatori, precum și sute de extensii diferite pentru utilizatori, care pot fi descărcate de pe Google Store.

De asemenea, trebuie remarcat faptul că vă puteți crea propriile extensii folosind doar HTML, CSS și j # 097; vascript, și mulți dintre voi nu trebuie să învețe noi limbaje de programare. Știți deja tot ce trebuie să faceți este să înțeleagă modul în care aceste cunoștințe pot fi aplicate la Chrome.

Sunt momente când doriți să realizați ceva special în browser-ul dvs., dar aceste funcții nu sunt disponibile într-un arsenal Chrome standard, și că este atunci când vin în ajutorul de expansiune.

Despre extensia Chrome

Primul lucru pe care trebuie să știți este că există două tipuri de extensii:

* Operații pe pagini, în funcție de pagina
* Operațiuni în browser-ul, care nu depinde de pagini

Aruncati o privire la aceasta:

Astăzi am să vă spun despre crearea unui simplu extensie de browser-based.

Primul lucru pe care trebuie să facem este să creați o rădăcină dosar pentru extinderea noastră și se adaugă la manifestul, care va conține un obiect JSON cu caracteristicile dezvoltării noastre:

Acest lucru va fi coloana vertebrală a fișierului nostru. Apoi, avem nevoie pentru a adăuga paginile noastre de fundal de extensie - aceste pagini vor fi responsabile de logica care are loc la fondul expansiunii noastre:

De asemenea, trebuie să se introducă aici obiect browser_action - nu va fi plasat un simplu UI de expansiune noastre. Deoarece aceasta este o operațiune bazată pe browser-ul, iar când apăsați un buton de pe bara de instrumente, va veni probabil din fereastra pop-up, această facilitate ne permite ca timp pentru a scrie codul sursă al acestei ferestre: pictograma, vizibil pentru utilizator, titlu, și așa mai departe:

Dacă adăugăm acest lucru la manifestul nostru, obținem ceva de genul următoarele:

După ce am făcut acest lucru, tot ce trebuie să faceți este de a crea o aplicație direct în sine.

Scopul acestui ghid a fost de a crea un simplu jQuery-pipetă folosind j # 097; vascript-Plugin Spectrum. Deci popup.html noastră va fi după cum urmează:

După cum puteți vedea, tot ce am făcut, se adaugă o secțiune care conține două elemente esențiale pentru spectrul de frecvențe câștigate, și apoi executați toate fișierele, cum ar fi jquery, spectrum.js, css-fișier și popup.js, care vor fi inițializate codul spectrului.

j noastre # 097; vascript-cod este compus din total 6 linii de vedere simplitatea plug:

(Acest cod - este doar un exemplu, și nu atinge Chrome API, din moment ce am nevoie doar pentru a demonstra modul de a utiliza un simplu HTML / CSS și j # 097; coduri vascript pentru a crea ceea ce aveți nevoie în browserul Chrome).

Tocmai ați creat propria aplicație simplă puțin, dar poate fi bine util pentru tine în munca, și nu intenționăm să-l încărcați pe Google Store.

Deci, să-l testeze pe plan local. Pentru a face acest lucru, deschideți crom: // extensions, și asigurați-vă că vă aflați în modul dezvoltator (Mod Developer). Dacă da, puteți descărca aplicația neambalat sau trageți un dosar de pe desktop, iar apoi aplicația va fi afișată imediat în bara de instrumente. Aceasta funcționează numai în modul pentru dezvoltatori. Dacă doriți să descărcați extensia în Magazinul Google, va trebui să împacheteze aplicația, ca Chrome Store vă permite să încărcați fișiere la fel ca .crx.

Extensii pentru Chrome - un nu prea dificil și înfricoșătoare cum părea mai devreme. Și ei pot crea destul de rapid, în doar câteva minute.