Speicher-APIs

Fast jeder Aspekt der App-Entwicklung umfasst ein Element des Sendens oder Empfangens von Daten. Wird gestartet sollten Sie ein MVC-Framework verwenden, um Ihre App so zu entwerfen und zu implementieren, sind die Daten vollständig getrennt von der App-Ansicht dieser Daten (siehe MVC-Architektur).

Sie müssen auch berücksichtigen, wie wir mit Daten umgehen, wenn Ihre App offline ist (siehe Zuerst offline). In diesem Dokument werden kurz die Speicheroptionen zum lokalen Senden, Empfangen und Speichern von Daten vorgestellt. die Im restlichen Dokument erfahren Sie, wie Sie die APIs für das Dateisystem und die Synchronisierung von Dateisystem-APIs von Chrome verwenden (siehe auch fileSystem API und syncFileSystem API)

Speicheroptionen

Gepackte Anwendungen nutzen viele verschiedene Mechanismen zum Senden und Empfangen von Daten. Für externe Daten (Ressourcen, Webseiten) müssen Sie die Content Security Policy (CSP) kennen. Ähnlich wie Chrome Erweiterungen können für die Kommunikation mit Remote-Servern ursprungsübergreifende XMLHttpRequests-Anfragen verwenden. Ich können auch externe Seiten isolieren, sodass der Rest Ihrer App sicher ist. Weitere Informationen hierzu finden Sie unter Externe Webseiten einbetten Seiten.

Wenn Sie Daten lokal speichern, können Sie mit der Chrome Storage API kleine Zeichenfolgen speichern. und IndexedDB, um strukturierte Daten zu speichern. IndexedDB ermöglicht es Ihnen, JavaScript-Objekte in einem Objektspeicher und verwenden die Indexe des Speichers zum Abfragen von Daten (weitere Informationen siehe HTML5 Rock's Simple Todo - Tutorial auflisten). Verwenden Sie für alle anderen Datentypen, wie z. B. Binärdaten, das Dateisystem und die Synchronisierung Dateisystem-APIs

Die Filesystem API und die Sync Filesystem API von Chrome erweitern die HTML5 FileSystem API. Mit der Filesystem API können Anwendungen einen durch die Sandboxing-Technologie geschützten Bereich des im lokalen Dateisystem. Eine App zum Teilen von Fotos kann beispielsweise die Filesystem API verwenden, um beliebige die der Nutzer auswählt.

Mit der Sync Filesystem API von Chrome können Apps Daten im Google Drive-Konto eines Nutzers speichern und synchronisieren, sodass dieselben Daten für verschiedene Kunden verfügbar sein können. Beispiel: Ein cloudbasierter Text Editor kann neue Textdateien automatisch mit dem Google Drive-Konto eines Nutzers synchronisieren. Wenn der Parameter Nutzer den Texteditor in einem neuen Client öffnet, verschiebt Google Drive neue Textdateien in diese Instanz im Texteditor.

Chrome Filesystem API verwenden

Dateisystemberechtigung wird hinzugefügt

Wenn Sie die File System API von Chrome verwenden möchten, müssen Sie das „fileSystem“-Attribut für das Manifest, sodass dass Sie eine Berechtigung vom Benutzer zum Speichern persistenter Daten erhalten können.

"permissions": [
  "...",
  "fileSystem"
]

Nutzeroptionen zur Auswahl von Dateien

Nutzer erwarten, Dateien auf die gleiche Weise auszuwählen, wie sie es gewohnt sind. Zumindest erwarten sie eine Entscheidung Datei und die Standard-Dateiauswahl. Wenn Ihre App die Dateihandhabung intensiv nutzt, sollten Sie auch Implementieren von Drag-and-drop (siehe unten und natives HTML5-Drag-and-drop).

Pfad eines fileEntrys abrufen

Um den vollständigen Pfad der vom Nutzer ausgewählten Datei (fileEntry) abzurufen, rufen Sie getDisplayPath() auf:

function displayPath(fileEntry) {
  chrome.fileSystem.getDisplayPath(fileEntry, function(path) {
    console.log(path)
  });
}

Implementierung von Drag-and-drop

Wenn Sie eine Drag-and-drop-Auswahl implementieren müssen, kann der Drag-and-drop-Dateicontroller (dnd.js) in Das Beispiel filesystem-access ist ein guter Ausgangspunkt. Der Controller erstellt einen Dateieintrag von einem DataTransferItem per Drag-and-drop. In diesem Beispiel ist fileEntry auf den ersten verworfenes Element.

var dnd = new DnDFileController('body', function(data) {
  var fileEntry = data.items[0].webkitGetAsEntry();
  displayPath(fileEntry);
});

Dateien lesen

Mit dem folgenden Code wird die Datei geöffnet (schreibgeschützt) und mithilfe eines FileReader-Objekts als Text gelesen. Wenn wenn die Datei nicht vorhanden ist, wird ein Fehler ausgegeben.

var chosenFileEntry = null;

chooseFileButton.addEventListener('click', function(e) {
  chrome.fileSystem.chooseEntry({type: 'openFile'}, function(readOnlyEntry) {

    readOnlyEntry.file(function(file) {
      var reader = new FileReader();

      reader.onerror = errorHandler;
      reader.onloadend = function(e) {
        console.log(e.target.result);
      };

      reader.readAsText(file);
    });
    });
});

Datei schreiben

Die beiden häufigsten Anwendungsfälle für das Schreiben einer Datei sind "Speichern". und klicken Sie auf „Speichern unter“. Mit dem folgenden Code wird ein writableEntry aus dem schreibgeschützten chosenFileEntry und schreibt die ausgewählte Datei in diese Datei.

 chrome.fileSystem.getWritableEntry(chosenFileEntry, function(writableFileEntry) {
    writableFileEntry.createWriter(function(writer) {
      writer.onerror = errorHandler;
      writer.onwriteend = callback;

    chosenFileEntry.file(function(file) {
      writer.write(file);
    });
  }, errorHandler);
});

Mit dem folgenden Code wird eine neue Datei mit „Speichern unter“ erstellt. und schreibt das neue Blob in den mit der Methode writer.write().

chrome.fileSystem.chooseEntry({type: 'saveFile'}, function(writableFileEntry) {
    writableFileEntry.createWriter(function(writer) {
      writer.onerror = errorHandler;
      writer.onwriteend = function(e) {
        console.log('write complete');
      };
      writer.write(new Blob(['1234567890'], {type: 'text/plain'}));
    }, errorHandler);
});

Chrome Sync Filesystem API verwenden

Mithilfe des synchronisierbaren Dateispeichers können zurückgegebene Datenobjekte auf die gleiche Weise bearbeitet werden wie lokale Daten. Offline-Dateisysteme in der FileSystem API, aber mit der hinzugefügten (und automatischen) Synchronisierung davon Daten in Google Drive hochladen.

Berechtigung zum Synchronisieren des Dateisystems hinzufügen

Wenn Sie die Sync Filesystem API von Chrome verwenden möchten, müssen Sie „syncFileSystem“ hinzufügen Berechtigung für die Manifest, damit Sie eine Berechtigung vom Nutzer zum Speichern und Synchronisieren persistenter Daten erhalten können.

"permissions": [
  "...",
  "syncFileSystem"
]

Synchrierbarer Dateispeicher wird initiiert

Um eine synchronisierbare Dateispeicherung in Ihrer App zu starten, rufen Sie einfach syncFileSystem.requestFileSystem auf. Bei dieser Methode wird ein synchronisierbares Dateisystem zurückgegeben, das von Google Drive unterstützt wird. Beispiel:

chrome.syncFileSystem.requestFileSystem(function (fs) {
   // FileSystem API should just work on the returned 'fs'.
   fs.root.getFile('test.txt', {create:true}, getEntryCallback, errorCallback);
});

Status der Dateisynchronisierung

Rufen Sie mit syncFileSystem.getFileStatus den Synchronisierungsstatus für die aktuelle Datei ab:

chrome.syncFileSystem.getFileStatus(entry, function(status) {...});

Für den Status der Dateisynchronisierung können folgende Werte angegeben werden: 'synced', 'pending' oder 'conflicting'. „Synchronisiert“ bedeutet, dass die Datei vollständig synchronisiert ist. Es gibt keine ausstehenden lokalen Änderungen, die mit Google Drive synchronisiert. Es können jedoch ausstehende Änderungen in Google Drive vorliegen, wurden noch nicht abgerufen.

'Ausstehend' bedeutet, dass die Datei ausstehende Änderungen enthält, die noch nicht mit Google Drive synchronisiert wurden. Wenn die App werden lokale Änderungen (fast) sofort mit Google Drive synchronisiert und der Das Ereignis syncFileSystem.onFileStatusChanged wird mit dem Status 'synced' ausgelöst (siehe unten für weitere Details).

syncFileSystem.onFileStatusChanged wird ausgelöst, wenn sich der Status einer Datei in 'conflicting' „Konflikt“ dass Änderungskonflikte sowohl im lokalen Speicher als auch Google Drive Eine Datei kann sich nur dann in diesem Status befinden, wenn die Richtlinie zur Konfliktlösung auf 'manual' Die Standardrichtlinie ist 'last_write_win' und Konflikte werden automatisch behoben durch „Last-Write-Win“-Richtlinie. Die Konfliktlösung des Systems kann folgendermaßen geändert werden: syncFileSystem.setConflictResolutionPolicy.

Wenn die Konfliktlösungsrichtlinie auf 'manual' gesetzt ist und eine Datei den Status 'conflicting' hat, Die App kann die Datei weiterhin als lokale Offlinedatei lesen und schreiben, aber die Änderungen werden nicht synchronisiert. und die Datei bleibt getrennt von Remote-Änderungen, die auf anderen Clients vorgenommen wurden, bis der Konflikt auftritt behoben. Der einfachste Weg, einen Konflikt zu lösen, besteht darin, die lokale Version der Datei zu löschen oder umzubenennen. Dadurch wird die Synchronisierung der Remote-Version erzwungen, der Konflikt wird behoben und der Das Ereignis onFileStatusChanged wird mit dem Status 'synced' ausgelöst.

Auf Änderungen des Synchronisierungsstatus warten

Das Ereignis syncFileSystem.onFileStatusChanged wird ausgelöst, wenn sich der Synchronisierungsstatus einer Datei ändert. Beispiel: Eine Datei enthält ausstehende Änderungen und befindet sich im Status „Ausstehend“. Bundesstaat. Die App wurde möglicherweise im Offline-Status, damit die Änderung gleich synchronisiert wird. Wenn der Synchronisierungsdienst die ...die Änderung vor Ort in Google Drive hochlädt, löst der Dienst den onFileStatusChanged-Ereignis mit den folgenden Werten: { fileEntry:a fileEntry for the file, status: 'synced', action: 'updated', direction: 'local_to_remote' }.

Ebenso kann der Synchronisierungsdienst unabhängig von den lokalen Aktivitäten Remote-Änderungen erkennen, die von einen anderen Client und lädt die Änderungen aus Google Drive in den lokalen Speicher herunter. Wenn die Fernbedienung Änderung für das Hinzufügen einer neuen Datei war, wird ein Ereignis mit den folgenden Werten ausgelöst: { fileEntry: a fileEntry for the file, status: 'synced', action: 'added', direction: 'remote_to_local' }

Wenn sowohl auf der lokalen als auch auf der Remote-Seite Änderungskonflikte für dieselbe Datei vorliegen und der Konflikt Auflösungsrichtlinie auf „'manual'“ gesetzt ist, wird der Dateistatus in „conflicting“ geändert. getrennt vom Synchronisierungsdienst und wird erst synchronisiert, wenn der Konflikt behoben wurde. In dieser Ein Ereignis mit den folgenden Werten wird ausgelöst: { fileEntry: a fileEntry for the file, status: 'conflicting', action: null, direction: null }

Sie können für dieses Ereignis einen Listener hinzufügen, der auf Statusänderungen reagiert. Beispiel: Der Parameter Die Chrome Music Player App erfasst neue Musik, die mit Google Drive synchronisiert wurde, jedoch noch nicht. in den lokalen Speicher des Nutzers auf einem bestimmten Client importiert. Alle gefundenen Musiktitel werden damit synchronisiert Kunde:

chrome.syncFileSystem.onFileStatusChanged.addListener(function(fileInfo) {
  if (fileInfo.status === 'synced') {
    if (fileInfo.direction === 'remote_to_local') {
      if (fileInfo.action === 'added') {
        db.add(fileInfo.fileEntry);
      } else if (fileInfo.action === 'deleted') {
        db.remove(fileInfo.fileEntry);
      }
    }
  }
});

API-Nutzung prüfen

Um die von der API verwendete Datenmenge zu überprüfen, fragen Sie das lokale Sandbox-Verzeichnis der Anwendung oder die Von syncFileSystem.getUsageAndQuota zurückgegebene Nutzungsbyte:

chrome.syncFileSystem.getUsageAndQuota(fileSystem, function (storageInfo) {
   updateUsageInfo(storageInfo.usageBytes);
   updateQuotaInfo(storageInfo.quotaBytes);
});

Sie können sich auch den Speicher des Back-End-Synchronisierungsdienstes für die Synchronisierung in Google Drive ansehen. Synchronisierte Dateien sind in einem versteckten Google Drive-Ordner, Chrome Syncable FileSystem, gespeichert. Der Ordner wird nicht angezeigt in in „Meine Ablage“ Sie können aber über das Suchfeld nach dem Ordnernamen suchen. (Hinweis: Das Layout des Remote-Ordners ist nicht garantiert abwärtskompatibel zwischen Releases.)