Übersetzung: Vlad Merzhevich

Permanenter lokaler Speicher ist ein Bereich, in dem Clientanwendungen Vorteile gegenüber Serveranwendungen haben. Für Anwendungen wie z operationssystem, stellt eine Abstraktionsschicht zum Speichern und Abrufen von Daten wie Einstellungen oder Ausführungsstatus bereit. Diese Werte können abhängig von den Prinzipien der Plattform in der Registrierung, in INI-Dateien, XML-Dateien oder anderswo gespeichert werden. Wenn Ihre Clientanwendung lokalen Speicher für mehr als nur ein Schlüssel/Wert-Paar benötigt, können Sie Ihre eigene Datenbank einfügen, Ihr eigenes Dateiformat entwickeln oder eine Reihe anderer Lösungen verwenden.

In der Vergangenheit hatten Webanwendungen keinen dieser Luxusgüter. Cookies wurden schon früh in der Geschichte des Internets erfunden und können verwendet werden, um kleine Datenmengen dauerhaft lokal zu speichern. Sie haben jedoch drei potenzielle Nachteile:

• Cookies sind in jeder HTTP-Anfrage enthalten, wodurch Ihre Webanwendung verlangsamt wird, da dieselben Daten unnötigerweise immer wieder übertragen werden.
• Cookies sind in jeder HTTP-Anfrage enthalten, wenn Daten unverschlüsselt über das Internet übertragen werden (auch wenn die gesamte Webanwendung über SSL übertragen wird);
• Cookies sind auf etwa 4 KB an Daten begrenzt – genug, um Ihre Anwendung zu verlangsamen (siehe oben), aber nicht genug, um nützlich zu sein.

Das wollen wir wirklich:

• viel Stauraum;
• Arbeit auf Kundenseite;
• Berücksichtigen Sie Seitenaktualisierungen.
• Kein Senden an den Server.

Vor HTML5 scheiterten alle Versuche, dies zu erreichen, letztlich auf verschiedene Weise.

Eine kurze Geschichte der lokalen Speicherung vor HTML5

Am Anfang gab es nur einen Internet Explorer. Zumindest wollte Microsoft, dass die Welt das denkt. Zu diesem Zweck hat Microsoft im Rahmen des Ersten Großen Browserkrieges viele Dinge erfunden und sie in seinen Browser integriert, der den Krieg beendete, den Internet Explorer. Eines dieser Dinge hieß DHTML-Verhalten und eines der Verhaltensweisen hieß userData.

Mit UserData kann eine Webseite bis zu 64 KB Daten pro Domain in einer hierarchischen XML-ähnlichen Struktur speichern. Vertrauenswürdige Domänen wie Intranetseiten können zehnmal mehr speichern. Und hey, 640 KB sollten für alle ausreichen. Der IE bietet keine Möglichkeit, diese Konventionen zu ändern, daher gibt es keine Möglichkeit, die Menge des verfügbaren Speichers zu erhöhen.

Im Jahr 2002 führte Adobe in Flash 6 eine Funktion ein, die erfolglos blieb und den irreführenden Namen „Flash-Cookies“ erhielt. IN Flash-Umgebung Diese Funktion wird besser als Local Shared Objects (LSO) bezeichnet. Kurz gesagt: Flash-Objekte können bis zu 100 KB Daten pro Domäne speichern. Brad Neuberg, der einen frühen Prototyp einer Brücke zwischen Flash und JavaScript entwickelte, nannte ihn AMASS (AJAX Massive Storage System), aber er war durch einige Eigenheiten des Flash-Designs eingeschränkt. Mit der Einführung von ExternalInterface in Flash 8 im Jahr 2006 wurde der Zugriff auf LSOs über JavaScript um eine Größenordnung einfacher und schneller. Brad hat AMASS neu geschrieben und unter dem Alias ​​dojox.storage in das beliebte Dojo Toolkit integriert. Flash stellt jeder Domain 100 KB Speicherplatz „kostenlos“ zur Verfügung. Darüber hinaus bietet es dem Benutzer auf Wunsch die Möglichkeit, das Speichervolumen um eine Größenordnung (1 MB, 10 MB usw.) zu erhöhen.

if (Modernizr.localstorage) (
// window.localStorage ist verfügbar!
) anders (
// keine native Unterstützung für HTML5-Speicher
}

Verwendung von HTML5-Speicher

Die HTML5-Speicherung basiert auf Schlüssel/Wert-Paarnamen. Sie speichern Informationen basierend auf dem Schlüsselnamen und können diese Daten dann mit demselben Schlüssel abrufen. Der Schlüsselname ist eine Zeichenfolge. Die Daten können von jedem Typ sein, den JavaScript unterstützt, einschließlich Zeichenfolgen, booleschen Werten, Ganzzahlen oder Gleitkommazahlen. In Wirklichkeit werden die Daten jedoch als Zeichenfolge gespeichert. Wenn Sie Nicht-Strings speichern und abrufen, müssen Sie Funktionen wie parseInt() oder parseFloat() verwenden, um die empfangenen Daten in die richtigen JavaScript-Typen zu konvertieren.

Speicherschnittstelle (
Holen Sie sich über getItem(key);
Setzt über setItem(key, data);
};

Der Aufruf von setItem() mit einem vorhandenen Schlüsselnamen überschreibt stillschweigend den vorherigen Wert. Der Aufruf von getItem() mit einem nicht vorhandenen Schlüssel gibt NULL zurück, anstatt eine Ausnahme auszulösen.

Wie andere JavaScript-Objekte können Sie auf das localStorage-Objekt als assoziatives Array zugreifen. Anstatt die Methoden getItem() und setItem() zu verwenden, können Sie einfach eckige Klammern angeben. Zum Beispiel dieses Code-Snippet

var foo = localStorage.getItem("bar");
// ...
localStorage.setItem("bar", foo);

kann mithilfe der eckigen Klammersyntax umgeschrieben werden:

var foo = localStorage["bar"];
// ...
localStorage["bar"] = foo;

Es gibt auch Methoden zum Löschen von Werten nach Schlüsselnamen sowie zum Löschen des gesamten Speichers (d. h. zum gleichzeitigen Löschen aller Schlüssel und Werte).

Speicherschnittstelle (
Entfernen über „removeItem(key);“
klar();
}

Der Aufruf von „removeItem()“ mit einem nicht vorhandenen Schlüssel gibt nichts zurück.

Schließlich gibt es eine Eigenschaft, um die Gesamtzahl der Werte im Speicherbereich abzurufen und über alle Schlüssel nach Index zu iterieren (ruft den Namen jedes Schlüssels ab).

Speicherschnittstelle (
Länge
Schlüssel abrufen (nicht negative Ganzzahl);
}

Wenn beim Aufruf von key() der Index nicht im Bereich von 0 bis (Länge-1) liegt, dann gibt die Funktion null zurück.

HTML5-Speicherbereichsüberwachung

Wenn Sie Speicheränderungen programmgesteuert verfolgen möchten, müssen Sie das Speicherereignis abfangen. Dieses Ereignis tritt für das Fensterobjekt auf, wenn setItem() , removeItem() oder clear() aufgerufen werden und etwas ändern. Wenn Sie beispielsweise einen vorhandenen Wert festlegen oder „clear()“ aufrufen, obwohl keine Schlüssel vorhanden sind, wird das Ereignis nicht ausgelöst, da sich der Speicherbereich nicht tatsächlich geändert hat.

Das Speicherereignis wird überall dort unterstützt, wo das localStorage-Objekt ausgeführt wird, einschließlich Internet Explorer 8. IE 8 unterstützt den W3C-Standard addEventListener nicht (obwohl er schließlich in IE 9 hinzugefügt wird). Um das Speicherereignis abzufangen, müssen Sie also überprüfen, welche Ereignis-Engine verwendet wird unterstützt diesen Browser (wenn Sie dies bereits bei anderen Ereignissen getan haben, können Sie zum Ende dieses Abschnitts springen). Das Abfangen des Speicherereignisses funktioniert auf die gleiche Weise wie das Abfangen anderer Ereignisse. Wenn Sie zum Registrieren von Ereignishandlern lieber jQuery oder eine andere JavaScript-Bibliothek verwenden möchten, können Sie dies auch mit Speicher tun.

if (window.addEventListener) (
window.addEventListener("storage", handle_storage, false);
) anders (
window.attachEvent("onstorage", handle_storage);
};

Der handle_storage-Rückruf wird mit dem StorageEvent-Objekt aufgerufen, außer im Internet Explorer, wo Ereignisse in window.event gespeichert werden.

Funktion handle_storage(e) (
if (!e) ( e = window.event; )
}

In diesem Fall ist die Variable e ein StorageEvent-Objekt, das die folgenden nützlichen Eigenschaften hat.

*Hinweis: Die URL-Eigenschaft hieß ursprünglich uri und einige Browser unterstützten diese Eigenschaft, bevor sich die Spezifikation änderte. Um maximale Kompatibilität zu gewährleisten, sollten Sie prüfen, ob die URL-Eigenschaft vorhanden ist. Wenn nicht, überprüfen Sie stattdessen die URI-Eigenschaft.

Das Speicherereignis kann nicht abgebrochen werden und es gibt keine Möglichkeit, die Änderung innerhalb des handle_storage-Rückrufs zu stoppen. Es ist nur die Art und Weise, wie der Browser Ihnen mitteilt: „Hey, das ist gerade passiert. Du kannst nichts tun, ich wollte nur, dass du es weißt.

Einschränkungen in aktuellen Browsern

Als ich über den Verlauf der lokalen Speicherung mit Plugins von Drittanbietern sprach, erwähnte ich die Einschränkungen jeder Technik. Mir fiel ein, dass ich nichts über die Einschränkungen des mittlerweile standardmäßigen HTML5-Speichers gesagt hatte. Ich gebe Ihnen die Antworten und erkläre sie anschließend. Die Antworten lauten in der Reihenfolge ihrer Wichtigkeit „5 Megabyte“, „QUOTA_EXCEEDED_ERR“ und „keine“.

„5 Megabyte“ – wie viel Speicherplatz standardmäßig bereitgestellt wird. Dieser Wert ist überraschend konsistent über alle Browser hinweg, obwohl er in der HTML5-Spezifikation lediglich als Vorschlag angegeben ist. Sie müssen verstehen, dass Sie Zeichenfolgen und keine Daten darin speichern Originalformat. Wenn Sie viele Ganzzahlen oder Gleitkommazahlen speichern, kann der Unterschied in der Darstellung groß sein. Jede Ziffer in einer Gleitkommazahl wird als Zeichen gespeichert und nicht in der üblichen Darstellung für solche Zahlen.

„QUOTA_EXCEEDED_ERR“ ist die Ausnahme, die Sie erhalten, wenn Sie Ihr Kontingent von 5 MB überschreiten. „Nein“ ist die Antwort auf die nächste offensichtliche Frage: „Kann ich den Benutzer um mehr Speicherplatz bitten?“ Zum Zeitpunkt des Verfassens dieses Artikels implementieren Browser keinen Mechanismus, mit dem Webentwickler mehr Speicherplatz anfordern können. Bei einigen Browsern (z. B. Opera) kann der Benutzer die Speicherkontingente pro Site steuern. Dies ist jedoch eine reine Benutzerinitiative und steht in keinem Zusammenhang mit dem, was Sie als Entwickler in Ihre Webanwendung integrieren können.

HTML5-Speicher in Aktion

Werfen wir einen Blick auf den HTML5-Speicher in Aktion. Wenden wir uns noch einmal dem zu, das wir im Kapitel über das Zeichnen erstellt haben. Bei diesem Spiel gibt es ein kleines Problem: Wenn Sie mitten im Spiel das Browserfenster schließen, gehen die Ergebnisse verloren. Aber mit HTML5-Speicher können wir den Spielvorgang lokal, im Browser selbst, speichern. Öffnen Sie die Demo, machen Sie ein paar Schritte, schließen Sie den Browser-Tab und öffnen Sie ihn dann erneut. Wenn Ihr Browser HTML5-Speicherung unterstützt, merkt sich die Demoseite auf magische Weise die genaue Position im Spiel, einschließlich der Anzahl Ihrer Züge, der Position jeder Figur auf dem Brett und sogar der ausgewählten Figur.

Wie es funktioniert? Jedes Mal, wenn sich das Spiel ändert, rufen wir diese Funktion auf.

Funktion saveGameState() (

localStorage["halma.game.in.progress"] = gGameInProgress;
für (var i = 0; i< kNumPieces; i++) {
localStorage["halma.piece." + i + ".row"] = gPieces[i].row;
localStorage["halma.piece." + i + ".column"] = gPieces[i].column;
}
localStorage["halma.selectedpiece"] = gSelectedPieceIndex;
localStorage["halma.selectedpiecehasmoved"] = gSelectedPieceHasMoved;
localStorage["halma.movecount"] = gMoveCount;
return true;
}

Wie Sie sehen können, wird das localStorage-Objekt zum Speichern des Spielfortschritts verwendet (gGameInProgress, boolescher Typ). Als nächstes werden alle Teile (gPieces, ein JavaScript-Array) iteriert und für jeden von ihnen eine Zeile und eine Spalte gespeichert. Anschließend werden einige zusätzliche Spielzustände gespeichert, darunter die ausgewählte Figur (gSelectedPieceIndex, eine ganze Zahl), die Figur, die sich in der Mitte einer langen Reihe von Sprüngen befindet (gSelectedPieceHasMoved, ein boolescher Wert) und die Gesamtzahl der durchgeführten Züge (gMoveCount, eine ganze Zahl).

Wenn die Seite geladen wird, rufen wir, anstatt automatisch die Funktion „newGame()“ aufzurufen, die alle Variablen auf ihre ursprünglichen Werte zurücksetzen würde, „resumeGame()“ auf. Die Funktion „resumeGame()“ verwendet HTML5-Speicher, um den Status des Spiels im lokalen Speicher zu überprüfen. Falls vorhanden, werden die Werte mithilfe des localStorage-Objekts wiederhergestellt.

Funktion resumeGame() (
if (!supportsLocalStorage()) ( return false; )
gGameInProgress = (localStorage["halma.game.in.progress"] == "true");
if (!gGameInProgress) ( return false; )
gStücke = neues Array(kNumStücke);
für (var i = 0; i< kNumPieces; i++) {
var row = parseInt(localStorage["halma.piece." + i + ".row"]);
var Column = parseInt(localStorage["halma.piece." + i + ".column"]);
gPieces[i] = neue Zelle(Zeile, Spalte);
}
gNumPieces = kNumPieces;
gSelectedPieceIndex = parseInt(localStorage["halma.selectedpiece"]);
gSelectedPieceHasMoved = localStorage["halma.selectedpiecehasmoved"] == "true";
gMoveCount = parseInt(localStorage["halma.movecount"]);
drawBoard();
return true;
}

Der wichtigste Teil dieser Funktion ist ein Vorbehalt, den ich weiter oben in diesem Kapitel erwähnt habe und den ich hier wiederholen werde: Daten werden als Zeichenfolgen gespeichert. Wenn Sie etwas anderes als Zeichenfolgen speichern, müssen Sie diese beim Empfang konvertieren. Beispielsweise ist das Flag, dass ein Spiel läuft (gGameInProgress), ein boolescher Typ. In der Funktion saveGameState() speichern wir es einfach und kümmern uns nicht um den Datentyp.

localStorage["halma.game.in.progress"] = gGameInProgress;

Aber in der Funktion „resumeGame()“ müssen wir den aus dem lokalen Speicher abgerufenen Wert als Zeichenfolge betrachten und manuell unseren eigenen booleschen Wert erstellen.

gGameInProgress = (localStorage["halma.game.in.progress"] == "true");

Ebenso wird die Anzahl der Züge in gMoveCount als Ganzzahl gespeichert, in der Funktion saveGameState() speichern wir sie einfach.

localStorage["halma.movecount"] = gMoveCount;

Aber in der Funktion „resumeGame()“ müssen wir den Wert mithilfe der in JavaScript integrierten Funktion „parseInt()“ in eine Ganzzahl konvertieren.

gMoveCount = parseInt(localStorage["halma.movecount"]);

Jenseits von Schlüssel-Wert-Paaren: Wettbewerbsvision

Obwohl es im Laufe der Geschichte viele Tricks und Problemumgehungen gab, ist der aktuelle Zustand der HTML5-Speicherung überraschend gesund. Die neue API wurde standardisiert und in allen wichtigen Browsern, Plattformen und Geräten integriert. Für einen Webentwickler ist das nicht etwas, was man jeden Tag sieht, oder? Aber es steckt mehr dahinter als „5 Megabyte Schlüssel/Wert-Paare“ und die Zukunft des persistenten lokalen Speichers ist … wie soll ich sagen … nun, sagen wir mal, es ist eine wettbewerbsfähige Vision.

Eine Vision ist ein Akronym, das Sie bereits kennen – SQL. Im Jahr 2007 brachte Google Gears auf den Markt, ein browserübergreifendes Open-Source-Plugin Quellcode, das eine integrierte SQLite-basierte Datenbank enthält. Dieser frühe Prototyp beeinflusste später die Erstellung der Web-SQL-Datenbankspezifikation. Web SQL Database (früher bekannt als „WebDB“) bietet einen dünnen Wrapper um eine SQL-Datenbank, der es Ihnen ermöglicht, die folgenden Dinge mit JavaScript zu tun:

openDatabase("Dokumente", "1.0", "Lokaler Dokumentenspeicher", 5*1024*1024, Funktion (db) (
db.changeVersion("", "1.0", Funktion (t) (
t.executeSql("CREATE TABLE docids (id, name)");
), Fehler);
});

Wie Sie sehen, stehen die meisten Aktionen im Einklang mit der ExecuteSQL-Methode. Diese Zeichenfolge kann jeden SQL-Befehl unterstützen, einschließlich SELECT, UPDATE, INSERT und DELETE. Es ist wie serverseitige Datenbankprogrammierung, nur dass Sie es mit JavaScript tun! O Freude!

Die Web-SQL-Datenbankspezifikation wurde in vier Browsern und Plattformen implementiert.

Unterstützung für Web-SQL-Datenbanken

I.E.	Feuerfuchs	Safari	Chrom	Oper	iPhone	Android
–	–	4.0+	4.0+	10.5+	3.0+	2.0+

Wenn Sie in Ihrem Leben mehr als eine Datenbank verwendet haben, wissen Sie natürlich, dass „SQL“ eher ein Marketingbegriff als ein fester Standard ist (manche sagen vielleicht dasselbe über HTML5, aber das spielt keine Rolle). . Natürlich gibt es eine aktuelle SQL-Spezifikation (genannt SQL-92), aber es gibt keinen Datenbankserver auf der Welt, der nur dieser Spezifikation entspricht. Es gibt Oracle SQL, Microsoft SQL, SQL in MySQL, SQL in PostgreSQL, SQL in SQLite. Tatsächlich fügt jedes dieser Produkte im Laufe der Zeit neue SQL-Funktionalität hinzu, sodass es nicht ausreicht, nur „SQL in SQLite“ zu sagen. Sie sollten „Version von SQL, die mit der SQLite-Version X.Y.Z geliefert wird“ sagen.

All dies bringt uns zum nächsten Haftungsausschluss, der derzeit oben in der Web SQL-Spezifikation steht.

Die Spezifikation ist in einer Sackgasse angekommen: Alle interessierten Entwickler verwenden serverseitiges SQL (SQLite), aber wir benötigen mehrere unabhängige Implementierungen, um in Richtung Standardisierung zu gelangen. Während andere Entwickler an der Implementierung dieser Spezifikation interessiert sind, wurde die SQL-Dialektbeschreibung als bloße Referenz auf Sqlite belassen, was für den Standard nicht akzeptabel ist.

