A dorit să creeze o extensie pentru Chrome, dar nu a găsit nicio documentație?
În acest articol, vom examina crearea unei extensii pentru Chrome utilizând exemplul "Hello world".
În primul rând, trebuie să stabilim că extensia noastră va funcționa
Extensia "Salut lume" necesită următoarele
Am decis deja despre funcționalitatea de extensie și acum puteți să păcătuim
Mai întâi trebuie să creați un folder unde vor fi localizate fișierele extensiei noastre
Să o numim "HelloWorld"
Și în ea fișierul "manifest.json"
"manifest.json" este un fișier în care extensia noastră va fi "descrisă" și vor fi specificați câțiva parametri
Mai întâi vom găsi pictograma aplicației
Îmi place aici:
Mutați pictograma în dosarul img și dați-i pictograma de nume
Acum, într-un dosar cu extensia creează un fișier „popup.html“. „Background.html“, „options.html“ (extensia așa cum poate ați ghicit este scris în HTML, JS (socrul tot ce poate fi inclus într-o pagină HTML normal))
Ei bine, deja, extinderea noastră este gata
Puteți să-l instalați în „Settings“ => „Extensii“ => „Load despachetat extensia.“ Și punct drumul spre „helloworld“ nostru dosar
Când porniți extensia, vom rula codul din "background.html" și vom avea ieșirea primului mesaj acolo
(adică atunci când începe browser-ul, extensiile sunt lansate și vom observa ieșirea mesajului de fiecare dată când pornim)
Dacă faceți clic pe pictograma extensiei noastre, vom vedea un meniu pop-up în care va fi un cod de la "popup.html"
În cazul în care RMB pictograma de expansiune (butonul din dreapta al mouse-ului) și faceți clic pe „Settings“, atunci vom ajunge la pagina, care este codul „options.html“
De asemenea, puteți "compila" o extensie într-un fișier
Să mergem la Chrome "Setări" => "Extensii" => "Extensii de ambalare".
Specificați calea spre dosarul cu extensia și la ieșire veți primi 2 fișiere:
- * .crx - extensia însăși
- * .pem - fișierul cu cheia privată (presupunând că ați creat extensia și apoi doriți să se dezvolte, dar sa văzut noua versiune Chrome a extensiei ca „actualizat“ în expansion pack ulterior va trebui să specificați același fișier cheie privată)
Vă doresc dezvoltări de succes!
Trimiteți-le prietenilor: