Jos olet ihmettelevät, miten tehdä Chrome Laajennus Chrome on extensiondocumentation on hyvä perus-toteutuksia. Kuitenkin käyttää enemmän advancedfeatures vaatii paljon googlaamalla ja pino ylivuoto. Tehdään anintermediate Chrome laajennus, joka on vuorovaikutuksessa sivulla: se löytää ensimmäinen ulkoinen linkki sivulla ja avaa se uuteen välilehteen.

manifest.JSON

the manifest.json file kertoo Chromelle tärkeää tietoa yourextensionista, kuten sen nimestä ja sen tarvitsemista käyttöoikeuksista.,

yksinkertaisin mahdollinen laajennus on hakemisto, jossa manifest.json tiedosto.Katsotaanpa luoda hakemiston ja laita seuraavat JSONinto manifest.json:

{ "manifest_version": 2, "name": "My Cool Extension", "version": "0.1" }

Se on kaikkein perus mahdollista manifest.json, jossa on kaikki vaaditut kentät filledin. manifest_version pitäisi aina olla 2, koska versio 1 isunsupported tammikuussa 2014. Toistaiseksi laajennuksemme ei tee mitään, mutta Ladataan se Chromeen joka tapauksessa.,

Lataa laajennus Chrome

lataa laajennus Chrome, avaa chrome://extensions/ oman selainja klikkaa ”Developer mode” oikeassa yläkulmassa. Nyt klikkaa ”Lataa unpackedextension…” ja valitse laajennuksen hakemisto. Sinun pitäisi nyt nähdä sinunrextension luettelossa.

kun vaihdat tai lisäät koodin laajennukseesi, palaa vain tälle sivulle ja lataa sivu. Chrome lataa laajennuksesi uudelleen.

Sisältö skriptit

sisältö kirjoitus on ”JavaScript-tiedoston, joka toimii osana web-sivuja.,”Tämä tarkoittaa, että sisällön skripti voi olla vuorovaikutuksessa web-sivujen kanssa, joita browservisits. Kaikki Chrome-laajennuksen JavaScript-tiedosto ei voi tehdä tätä; näemme myöhemmin.

katsotaanpa lisätä sisältöä käsikirjoituksen nimeltä content.js:

// content.js alert("Hello from your Chrome extension!")

pistää käsikirjoituksen, meidän täytyy kertoa manifest.json tiedosto siitä.,

Lisää tämä manifest.json tiedosto:

"content_scripts": , "js": } ]

Tämä kertoo Chrome, jotta pistää content.js osaksi jokaisen sivun vierailemme käyttäen thespecial <all_urls> URL-malli. Jos haluamme pistää käsikirjoituksen vain somepages, Voimme käyttää match malleja. Tässä muutamia esimerkkejä arvoista"matches":

Reload your Chrome extension. Joka ikinen sivu, jolla käyt, tulee hälytys. Let ’ slog ensimmäinen URL sivulla sijaan.,

URL-osoitteen kirjaaminen

jQuery ei ole tarpeen, mutta se helpottaa kaikkea. Ensinnäkin, lataa vastenmielisyys jQuery alkaen jQuery CDN ja laita se laajennuksen kansioon. Idownloaded the latest minified version, jquery-2.1.3.min.js. Ladata se, addit, jotta manifest.json ennen "content.js"., Koko manifest.json olisi looklike tämä:

{ "manifest_version": 2, "name": "My Cool Extension", "version": "0.1", "content_scripts": , "js": } ] }

Nyt meillä on jQuery, katsotaanpa käyttää sitä kirjautua URL-osoitteen ensimmäinen ulkoinen virgil sivun content.js:

// content.js var firstHref = $("a").eq(0).attr("href"); console.log(firstHref);

Huomaa, että meidän ei tarvitse käyttää jQuery tarkistaa, jos asiakirja on ladattu. Bydefault, Chrome injektoi sisältöä skriptejä, kun DOM on valmis.

kokeile sitä – katso konsolin ulostulo jokaiselta sivulta.,

– Selaimen Toiminnot

Kun laajennus lisää kuvaketta vieressä osoiteriville, joka on browseraction. Laajennus voi kuunnella napsautuksia että painiketta ja sitten dosomething.

laita kuvake.png Google on tiedostotunniste opetusohjelma oman extension-kansioon andadd tämän manifest.json:

"browser_action": { "default_icon": "icon.png" }

jotta voit käyttää selaimen toimintaa, meidän täytyy lisätä viesti kulkee.

Viesti kulkee

sisältö käsikirjoituksen on pääsy nykyisen sivun, mutta on rajoitettu APIs se voi käyttää., Se ei esimerkiksi voi kuunnella klikkauksia selaimen toiminnasta. Weneed lisätä eri tyyppistä script meidän laajennus, tausta, kirjoitus,joka on pääsy kaikkiin Chrome API, mutta ei voi käyttää nykyisen sivun. AsGoogle sanoo:

Sisältö skriptit on joitakin rajoituksia. He eivät voi käyttää chrome.* APIs, kanssa poikkeuksena extension, i18n, runtime ja storage.,

sisältö käsikirjoituksen voi vetää URL-osoitteen pois nykyisen sivun, mutta saadaanko tarvitset käsi, että URL-yli background script tehdä jotain usefulwith se. Jotta kommunikoida, käytämme mitä Google kutsuu viesti kulkee,jonka avulla skriptit voivat lähettää ja kuunnella viestejä. Se on ainoa tapa yhteydenpitoon skriptejä ja tausta skriptejä vuorovaikutuksessa.,

Lisää seuraava kertoa manifest.json taustaa käsikirjoitus:

"background": { "scripts": }

Nyt me lisäämme background.js:

Tämä antaa mielivaltaisen JSON-nykyinen välilehti. Avaimet JSONpayload voi olla mitä tahansa, mutta valitsin "message" yksinkertaisuuden. Nyt tarvitsemme tolisten, että viesti content.js:

Huomaa, että kaikki meidän edellinen koodi on siirretty osaksi kuuntelija, niin ettäse on suorittaa vain silloin, kun lasti on saatu., Joka kerta, kun napsautat browseraction-kuvaketta, sinun pitäisi nähdä URL saada kirjautunut konsoliin. Jos se ei toimi, yritä ladata laajennus uudelleen ja lataa sivu uudelleen.

Avaa uudessa välilehdessä

voidaan käyttää chrome.tabs API avata uuteen välilehteen:

chrome.tabs.create({"url": "http://google.com"});

Mutta chrome.tabs voidaan käyttää background.js, joten meidän täytyy lisätä somemore viesti kulkee, koska background.js avaa välilehdessä, mutta et voi napata theURL., Tässä on ajatus:

  1. Kuuntele, klikkaa selaimen toimintaa background.js. Lähettäkää clicked_browser_action tapahtuma content.js.
  2. Kun content.js saa tapahtumaan, se tarttuu URL ensimmäisen linkin thepage. Sitten se lähettää open_new_tab takaisin background.js URL aloittaa.
  3. background.js kuuntelee open_new_tab ja avaa uuden välilehden, jossa givenURL, kun se vastaanottaa viestin.,

Klikkaamalla selaimen toimintaa käynnistävät background.js, joka lähettää amessage että content.js, joka lähettää URL-osoitteen takaisin background.js, joka willopen uuden välilehden, jossa annetaan URL-osoite.

Ensinnäkin, meidän täytyy kertoa content.js lähetä URL-osoite background.js., Vaihdacontent.js käyttää tätä koodia:

– Nyt meidän täytyy lisätä joitakin koodi kertoa background.js kuuntelemaan, että tapahtuma:

Nyt kun klikkaat selaimen toiminta-kuvaketta, se avaa uuden välilehden, jossa firstexternal URL-sivulla.

valmis

koko content.js ja background.js ovat edellä., Tässä on täydellinen manifest.json:

Ja tässä on koko hakemiston rakenne:

. ├── background.js ├── content.js ├── icon.png ├── jquery-2.1.3.min.js └── manifest.json

Lisää siitä, miten tehdä Chrome laajennus

lisätietoja, kokeile virallinen Chrome laajennus asiakirjat.