Vor diesem Hintergrund erzähle ich Ihnen von einer weiteren Wettbewerbsvision für den fortschrittlichen, persistenten lokalen Speicher für Webanwendungen: Indexed Database API, früher bekannt als „WebSimpleDB“, jetzt liebevoll IndexedDB genannt.

Die Indexed Database API stellt den sogenannten Objektspeicher bereit, wobei viele Ideen von SQL-Datenbanken übernommen wurden. Es gibt „Datenbanken“ mit „Datensätzen“, wobei jeder Datensatz eine bestimmte Anzahl von „Feldern“ hat. Jedes Feld hat einen bestimmten Datentyp, der beim Erstellen der Datenbank festgelegt wird. Sie können eine Teilmenge der Datensätze auswählen und diese dann mit dem „Cursor“ auflisten. Änderungen am Objektspeicher werden mit „Transaktionen“ verarbeitet.

Wenn Sie schon einmal SQL-Datenbanken programmiert haben, sind Ihnen diese Begriffe wahrscheinlich bekannt. Der Hauptunterschied besteht darin, dass kein Objektspeicher vorhanden ist strukturierte Sprache Anfragen. Sie schreiben keine Bedingung wie „SELECT * from USERS where ACTIVE = „Y““. Stattdessen verwenden wir die vom Objektspeicher bereitgestellten Methoden, um die USERS-Datenbank zu öffnen, die Datensätze aufzuzählen, unsere Datensätze zu filtern und Zugriffsmethoden zu verwenden, um den Wert jedes Felds der verbleibenden Datensätze abzurufen. Ein früher Rundgang durch IndexedDB ist ein gutes Tutorial zur Funktionsweise von IndexedDB und zum Vergleich von IndexedDB mit Web SQL.

Zum Zeitpunkt des Verfassens dieses Artikels wurde IndexedDB nur in der Betaversion von Firefox 4 implementiert. Im Gegensatz dazu hat Mozilla erklärt, dass es niemals Web SQL implementieren wird. Google hat erklärt, dass sie IndexedDB-Unterstützung für Chromium in Betracht ziehen Google Chrome. Und sogar Microsoft sagte, IndexedDB sei „eine großartige Lösung für das Web“.

Was können Sie als Webentwickler mit IndexedDB tun? Im Moment gibt es fast nichts außer einigen Technologiedemonstrationen. In einem Jahr? Vielleicht.

Verwenden von HTML5-Funktionen zum Speichern von Daten und zum Offline-Arbeiten

Teil 1. Implementierung der Offline-Datenbearbeitung und Datensynchronisierung

Inhaltsreihe:

Dieser Inhalt ist Teil # einer Reihe von # Artikeln: Verwenden von HTML5-Funktionen zum Speichern von Daten und zum Offline-Arbeiten

http://www.?sn=dw&lang=ru&cc=RU&en=utf&hpp=20&dws=rudw&lo=ru&q=%D0%98%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0% B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5+%D0%B2%D0%B2%D0%B7%D0%BC%D0%BE%D0%B6% D0%BD%D0%BE%D1%81%D1%82%D0%B5%D0%B9+HTML5+%D0%B4%D0%BB%D1%8F+%D1%81%D0%BE%D1%85% D1%80%D0%B0%D0%BD%D0%B5%D0%BD%D0%B8%D1%8F+%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D1% 85+%D0%B8+%D0%BE%D1%84%D1%84%D0%BB%D0%B0%D0%B9%D0%BD%D0%BE%D0%B2%D0%BE%D0%B9+ %D1%80%D0%B0%D0%B1%D0%BE%D1%82%D1%8B&Suche=%D0%9F%D0%BE%D0%B8%D1%81%D0%BA

Seien Sie gespannt auf neue Artikel in dieser Serie.

Nach aktuellen Plänen wird die HTML5-Technologie (HTML-Version 5) frühestens 2014 den Status einer Empfehlung des World Wide Web Consortium (W3C) erhalten. Obwohl die HTML5-Technologie noch kein offizieller Standard ist, fügen Webbrowser-Anbieter bereits HTML5-Funktionen hinzu und fördern diese. Die HTML5-Technologie verbessert die Webfunktionen für Internetseiten und Geschäftsanwendungen. Viele Websites, wie zum Beispiel Amazon Kindle Cloud Reader, nutzen bereits die HTML5-Technologie. Die nächsten beiden Schlüsselfunktionen HTML5 wird Geschäftsanwendungen erheblich verändern: Unterstützung für Offline-Anwendungen und lokale persistente Speicherung. Da HTML5 kein offizieller Standard ist, ist die Unterstützung aller Browser bestenfalls inkonsistent.

In diesem Artikel werden die Offline-Anwendungsunterstützung und verschiedene persistente Speicherfunktionen beschrieben, die der kommende HTML5-Standard bietet. Zur Veranschaulichung der besprochenen Funktionen wird ein Tutorial-Anhang bereitgestellt.

Bildungsanwendung

Die Lernanwendung „Contact Manager“ ermöglicht die Verwaltung von Kontaktinformationen (Namen, Adressen, Telefonnummern). Es unterstützt den Online-Modus, den Offline-Modus und eine einfache Datensynchronisierungsfunktion, mit der Sie lokale Datenänderungen nach dem Wechsel in den Online-Modus mit dem Server synchronisieren können. Wenn die Anwendung offline ist, werden die Daten im lokalen persistenten Speicher gespeichert. Die beschriebene Anwendung unterstützt vier grundlegende persistente Speicherfunktionen – Erstellen/Lesen/Aktualisieren/Löschen (CRUD) – sowohl im Online- als auch im Offline-Modus.

Die Architektur

Datenmodell

Das Datenmodell besteht aus zwei Datenobjekten, Kontakt und Status (siehe). Die Kontakttabelle enthält die eigentlichen Kontaktinformationen; Die Statustabelle enthält die Wörterbuchwerte für die Statusauswahlliste.

Abbildung 2. Datenmodell

Serverschnittstelle

Die Serverschnittstelle besteht aus zwei Servlets: ContactServlet und DictionaryServlet. Diese Servlets werden in beschrieben (die Implementierung dieser Servlets sowie der zugehörigen Geschäftsdienste und Datenanbieter würde den Rahmen dieses Artikels sprengen).

Tabelle 1. Beschreibung der Servlets

