Pregătirea
Pentru a testa aplicația pe care o dezvoltați, va trebui să o adăugați la browserul dvs. Pentru aceasta, pe pagina de chrome: // extensions, bifați caseta de selectare "Modul dezvoltator". După aceasta, va fi posibil să adăugați extensia sau aplicația.
manifest.json
Să examinăm câmpurile care s-au întâlnit aici. Cu titlul și descrierea totul este clar. Versiunea este un câmp obligatoriu - Magazinul web Chrome va cere să fie schimbată când descărcați actualizarea aplicației.
Dimensiunea standard a pictogramelor. necesare pentru aplicație - 48 × 48 și 128 × 128 pixeli. De asemenea, în unele cazuri, este utilizată o pictogramă de dimensiune de 16 × 16. În plus, pot fi necesare alte dimensiuni ale pictogramelor în cazul în care acestea vor fi afișate pe afișaje de înaltă rezoluție, cum ar fi pe Chromebook Pixel și noul MacbookPro.
"manifest_version" este versiunea formatului de fișier manifest. În acest moment, utilizați valoarea 2.
"offline_enabled" - așa cum s-ar putea să te aștepți, acest steag este setat pentru aplicații care funcționează indiferent de disponibilitatea accesului la Internet.
Următoarea construcție este cea principală din dosar:
Aici browser-ului i se spune cum se rulează aplicația. Spre deosebire de extensiile pentru care pagina de fundal este un atribut opțional, aceasta există întotdeauna în aplicație. Logica lucrării este după cum urmează: atunci când începe aplicația, este încărcat pentru prima dată codul paginii de fundal. Poate înregistra înregistratorii evenimentului, în special, la evenimentele "Lunch". care apoi pornește atunci când utilizatorul deschide aplicația într-un fel sau altul.
Secțiunea "permisiuni" descrie setările de acces pentru aplicație. În cazul nostru, se adaugă posibilitatea de a salva fișiere.
În cele din urmă, secțiunea "file_handlers" descrie tipurile de fișiere deschise de aplicație. Pentru diferite tipuri de fișiere din managerul de fișiere, sistemul de operare Chrome poate afișa diferite linii în meniu. De exemplu, pentru unele fișiere, elementul din meniu poate arăta ca "Vizualizare imagine în SuperProgram", iar pentru altele - "Editare text în Superprogram".
Numirea unei aplicații bazate pe Chrome pentru a deschide un anumit tip de fișier funcționează până acum numai în sistemul de operare Chrome.
Pagina de fundal
Tot codul care implementează pagina de fundal este în fișierul js / background.js. Aici este:
Pagina de fundal funcționează în fundal, indiferent de ferestrele aplicației. De cele mai multe ori nu este încărcată în memorie. Când sistemul este pornit, codul său este executat și poate instala manageri pentru diverse evenimente, dintre care cele mai frecvente sunt onLaunched. Când sunt instalate dispozitivele de manipulare, pagina de fundal este, de obicei, descărcată din memorie și este lansată înapoi numai dacă a apărut unul dintre evenimentele la care a fost abonat.
Metoda chrome.app.window.create creează o nouă fereastră de aplicație. Primul parametru este calea către fișierul html pe care îl deschide (în raport cu directorul de aplicații). Al doilea este parametrii ferestrei. Mă voi opri pe unul dintre ei. cadru: "crom" creează o fereastră cu aspectul obișnuit pentru sistemul de operare curent. O altă opțiune aici este cadrul: "nici unul". În acest caz, aplicația se execută într-o cutie „goale“, iar dezvoltatorul va trebui să aibă grijă de a adăuga butoane pentru a închide, coagulare și implementare ferestre, precum și zone pentru care o fereastră poate fi trasă în jurul ecranului.
index.html
În fișierele HTML și CSS care fac parte din aplicație, Chrome, nu există nimic specific. Singurul lucru care se poate observa este lipsa necesității de a avea grijă de capacitatea inter-browser.
Pentru completare, citesc CSS:
Codul principal: lucrul cu fișiere
Deci, haideți să ne uităm la codul în js / main.js. O voi cita în fragmente, codul complet fiind pe Gitkhab.
Sarcina funcției de inițializare este de a adăuga agenți de manipulare la butoane și de a deschide fișierul din pagina de fundal. Contextul paginii de fundal este obținut din fereastra principală asincron folosind chrome.runtime.getBackgroundPage.
Manipulatori de prese de buton:
Actualul FileEntry vom stoca în variabila globală currentEntry.
Singura caracteristică specifică din codul de mai sus este metoda chrome.fileSystem.chooseEntry. Cu această metodă se deschide o fereastră pentru selectarea fișierelor (pe fiecare sistem). Ca toate celelalte funcții de lucru cu sistemul de fișiere, această metodă este asincronă și primește un apel invers pentru a continua să lucreze (în cazul nostru, funcțiile loadEntry și saveToEntry, descrise mai jos).
În funcția setTitle (), modificăm titlul ferestrei pentru a afișa calea către fișierul curent. Modul în care va fi afișat acest antet depinde de sistem. În sistemul de operare Chrome, acesta nu apare deloc. chrome.fileSystem.getDisplayPath este cel mai corect mod de a obține calea către un fișier, potrivit pentru a fi afișat utilizatorului. O altă vizualizare a căii este disponibilă prin input.fullPath.
În fișierul API există două obiecte diferite care descriu fișierul: FileEntry și fișier. Aproximativ, FileEntry reprezintă calea spre fișier, iar fișierul - datele conținute în acesta. Prin urmare, pentru a citi fișierul, trebuie să obțineți obiectul Fișier prin intrare. Acest lucru este realizat utilizând metoda input.file () asincrone.
FileReader este un obiect separat destinat citirii fișierelor. Acesta vă permite să gestionați procesul de citire destul de flexibil, dar trebuie doar să citim întregul conținut al fișierului din acesta în acest caz.
Intrarea în fișier, ca și în lectură, nu conține codul specific pentru Chrome:
Înainte de a scrie date, ele trebuie aduse la formularul Blob. Un pas suplimentar pe care vom avea nevoie pentru scriere este de a tăia fișierul în cazul în care există deja și are o lungime lungă. Dacă am fi fost siguri că acest fișier este nou, codul de intrare va fi simplificat la:
concluzie
Trimiteți-le prietenilor: