aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/api/indexeddb_api/index.html
blob: 171ca8a4c5868aa76e9560073ad27b6f2a9aa40b (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
---
title: IndexedDB
slug: Web/API/IndexedDB_API
tags:
  - API
  - Datenbank
  - Einstieg
  - IndexedDB
  - NeedsTranslation
  - Referenz
  - Speicher
  - TopicStub
  - speichern
translation_of: Web/API/IndexedDB_API
---
<div>{{DefaultAPISidebar("IndexedDB")}}</div>

<p>IndexedDB ist eine low-level API für die clientseitige Speicherung großer Mengen strukturierter Daten einschließlich Dateien. Sie erlaubt auch Hochleistungssuchen dieser Daten durch die Verwendung von Indizes. Während der <a href="/de/docs/DOM/Storage" title="en-US/docs/DOM/Storage">DOM Speicher</a> nützlich zur Speicherung kleiner Datenmengen ist, ist er für größere Mengen strukturierte Daten wenig hilfreich. IndexedDB stellt hierfür eine Lösung bereit. Dies ist die Einstiegsseite der IndexedDB Referenz von MDN — hier stellen wir Links zur vollständigen API Referenz, Gebrauchsanleitungen, Unterstützungsdetails der Browser und einige Erklärungen des Schlüsselkonzepts zur Verfügung.</p>

<p>{{AvailableInWorkers}}</p>

<div class="note">
<p><strong>Anmerkung</strong>: Die IndexedDB API ist leistungsfähig, kann aber für einfache Anwendungen zu kompliziert erscheinen. Wenn Du eine einfachere API bevorzugst, versuche Sammlungen wie <a href="https://localforage.github.io/localForage/">localForage</a> und <a href="http://www.dexie.org/">dexie.js</a>. Diese machen IndexedDB benutzerfreundlicher.</p>
</div>

<div class="note">
<p><strong>Anmerkung</strong>: Manche älteren Browser unterstützen IndexedDB nicht aber sie unterstützen <a href="http://caniuse.com/sql-storage"> WebSQL</a>. Eine Möglichkeit dieses Problem zu umgehen ist es, mittels polyfill auf <a href="http://www.w3.org/TR/webdatabase/">WebSQL</a> oder auch auf <a href="/de/docs/Web/Guide/API/DOM/Storage#localStorage">localStorage</a> für nicht unterstützende Browser zurückzugreifen. Das beste erhältiche polyfill ist derzeit <a href="https://localforage.github.io/localForage/">localForage</a>.</p>
</div>

<h2 id="Schlüsselkonzepte_und_Gebrauch">Schlüsselkonzepte und Gebrauch</h2>

<p>IndexedDB ist ein direktes Datenbank System, wie ein SQL-basiertes RDMS; während allerdings das Letztere Tabellen mit fixen Spalten benutzt, ist IndexedDB eine JavaScript-basierte objekt-orientierte Datenbank. IndexedDB läßt dich Objekte, die mit einem <strong>Schlüssel</strong> indiziert sind, speichern und wiederfinden. Jedes Objekt, das von einem <a href="/de/docs/Web/Guide/API/DOM/The_structured_clone_algorithm">strukturierten Klon Algorithmus</a> unterstützt wird, kann gespeichert werden. Du brauchst zum Beschreiben des Datenbankschemas eine offene Verbindung zu deiner Datenbank, dann kannst du Daten mit einer Reihe von Tranaktionen wiederfinden und aktualisieren.</p>

<ul>
 <li>Lies mehr über die <a href="/de/docs/Web/API/IndexedDB_API/Basic_Concepts_Behind_IndexedDB">Konzepte hinter IndexedDB</a>.</li>
 <li>Nutze IndexedDB asynchron, indem du die Grundlagen mit unserer <a href="/de/docs/Web/API/IndexedDB_API/Using_IndexedDB">IndexedDB Anleitung</a> erlernst.</li>
 <li>Finde Entwickler Empfehlungen, um Web Apps offline arbeiten zu lassen auf unserer <a href="/en-US/Apps/Build/Offline">Offline Apps</a> Seite</li>
</ul>

<div class="note">
<p><strong>Anmerkung</strong>: wie die meisten Web Speicher Lösungen folgt IndexedDB einem <a class="external" href="http://www.w3.org/Security/wiki/Same_Origin_Policy">gleicher-Ursprung Grundsatz</a>. Deshalb ist es nicht möglich auf Daten anderer Domänen zuzugreifen, während man auf gespeicherte Daten innerhalb einer Domäne zugreift.</p>
</div>

<h3 id="Synchron_und_asynchron">Synchron und asynchron</h3>

<p>Operationen unter Verwendung von IndexedDB werden asynchron durchgeführt, um Anwendungen nicht zu blockieren. IndexedDB beinhaltete ursprünglich eine asynchrone und eine synchrone API; die synchrone API war nur für den Gebrauch von <a href="/de/docs/Web/Guide/Performance/Using_web_workers">Web Workers</a> gedacht. Die synchrone Version wurde aus der Spezifikation entfernt, weil ihre Notwendigkeit fraglich war, aber sie kann in Zukunft wieder eingeführt werden, wenn es genug Nachfrage von Web Entwicklern gibt.</p>

<h3 id="Speichergrenzen_und_Löschkriterien">Speichergrenzen und Löschkriterien</h3>

<p>Es gibt mehrere Webtechnologien, um Daten auf die eine oder andere Art auf der Client Seite zu speichern (d. h. auf deiner lokalen Festplatte), über IndexedDB wird dabei am häufigsten geredet. Der Prozess mit dem der Browser herausfindet, wieviel Speicherplatz Webdaten zur Verfügung gestellt werden soll und was gelöscht werden soll, wenn die Grenze erreicht ist, ist nicht einfach und unterscheidet sich zwischen den Browsern. <a href="/de/docs/Web/API/IndexedDB_API/Browser_storage_limits_and_eviction_criteria">Browser Speichergrenzen und Löschkriterien</a> versuchen zu erklären, wie das geschieht - zumindest im Fall von Firefox.</p>

<h2 id="IndexedDB_Schnittstellen">IndexedDB Schnittstellen</h2>

<p>Um Zugang zu einer Datenbank zu erhalten, benutze <a href="/de/docs/Web/API/IDBFactory.open"><code>open()</code></a> von den <a href="/de/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB</code></a> Attributen eines <a href="/de/docs/DOM/window">window</a> Objekts. Diese Methode gibt ein {{domxref("IDBRequest")}} Objekt zurück; asynchrone Operationen kommunizieren mit der aufrufenden Anwendung durch feuern von Events von {{domxref("IDBRequest")}} Objekten.</p>

<h3 id="Mit_einer_Datenbank_verbinden">Mit einer Datenbank verbinden</h3>

<dl>
 <dt>{{domxref("IDBEnvironment")}}</dt>
 <dd>Stellt den Zugang zur IndexedDB Funktionalität zur Verfügung. Es ist implementiert durch die {{domxref("window")}} und {{domxref("worker")}} Objekte.</dd>
 <dt>{{domxref("IDBFactory")}}</dt>
 <dd>Stellt den Zugang zu einer Datenbank bereit. Dies ist die durch das globale Objekt <a href="/en-US/docs/Web/API/IDBEnvironment.indexedDB"><code>indexedDB </code></a>bereitgestellte Schnittstelle und dadurch der Eingangspunkt für die API.</dd>
 <dt>{{domxref("IDBOpenDBRequest")}}</dt>
 <dd>Stellt eine Anfrage zum Öffnen einer Datenbank dar.</dd>
 <dt>{{domxref("IDBDatabase")}}</dt>
 <dd>Repräsentiert eine Verbindung zu einer Datenbank. Es ist der einzige Weg eine Transaktion in der Datenbank zu erreichen.</dd>
</dl>

<dl>
 <dt>{{domxref("IDBRequest")}}</dt>
 <dd>Eine allgemeine Schnittstelle, die Datenbankabfragen behandelt und den Zugang zu Ergebnissen bereitstellt.</dd>
</dl>

<h3 id="Abrufen_und_modifizieren_von_Daten">Abrufen und modifizieren von Daten</h3>

<dl>
 <dt>{{domxref("IDBTransaction")}}</dt>
 <dd>Stellt eine Transaktion dar. Du erstellst eine Transaktion zu einer Datenbank, beschreibst den Geltungsbereich (beispielsweise auf welchen Objekt Speicher du zugreifen willst), und bestimmst die Art des Zugriffs (nur lesen oder lesen und schreiben), den du willst.</dd>
 <dt>{{domxref("IDBObjectStore")}}</dt>
 <dd>Steht für einen Objektspeicher, der Zugriff auf einen Datensatz in einer IndexedDB Datenbank erlaubt via Primärschlüsselsuche.</dd>
 <dt>{{domxref("IDBIndex")}}</dt>
 <dd>Gestattet ebenfalls Zugriff auf eine Teilmenge von Daten in einer IndexedDB Datenbank. Nutzt allerdings einen Index anstelle eines Primärschlüssels um an Einträge zu gelangen. Dies kann schneller sein als die Verwendung von {{domxref("IDBObjectStore")}}.</dd>
 <dt>{{domxref("IDBCursor")}}</dt>
 <dd>Iterates over object stores and indexes.</dd>
 <dt>{{domxref("IDBCursorWithValue")}}</dt>
 <dd>Iterates over object stores and indexes and returns the cursor's current value.</dd>
 <dt>{{domxref("IDBKeyRange")}}</dt>
 <dd>Defines a key range that can be used to retrieve data from a database in a certain range.</dd>
 <dt>{{domxref("IDBLocaleAwareKeyRange")}} {{Non-standard_inline}}</dt>
 <dd>Defines a key range that can be used to retrieve data from a database in a certain range, sorted acording to the rules of the locale specified for a certain index (see <a href="/en-US/docs/Web/API/IDBObjectStore/createIndex#Parameters"><code>createIndex()</code>'s optionalParameters</a>.).</dd>
</dl>

<h3 id="Custom_event_interfaces">Custom event interfaces</h3>

<p>This specification fires events with the following custom interface:</p>

<dl>
 <dt>{{domxref("IDBVersionChangeEvent")}}</dt>
 <dd>The <code>IDBVersionChangeEvent</code> interface indicates that the version of the database has changed, as the result of an {{domxref("IDBOpenDBRequest.onupgradeneeded")}} event handler function.</dd>
</dl>

<h3 id="Obsolete_interfaces">Obsolete interfaces</h3>

<p>An early version of the specification also defined these now removed interfaces. They are still documented in case you need to update previously written code:</p>

<dl>
 <dt>{{domxref("IDBVersionChangeRequest")}} {{obsolete_inline}}</dt>
 <dd>Represents a request to change the version of a database. The way to change the version of the database has since changed (by calling {{domxref("IDBFactory.open")}} without also calling {{domxref("IDBDatabase.setVersion")}}), and the interface {{domxref("IDBOpenDBRequest")}} now has the functionality of the removed {{domxref("IDBVersionChangeRequest")}}.</dd>
 <dt>{{domxref("IDBDatabaseException")}} {{obsolete_inline}}</dt>
 <dd>Represents exception conditions that can be encountered while performing database operations.</dd>
 <dt>{{domxref("IDBTransactionSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBTransaction")}}.</dd>
 <dt>{{domxref("IDBObjectStoreSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBObjectStore")}}.</dd>
 <dt>{{domxref("IDBIndexSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBIndex")}}.</dd>
 <dt>{{domxref("IDBFactorySync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBFactory")}}.</dd>
 <dt>{{domxref("IDBEnvironmentSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBEnvironment")}}.</dd>
 <dt>{{domxref("IDBDatabaseSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBDatabase")}}.</dd>
 <dt>{{domxref("IDBCursorSync")}} {{obsolete_inline}}</dt>
 <dd>Sync version of {{domxref("IDBCursor")}}.</dd>
</dl>

<h2 id="Examples">Examples</h2>

<ul>
 <li><a class="external" href="http://marco-c.github.io/eLibri/">eLibri:</a> A powerful library and eBook reader application, written by Marco Castelluccio, winner of the IndexedDB Mozilla DevDerby.</li>
 <li><a class="external" href="https://github.com/chrisdavidmills/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="http://mdn.github.io/to-do-notifications/">view example live</a>): The reference application for the examples in the reference docs.</li>
 <li><a class="external" href="http://hacks.mozilla.org/2012/02/storing-images-and-files-in-indexeddb/">Storing images and files in IndexedDB</a></li>
</ul>

<h2 id="Specifications">Specifications</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Specification</th>
   <th scope="col">Status</th>
   <th scope="col">Comment</th>
  </tr>
  <tr>
   <td>{{SpecName('IndexedDB', '#idl-def-IDBEnvironment', 'IDBEnvironment')}}</td>
   <td>{{Spec2('IndexedDB')}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Browser_compatibility">Browser compatibility</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>
    <p>23.0 {{property_prefix("webkit")}}<br>
     24</p>
   </td>
   <td>{{CompatGeckoDesktop("10.0")}} {{property_prefix("moz")}}<br>
    {{CompatGeckoDesktop("16.0")}}</td>
   <td>10, partial</td>
   <td>15</td>
   <td>7.1</td>
  </tr>
  <tr>
   <td>Available in workers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoDesktop("37.0")}}<sup>[1]</sup></td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>IDBLocaleAwareKeyRange</code></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoDesktop("43.0")}}<sup>[2]</sup></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Phone</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Basic support</td>
   <td>4.4</td>
   <td>{{CompatGeckoMobile("22.0")}}</td>
   <td>1.0.1</td>
   <td>10</td>
   <td>22</td>
   <td>8</td>
  </tr>
  <tr>
   <td>Available in workers</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatGeckoMobile("37.0")}}<sup>[1]</sup></td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatVersionUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td><code>IDBLocaleAwareKeyRange</code></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoMobile("43.0")}}<sup>[2]</sup></td>
   <td>2.5<sup>[2]</sup></td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
  </tr>
 </tbody>
</table>
</div>

<ul>
 <li>[1] {{domxref("IDBCursorWithValue")}} is not available in workers until Gecko 42.0 {{geckoRelease("42.0")}}.</li>
 <li>[2] This feature is currently hidden behind a flag — to enable it and experiment, go to about:config and enable dom.indexedDB.experimental.</li>
</ul>

<h2 id="See_also">See also</h2>

<ul>
 <li><a class="external" href="https://localforage.github.io/localForage/">localForage</a>: A Polyfill providing a simple name:value syntax for client-side data storage, which uses IndexedDB in the background, but falls back to WebSQL and then localStorage in browsers that don't support IndexedDB.</li>
 <li><a class="external" href="http://www.dexie.org/">dexie.js</a>: A wrapper for IndexedDB that allows much faster code development via nice, simple syntax.</li>
</ul>