Servlet-Name	Betrieb	Optionen	Beschreibung
DictionaryServlet-Code>	getstates	Keiner	Gibt ein Array von Zuständen im JSON-Format (JavaScript Object Notation) zurück.
KontaktServlet	Holen Sie sich alle Kontakte	Keiner	Gibt ein Array von Kontaktdatensätzen im JSON-Format zurück.
KontaktServlet	löschen	contactId – Kennung (ID) des zu löschenden Kontakts.	Löscht den angegebenen Kontakteintrag; gibt ein JSON-Objekt mit einem booleschen Flag zurück, das als Indikator für den Erfolg des Vorgangs dient. "("Ergebnis": wahr/falsch")
KontaktServlet	speichern	contactId – Kennung (ID) des zu speichernden Kontakts (wenn der Wert größer als Null ist, findet ein Aktualisierungsvorgang statt). firstName – Der Wert des Namensfelds. lastName – Der Wert des Feldes „Nachname“. street1 – Der Wert des Feldes Straße 1. street2 – Der Wert des Feldes Straße 2. Stadt – Der Wert des Stadtfeldes. state – Der Wert des State-Felds. zipCode – Der Wert des zipCode-Felds.	Gibt ein JSON-Objekt mit einem booleschen Flag zurück, das als Indikator für den Erfolg des Vorgangs dient, und einer neuen oder aktualisierten Kontakt-ID. "("contactId": , "Ergebnis": "}

Aufruf der Serverschnittstelle

Abbildung 3. Contact Manager-Anwendung

JavaScript-Module

Die Anwendung besteht aus vier speziellen JavaScript-Modulen:

• core.js – unterstützt reguläre JavaScript-Funktionen und wird von anderen Modulen verwendet.
• formEvents.js – Stellt Ereignishandler für Schaltflächen und Formulare bereit. Es leitet Datenbankvorgänge je nach Online- oder Offline-Modus an den richtigen Datenanbieter weiter.
• onlinedb.js – unterstützt Funktionen für die Interaktion mit dem Server, während Sie online sind.
• offlinedb.js unterstützt Funktionen zum lokalen Speichern von Daten.

Darüber hinaus nutzen alle Module letzte Version jQuery-Bibliotheken zur Datenverfolgung, für asynchrone Webanfragen und für dynamische HTML-Unterstützung. Der Client kommuniziert mit dem Server über JSON.

Offline-Anwendungsmanifest

Die Offline-Funktionen von HTML5 ermöglichen die Zwischenspeicherung statischer Dateien und Ressourcen. Die Offline-Anwendungsmanifestdatei (.appcache) ist eine wichtige Datei für die Offline-Anwendungsunterstützung für eine Webanwendung. Die Manifestdatei enthält die folgenden Informationen.

• Ressourcen und Seiten sind offline verfügbar.
• Nur online verfügbare Ressourcen.
• Für Ressourcen, die offline nicht verfügbar sind, wird eine Fallback-Seite angezeigt.

Die Manifestdatei besteht aus drei Abschnitten: CACHE, NETWORK, FALLBACK. Die im Abschnitt CACHE aufgeführten Seiten und Ressourcen werden zwischengespeichert lokales System. Die im Abschnitt NETZWERK aufgeführten Seiten und Ressourcen werden niemals zwischengespeichert und sind nur online verfügbar. Die im Abschnitt FALLBACK angegebene Seite wird angezeigt, wenn die erforderliche Seite nicht offline verfügbar ist. Das Symbol (*) im Abschnitt NETZWERK zeigt an, dass alle anderen Seiten und Servlets nur online verfügbar sind. Wenn das Zeichen (*) fehlt, schlagen Servlet-Aufrufe fehl (auch im Online-Modus). B zeigt die Manifestdatei für die Contact Manager-Anwendung.

Listing 8. Offline-Anwendungsmanifest

CACHE MANIFEST # Revision 1 CACHE: default.html list.html scripts/core.js scripts/localdb.js scripts/onlinedb.js scripts/formEvents.js http://code.jquery.com/jquery-1.7.2.min .js NETZWERK: * FALLBACK: /offline.html

Wichtige Informationen für die Arbeit mit Offline-Anwendungen.

• Die Offline-Anwendungsmanifestdatei extension.appcache muss dem MIME-Typ text/cache-manifest zugeordnet werden. In Apache Tomcat wird diese Aufgabe durch das Hinzufügen eines Mime-Mapping-Elements zur web.xml-Datei gelöst Server(nicht in der web.xml-Datei der Webanwendung). Die meisten Browser ignorieren stillschweigend das Manifest einer Offlineanwendung, wenn ihr MIME-Typ falsch ist.
• Wenn eine Offline-Anwendungsmanifestdatei vorhanden ist, wird immer die auf dem lokalen System zwischengespeicherte Ressource verwendet (auch wenn online).
• Die lokale Ressource wird nur aktualisiert, wenn sich die Manifestdatei der Offlineanwendung ändert. typischerweise durch Ändern der Versionsnummer in Kommentaren innerhalb der Manifestdatei. Änderungen an HTML-Ressourcen oder CSS-Ressourcen werden erst dann im Webbrowser widergespiegelt, wenn die Anwendungsmanifestdatei geändert wird.
• Jede Seite, die die Offline-Nutzung unterstützt, muss die folgende Zeile enthalten:
  

Online- oder Offline-Bewerbung

Mit JavaScript können Sie erkennen, ob eine Anwendung online oder offline ist. Diese Aufgabe wird mit der booleschen Variablen navigator.onLine gelöst. Wenn die Anwendung online ist, gibt diese Variable „True“ zurück.

Formularereignisse (Online- und Offline-Verarbeitung)

Contact Manager verwendet sowohl online als auch offline dasselbe Formular. Damit diese Lösung funktioniert, sind Formular- und Schaltflächen-Ereignishandler erforderlich. Überprüfen Sie den Wert der Variablen navigator.onLine, um zu bestimmen, welcher Vorgang aufgerufen werden soll (lokal oder online). Es wird ein Beispiel für das Laden von Kontaktinformationen angezeigt.

Listing 9. Laden von Daten (im onLoad-Ereignis)

if (navigator.onLine) ( // Auswahlliste muss vor dem Synchronisieren von Daten gefüllt werden // die Liste wird später aus dem Online-Wörterbuch aktualisiert populateOfflineStates(); setStatusText("Kontaktdaten mit Server synchronisieren..."); synchronisiertContacts( ); setStatusText("Wörterbuchdaten werden vom Server geladen..."); populateOnlineStates(); setStatusText("Kontaktdaten werden vom Server geladen..."); loadOnlineContacts(); ) else ( warning("Sie sind derzeit offline." ); populateOfflineStates(); setStatusText("Kontaktdaten aus lokalem Speicher laden..."); loadOfflineContacts(); )

Datensynchronisation

Im Online-Modus verwenden alle CRUD-Vorgänge Servlets für Erstellungs-, Aktualisierungs- und Löschvorgänge. Ändert sich die Online-Datenbank, wird auch der lokale Cache aktualisiert.

Im Offline-Modus verwenden alle CRUD-Vorgänge einen lokalen Datenanbieter, um Änderungen zu speichern. Nachdem die Verbindung zum Server wiederhergestellt wurde, werden die folgenden Aktionen ausgeführt.

• Alle Datensätze, die auf dem lokalen System erstellt wurden, werden auf dem Server gespeichert.
• Alle Datensätze, die auf dem lokalen System geändert wurden, werden auf dem Server aktualisiert.
• Alle Einträge, die auf dem lokalen System gelöscht wurden, werden auf dem Server gelöscht.

Der vollständige Text der Synchronisierungsmethode wird in angezeigt. Der Synchronisierungsprozess verwendet dieselben Online-Funktionen für Erstellungs-, Aktualisierungs- und Löschvorgänge. Der erste Schritt besteht darin, die lokalen Datensätze mithilfe der jQuery-Funktion $.each zu durchlaufen.

Einträge, die auf dem lokalen System aktualisiert oder erstellt wurden, werden mit der Eigenschaft isDirty gekennzeichnet. Ein Speichervorgang wird als neu identifiziert, wenn seine eindeutige Datensatz-ID negativ ist (d. h. die MySQL-Datenbank hat ihm keinen Wert zugewiesen). Einträge, die auf dem lokalen System gelöscht wurden, werden mit der Eigenschaft isDeleted gekennzeichnet.

Listing 10. Offline-Änderungen mit dem Server synchronisieren

var RecordsUpdated = 0; var RecordsCreated = 0; var RecordsDeleted = 0; $.each(data, function(i,item)( if (item.isDeleted) ( deleteOnlineContact(item.id, true); RecordsDeleted++; ) else if (item.isDirty && !item.isDeleted) ( $("input" ).value = item.id; $("input").value = item.firstName; $("input").value = item.lastName; $("input").value = item.street1; $(" input").value = item.street2; $("input").value = item.city; $("select").value = item.state; $("input").value = item.zipCode; var dataString = $("#editContactForm").serialize(); postEditedContact(dataString, true); if (item.id > 0) ( RecordsUpdated++; ) else ( RecordsCreated++; ) ) )); var msg = "Synchronisierungszusammenfassung\n\tAktualisierte Datensätze: " + RecordsUpdated + "\n\tErstellte Datensätze: " + RecordsCreated +"\n\tGelöschte Datensätze: " + RecordsDeleted; Warnung(Nachricht);

Die neuesten Daten werden mit der Operation getcontacts aus der Datenbank abgerufen und angezeigt. Dadurch werden alle von anderen Benutzern vorgenommenen Änderungen berücksichtigt. Diese Daten werden dann auf dem lokalen System gespeichert, um ihre Offline-Verfügbarkeit sicherzustellen.

Abschluss

Am Beispiel einer Bildungsanwendung wurden Empfehlungen zur Unterstützung von Online- und Offline-Betriebsarten aufgezeigt. Eine konsistente Benutzererfahrung wird erreicht, indem die gleiche HTML-Seite für den Online- und Offline-Modus verwendet wird und indem entsprechend dem aktuellen Status (online oder offline) die entsprechenden Online-/Offline-Datenprovider in Form-Event-Handlern aufgerufen werden.

Der Datensynchronisationsalgorithmus bietet eine zuverlässige Grundlage; Es synchronisiert die Ergebnisse der Offline-Erstellung, -Löschung und -Änderung von Datensätzen. Es ist jedoch zu beachten, dass dieser Code noch nicht für den Einsatz in einer Produktionsumgebung bereit ist. Es behandelt beispielsweise keine Konflikte, wenn derselbe Datensatz von Ihnen auf dem lokalen System und von einem anderen Benutzer auf dem Server geändert wird.

Das Erstellen einer To-Do-Listen-App ist normalerweise die erste App, die Sie erstellen, wenn Sie JavaScript lernen. Das Problem bei all diesen Apps besteht jedoch darin, dass alle diese Listen verschwinden, wenn Sie die Seite neu laden.
Es gibt eine einfache Lösung – die Verwendung von lokalem Speicher. Der Vorteil der lokalen Speicherung besteht darin, dass Sie Datenbits auf dem Computer des Benutzers speichern können und beim erneuten Laden der Seite alle Aufgabenlisten immer noch vorhanden sind.

Was ist lokaler Speicher?

Die lokale Datenspeicherung ist Teil eines Speichernetzwerks, das wiederum Teil der HTML5-Spezifikation ist. Es gibt zwei Möglichkeiten, Daten in einer Spezifikation zu speichern:

• Lokaler Speicher: Speichert Daten ohne Ablaufdatum. Diese Option verwenden wir, weil wir möchten, dass unsere Einträge so lange wie möglich auf der Seite bleiben.
• Sitzungsspeicher: Speichert nur Daten für eine Sitzung. Wenn ein Benutzer also einen Tab schließt und ihn erneut öffnet, gehen alle seine Daten verloren.

Vereinfacht ausgedrückt speichert Web Storage lediglich Schlüssel/Wert-Paare mit einem Namen lokal und im Gegensatz zu Cookies werden diese Daten auch dann gespeichert, wenn Sie Ihren Browser schließen oder Ihren Computer ausschalten.

Wenn wir über eine To-Do-Liste nachdenken, benötigen Sie Folgendes:

• Eingangsbereich, wo Sie unsere Liste aushängen können
• Eingabetaste, um eine Liste hinzuzufügen
• Schaltfläche zum Löschen des gesamten Tagebuchs
• Ein ungeordneter Listencontainer, in dem unsere Liste in einer Liste von Elementen platziert wird
• Und schließlich benötigen wir einen DIV-Container, um eine Benachrichtigung anzuzeigen, wenn Sie versuchen, eine leere Aufgabe einzugeben.

Unser HTML sollte also etwa so aussehen:

Alles löschen

Dies ist ein ziemlich normaler HTML-Container, und mit unserem JavaScript können wir das Ganze mit dynamischen Inhalten füllen.

Da wir in diesem Beispiel JQuery verwenden, sollten Sie es auch in Ihr HTML-Dokument einbinden.

JavaScript

Wenn wir über die Struktur einer einfachen „To-Do-Liste“-Anwendung nachdenken, müssen wir zunächst prüfen, ob die Eingabe leer ist, wenn der Benutzer auf die Schaltfläche „Hinzufügen“ oder „Bestätigen“ klickt:

$("#add").click(function() ( var Description = $("#description").val(); //wenn die Aufgabe leer ist if($("#description").val( ) == "") ( $("#alert").html(" Warnung! Du hast die Aufgabe leer gelassen"); $("#alert").fadeIn().delay(1000).fadeOut(); return false; )

Wir haben lediglich den Klick auf die Schaltfläche „Hinzufügen“ getestet und einen einfachen Test durchgeführt, um zu sehen, ob der Benutzer die Eingabe mit etwas gefüllt hat. Wenn nicht, erscheint die Div-Warnung, bleibt 1000 ms lang bestehen und verschwindet dann.

Als nächstes müssen wir ein Listenelement mit einem Wert in die Eingabezeile einfügen und dies voranstellen, damit der Benutzer beim Hinzufügen einer Aufgabe immer an den Anfang der Liste gelangt und die Liste dann speichert Element in den lokalen Speicher verschieben, etwa so:

// Listenelement hinzufügen $("#todos").prepend("

„+Beschreibung+“

"); // alles löschen, was in der Eingabe enthalten ist $("#form").reset(); var todos = $("#todos").html(); localStorage.setItem("todos", todos); return FALSCH; ));

Wie Sie sehen, handelt es sich hier um ziemlich normales jQuery, und wenn es um die lokale Speicherung geht, müssen wir den Schlüssel und den Wert speichern. Der Schlüssel ist ein Name, den wir uns selbst geben. In diesem Fall nennen wir ihn einfach „Todos“, dann müssen wir definieren, was wir speichern möchten, und in diesem Fall ist das der gesamte HTML-Code, der sich in der ungeordneten Todos-Liste befindet. Wie Sie sehen, haben wir alles mit jQuery erfasst und schließlich „false“ zurückgegeben, damit das Formular nicht fehlschlägt und unsere Seite nicht aktualisiert wird.

Unser nächster Schritt besteht darin, zu überprüfen, ob wir etwas im lokalen Speicher gespeichert haben. Wenn ja, müssen wir ihn auf der Seite platzieren. Da wir unserem Schlüssel den Namen „todos“ gegeben haben, müssen wir prüfen, ob er existiert. So:

// wenn wir etwas im lokalen Speicher haben, dann if(localStorage.getItem("todos")) ( $("#todos").html(localStorage.getItem("todos")); )

Wenn Sie unsere Anwendung testen und die Seite neu laden, werden Sie feststellen, dass sie bereits funktioniert. Wir müssen lediglich eine Funktion erstellen, die für das Löschen der gesamten Liste verantwortlich ist. Wir löschen den gesamten lokalen Speicher, laden die Seite neu, damit unsere Änderung wirksam wird, und geben dann „false“ zurück, um den Hash vor der URL wie folgt zu verhindern:

// Den gesamten lokalen Speicher löschen $("#clear").click(function() ( window.localStorage.clear(); location.reload(); return false; ));

Der komplette Code sieht so aus:

$("#add").click(function() ( var Description = $("#description").val(); if($("#description").val() == "") ( $( "#alert").html(" Warnung! Du hast die Aufgabe leer gelassen"); $("#alert").fadeIn().delay(1000).fadeOut(); return false; ) $("#todos").prepend("

„+Beschreibung+“

"); $("#form").reset(); var todos = $("#todos").html(); localStorage.setItem("todos", todos); return false; )); if(localStorage .getItem("todos")) ( $("#todos").html(localStorage.getItem("todos")); ) $("#clear").click(function() ( window.localStorage.clear( ); location.reload(); return false; ));

Browserunterstützung

Die Web Storage-Unterstützung ist für HTML5-Spezifikationen recht gut, sie wird von allen gängigen Browsern und sogar IE8 unterstützt.

zuletzt bearbeitet von

Guten Tag.

Mir fällt schon seit längerer Zeit auf, dass die Option „Lokale Daten bis zum Beenden des Browsers speichern“ im Abschnitt „Cookies“ der Sicherheitseinstellungen von Opera nicht funktioniert. Manchmal werden Cookies gelöscht, manchmal nicht, irgendwie aus Versehen.

Leicht zu überprüfen. Wir haben die obige Flagge gesetzt. Wir verwenden Opera seit ein paar Tagen. Schalten Sie das Internet aus. Starten Sie Opera. Wir öffnen die Cookie-Liste und sehen darin die nicht gelöschten Einträge! Das ordnungsgemäße Löschen von Cookies funktioniert, die automatische Reinigung ist scheiße! Das heißt, alle Anonymität geht zur Hölle. Natürlich verliert VPN seine Bedeutung.

Kann jemand dazu etwas sagen?

P.S.: Ich bin der Meinung, dass sie versuchen, die Oper zu ruinieren. Es ist kein Fortschrittsgefühl zu spüren.

Andere Benutzer hatten zuvor die gleichen Probleme. Lesen...

Ich lese es. Danke schön. Es wird empfohlen, das Add-on zu installieren. Ich habe sofort einen Fehler darin gefunden: Der Download-Verlauf wird nicht gelöscht, obwohl es eine solche Option gibt. Ich werde auf keinen Fall ein obskures Add-on verwenden, wenn es um die Sicherheit geht.

Ich dachte, vielleicht hätten andere Flaggen einen Einfluss darauf. Da mir der Zweck und die Funktionsweise vieler Flags unklar ist. Beispiel: „Erlauben Sie kürzlich geschlossenen Websites, den Empfang und die Übertragung von Daten abzuschließen.“

Ich hoffe, dass das Problem mit dem Löschen von Cookies gelöst wird. Soweit mir aufgefallen ist, stammt es aus Opera 12.

Wir haben die Ursache für dieses Problem bereits gefunden. Jeder gab ihm die Schuld Opera-Browser, aber es stellte sich heraus, dass es ein Fehler von Chromium selbst war ...

Also denke ich über Opera nach. Da ich Opera 12 zum Testen habe und es der gleiche Mist ist.

Es ist seltsam, solche Fehler in der 50. Version zu sehen.

Was sich in der Oper befindet, ist sicherlich interessant. Aber das Produkt heißt Opera, nicht Chromium oder so ähnlich

operasilver40 zuletzt bearbeitet von

Webbrowser sind standardmäßig so eingestellt, dass sie Ihre persönlichen Daten speichern, wenn Sie sie schließen, einschließlich Ihres Browserverlaufs, Kekse s, deins Suchanfragen, was und wann Sie heruntergeladen haben. Wenn Dritte Zugriff auf Ihren Computer haben, kann jeder sehen, welche Seiten Sie besucht haben, welche Anfragen Sie gestellt haben und vieles mehr. All dies kann manuell in Ihren Browsereinstellungen entfernt werden, nur wenn Sie es selbst tun möchten.

Wenn Sie sich für den Datenschutz einsetzen und Ihre persönlichen Daten jedes Mal manuell löschen, wenn Sie Ihre Arbeit im Internet beenden, dann wissen Sie, dass der Browser diese Funktion automatisch ausführen kann. Sobald Sie auf die Schaltfläche „Beenden“ klicken, erledigt der Browser die gesamte Arbeit für Sie. Bitte beachten Sie, dass Ihr Browser gelöscht wird, wenn Sie Ihren Browser gemäß dieser Anleitung konfigurieren Kekse. Dies bedeutet, dass Sie sich bei den Websites, bei denen Sie registriert sind, erneut anmelden müssen. Außerdem führt das Löschen von Cache-Dateien dazu, dass Webseiten nach einem Neustart des Browsers langsamer geladen werden.

Google Chrome

Google Chrome enthält die Option nicht in den Einstellungen automatische Löschung Ihre persönlichen Daten, wenn Sie es schließen. Es ist jedoch möglich, den Browser so einzustellen, dass er sich beim Beenden automatisch löscht. Dazu müssen Sie die Erweiterung installieren und verwenden, aber dazu später mehr. Öffnen Sie zunächst die Einstellungen im Chrome-Menü und klicken Sie ganz unten auf der Seite auf Zeigen zusätzliche Einstellungen , Spalte Persönliche Daten, Drücken Sie den Knopf Inhaltseinstellungen. Im geöffneten Block in der Spalte Kekse Installieren Lokale Daten beim Schließen des Browsers löschen und drücken Sie die Taste Bereit .

Wenn Sie Chrome jetzt schließen, löscht der Browser automatisch Cookies.

Um sicherzustellen, dass der Browser beim Schließen alle Ihre persönlichen Daten löscht, müssen Sie die Click&Clean-Erweiterung im Chrome Web Store installieren.

Beschreibung der Erweiterung: Klicken und reinigen hilft Ihnen, Ihren Browser- und Download-Verlauf zu löschen, den Cache zu leeren, Chrome zu beschleunigen und Speicherplatz auf Ihrer Festplatte freizugeben!
Eine einfache und effektive Lösung zum Bereinigen Ihres PCs: Löscht den Browserverlauf, löscht den Download-Verlauf, löscht Cookies, löscht den Cache, löscht Silverlight-Cookies, löscht Flash-LSO-Dateien, löscht den Java-Cache und vieles mehr. Klicken Sie nach der Installation auf die Schaltfläche „Click&Clean“ in der Symbolleiste des Browsers und wählen Sie „Einstellungen“.

Anmachen " Führen Sie die Reinigung aus, wenn Sie Chrome schließen» im Abschnitt „Erweitert“.

Mit den Optionen in diesem Fenster können Sie steuern, welche Datentypen automatisch gelöscht werden.

Mozilla Firefox

Firefox verfügt über die integrierte Funktion, beim Schließen alle Ihre persönlichen Daten zu löschen, ohne dass Erweiterungen erforderlich sind. Wenn Sie sich jedoch das Bild oben ansehen, hat die Click&Clean-Erweiterung einen Link in der Kopfzeile Holen Sie sich Firefox! um die Erweiterung direkt im Browser zu installieren. Wenn Sie auf den Link klicken, wird er automatisch gestartet Firefox-Browser und installieren Sie die Erweiterung. Wenn Sie jedoch gegen Erweiterungen sind, dann konfigurieren Sie den Browser mit Ihren eigenen Mitteln. Offen Firefox-Einstellungen. Gehen Sie zur Registerkarte Privatsphäre und wählen Sie „ Verwendet Ihre Verlaufsspeichereinstellungen. Aktivieren Sie das Kontrollkästchen Verlauf beim Schließen von Firefox löschen .

Sie können steuern, welche Arten von persönlichen Daten Firefox automatisch löscht, indem Sie auf die Schaltfläche klicken Optionen .

Wählen Sie aus, was Sie löschen möchten, wenn Sie Ihren Browser schließen, und was Sie unverändert lassen möchten.

Internet Explorer

Internet Explorer verfügt außerdem über eine integrierte Funktion zum Löschen Ihrer persönlichen Daten, wenn Sie ihn schließen. Klicken Service und auswählen Internet Optionen um mit den Einstellungen zu beginnen. Auf der Registerkarte Sind üblich in der Spalte Browserverlauf Aktivieren Sie die Option „ Browserverlauf beim Beenden löschen". Um zu konfigurieren, welche Datentypen Internet Explorer beim Beenden löscht, klicken Sie auf Löschen .

Sie können beispielsweise das Kontrollkästchen „ Speichern Sie Daten von Ihren Lieblingswebsites" und dann löscht Internet Explorer keine Cookies und Cache-Dateien für als Favoriten gespeicherte Websites. Drück den Knopf Löschen wenn Sie mit den Einstellungen fertig sind. Internet Explorer startet sofort den Reinigungsmechanismus. Der Browser löscht nun persönliche Daten, wenn Sie den Browser schließen.

Oper

Opera ist wie immer nicht wie alle anderen. Es enthält keine Funktionen, die möglicherweise alle Ihre persönlichen Daten automatisch löschen, wenn Sie Ihren Browser schließen. Zu diesem Zweck verwendet Opera einen Mechanismus namens Private Browsing. Um Seiten in diesem Modus anzuzeigen, wählen Sie das Element im Opera-Menü aus Erstellen Sie ein privates Fenster oder Strg+Umschalt+N .

Privates Surfen bedeutet, dass alle Informationen zu Ihrer Online-Aktivität im Verlauf sofort nach dem Schließen des Fensters gelöscht werden. Wenn Sie dieses Fenster und alle zugehörigen Registerkarten schließen, löscht der Opera-Browser alle damit verbundenen Daten: Browserverlauf, Cache-Elemente, Cookies. Ein geschlossenes privates Fenster kann nicht aus der Liste „Zuletzt geschlossen“ im Hauptmenü wiederhergestellt werden. Nach der Verwendung privater Fenster werden keine Informationen über die von Ihnen besuchten Seiten gespeichert. Wenn Sie jedoch bestimmte Daten gezielt speichern möchten, gibt es eine „Sparschwein“-Funktion.

Wenn Sie Ihr Passwort speichern oder eine Datei herunterladen, bleiben diese Elemente auch nach dem Schließen des Fensters verfügbar.
Notiz! Bitte beachten Sie, dass Opera vorhandene Cookies nicht löscht. Um sie zu löschen, verwenden Sie „Alle Cookies und Websitedaten“.

Im Menü öffnen Einstellungen, gehen Sie zur Registerkarte Privatsphäre und Sicherheit. In der Spalte Kekse Installieren Behalten Sie die lokalen Daten bei, bis Sie den Browser schließen. Klicken Alle Cookies und Websitedaten, Cookies löschen.

Bitte beachten Sie, dass Sie Ihren Browser schließen müssen, um Ihre persönlichen Daten vollständig zu löschen. Zum Beispiel, wenn Sie mehrere haben Fenster öffnen Beim Schließen von Firefox werden die Daten nicht automatisch gelöscht. Sie müssen alle Browserfenster schließen.

http://webdoker.ru