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
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
|
---
title: IDBTransaction
slug: Web/API/IDBTransaction
tags:
- API
- IDBTransaction
- IndexedDB
- Interface
- Reference
translation_of: Web/API/IDBTransaction
---
<div>{{APIRef("IndexedDB")}}</div>
<p>L'interface <strong><code>IDBTransaction</code></strong> de l'<a href="/fr/docs/Web/API/API_IndexedDB">API IndexedDB</a> fournit une transaction statique asynchrone vers une base de données grâce à des attributs de gestion d'évènementns. Toutes les opérations de lecture et d'écriture de données sont effectuées au sein de transaction. Il est possible d'utiliser {{domxref("IDBDatabase")}} afin d'initier des transactions puis {{domxref("IDBTransaction")}} afin de paramétrer le mode de la transaction (c'est-à-dire s'il est en lecture seule ou en lecture/écriture) et d'accéder à un objet {{domxref("IDBObjectStore")}} pour réaliser une requête. On peut également utiliser <code>IDBTransaction</code> pour interrompre une requête.</p>
<p>S'il vous garantir une certaine longévité (par exemple si on utilise des données critiques qui ne peuvent pas être recalculées par la suite), il est possible d'écrire le contenu de la transaction sur le disque avant la diffusion de l'évènement <code>complete</code> grâce au mode expérimental non-standard <code>readwriteflush</code> (cf. {{domxref("IDBDatabase.transaction")}}).</p>
<p>On notera qu'une transaction commence dès sa création et pas lorsque la première requête est lancée. Par exemple :</p>
<pre class="brush: js" id="comment_text_0">var trans1 = db.transaction("toto", "readwrite");
var trans2 = db.transaction("toto", "readwrite");
trans2.put("2", "clé");
trans1.put("1", "clé");
</pre>
<p>Une fois que le code est exécuté, le magasin d'objet contiendra la valeur "2" car la transaction est lancée après la transaction <code>trans1</code>.</p>
<p>{{AvailableInWorkers}}</p>
<h2 id="Méthodes">Méthodes</h2>
<p>Cette interface hérite de {{domxref("EventTarget")}}.</p>
<dl>
<dt>{{domxref("IDBTransaction.abort")}}</dt>
<dd>Cette méthode annule les modifications apportées aux objets associés à cette transaction. Si la transaction a déjà été interrompue ou est terminée, cette méthode déclenchera un évènement d'erreur.</dd>
<dt>{{domxref("IDBTransaction.objectStore")}}</dt>
<dd>Cette méthode renvoie un objet {{domxref("IDBObjectStore")}} qui représente le magasin d'objet associé à cette transaction.</dd>
</dl>
<h2 id="Propriétés">Propriétés</h2>
<dl>
<dt>{{domxref("IDBTransaction.db")}} {{readonlyInline}}</dt>
<dd>La connexion à la base de données associée à cette transaction.</dd>
<dt>{{domxref("IDBTransaction.mode")}} {{readonlyInline}}</dt>
<dd>Le mode de la transaction qui définit la façon dont on accède/modifie les données. Les différentes valeurs sont définies ci-après dans la section Constante. Par défaut, la valeur est <code>readonly</code>.</dd>
<dt>{{domxref("IDBTransaction.objectStoreNames")}} {{readonlyinline}}</dt>
<dd>Cette propriété est une liste ({{domxref("DOMStringList")}}) des noms des objets {{domxref("IDBObjectStore")}}.</dd>
<dt>{{domxref("IDBTransaction.error")}} {{readonlyInline}}</dt>
<dd>Cette propriété renvoie le type de l'erreur qui se produit lorsque la transaction infructueuse. Cette propriété vaut <code>null</code> si la transaction n'est pas finie, est finie et validée correctement ou a été cloturée avec la fonction{{domxref("IDBTransaction.abort")}}.</dd>
</dl>
<h3 id="Gestionnaires_d'évènements">Gestionnaires d'évènements</h3>
<dl>
<dt>{{domxref("IDBTransaction.onabort")}} {{readonlyInline}}</dt>
<dd>Ce gestionnaire permet de gérer l'évènement <code>abort</code> qui est déclenché lorsque la transaction a été interrompue.</dd>
<dt>{{domxref("IDBTransaction.oncomplete")}} {{readonlyInline}}</dt>
<dd>Ce gestionnaire permet de gérer l'évènement <code>complete</code> qui est déclenché lorsque la transaction se finit correctement.</dd>
<dt>{{domxref("IDBTransaction.onerror")}} {{readonlyInline}}</dt>
<dd>Ce gestionnaire permet de gérer l'évènement <code>error</code> qui est déclenché lorsqu'une erreur empêche la transaction de se finir correctement.</dd>
</dl>
<h2 id="Les_différents_modes">Les différents modes</h2>
<p>Une transaction peut s'effectuer dans l'un de ces modes :</p>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Valeur</th>
<th scope="col">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<p>"readonly"</p>
<p>(0 dans Chrome)</p>
</td>
<td>Ce mode permet de lire les données mais pas de les modifier.</td>
</tr>
<tr>
<td>
<p>"readwrite"</p>
<p>(1 dans Chrome)</p>
</td>
<td>Ce mode permet de lire, d'écrire et de modifier les données du magasin d'objets.</td>
</tr>
<tr>
<td>
<p>"versionchange"</p>
<p>(2 dans Chrome)</p>
</td>
<td>Ce mode permet d'effectuer toutes les opérations, y compris l'ajout ou la suppression de magasins d'objets et d'index. Ce mode doit être utilisé pour mettre à jour le numéro de version utilisé par les transactions démarées avec la méthode <a href="/fr/docs/Web/API/IDBDatabase"><code>setVersion()</code></a> de <code><a href="/fr/docs/Web/API/IDBDatabase">IDBDatabase</a></code>. Les transactions lancées dans ce mode ne peuvent pas être lancées en même temps que d'autres transactions. Ces transactions sont parfois qualifiées comme « transactions de mise à jour ».</td>
</tr>
</tbody>
</table>
<h2 id="Exemples">Exemples</h2>
<p>Dans l'exemple qui suit, on ouvre une transaction en lecture/écriture sur la base de données et on ajoute des données dans le magasin d'objet. On notera également l'utilisation des gestionnaires d'évènements attachés à la transaction qui permettent d'indiquer la réussite ou l'échec de l'ouverture de la transaction. Pour un exemple complet, voir <a href="https://github.com/mdn/to-do-notifications/">l'application de notifications To-do</a> (<a href="https://mdn.github.io/to-do-notifications/">voir également la démonstration <em>live</em></a>)</p>
<pre class="brush: js">// On commence par ouvrir la base de données
var DBOpenRequest = window.indexedDB.open("toDoList", 4);
DBOpenRequest.onsuccess = function(event) {
note.innerHTML += '<li>Initialisation de la base.</li>';
// On enregistre le résultat de l'ouverture
// dans la variable db afin de l'utiliser
// ensuite
var db = DBOpenRequest.result;
// On utilise la fonction addData() afin d'ajouter
// des données à la base de données
addData();
};
function addData() {
// On crée un nouvel objet prêt à être inséré
// dans la base de données
var newItem = [ { taskTitle: "Promener le chien", hours: 19, minutes: 30, day: 24, month: "Décembre", year: 2013, notified: "no" } ];
// On ouvre une transaction en lecture/écriture
// vers la base de données afin d'ajouter des
// données
var transaction = db.transaction(["toDoList"], "readwrite");
// On indique le succès de la transaction
transaction.oncomplete = function(event) {
note.innerHTML += '<li>Transaction terminée : modification finie.</li>';
};
transaction.onerror = function(event) {
note.innerHTML += '<li>Transaction non-ouverte à cause d'une erreur. Les doublons ne sont pas autorisés.</li>';
};
// On crée un magasin d'objet pour la transaction
var objectStore = transaction.objectStore("toDoList");
// On ajoute l'objet newItem au magasin d'objets
var objectStoreRequest = objectStore.add(newItem[0]);
objectStoreRequest.onsuccess = function(event) {
// On indique le succès de l'ajout de l'objet
// dans la base de données
note.innerHTML += '<li>Un nouvel élément a été ajouté dans la base de données.</li>';
};
};</pre>
<h2 id="Spécifications">Spécifications</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Spécification</th>
<th scope="col">État</th>
<th scope="col">Commentaires</th>
</tr>
<tr>
<td>{{SpecName('IndexedDB', '#transaction', 'IDBTransaction')}}</td>
<td>{{Spec2('IndexedDB')}}</td>
<td>Définition initiale</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Fonctionnalité</th>
<th>Chrome</th>
<th>Edge</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>Support simple</td>
<td>{{CompatChrome(23)}}{{property_prefix("webkit")}}<br>
{{CompatChrome(24)}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatVersionUnknown}}</td>
<td>10 {{property_prefix("moz")}}<br>
{{CompatGeckoDesktop("16.0")}}</td>
<td>10, partial</td>
<td>15</td>
<td>7.1</td>
</tr>
<tr>
<td>Disponible dans les <em>web workers</em></td>
<td>{{CompatVersionUnknown}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("37.0")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatOpera(35)}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td><code>objectStoreNames</code></td>
<td>{{CompatChrome(48.0)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop("50.0")}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatOpera(35)}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Fonctionnalité</th>
<th>Webview Android</th>
<th>Chrome pour Android</th>
<th>Edge</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS</th>
<th>IE Phone</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome pour Android</th>
</tr>
<tr>
<td>Support simple</td>
<td>{{CompatVersionUnknown}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatVersionUnknown}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoMobile("22.0")}}</td>
<td>1.0.1</td>
<td>10</td>
<td>22</td>
<td>8</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
<tr>
<td>Disponible dans les <em>web workers</em></td>
<td>{{CompatVersionUnknown}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatVersionUnknown}}<br>
{{CompatChrome(38)}} (dépréciation des préfixes)<br>
{{CompatChrome(57)}} (retrait des préfixes)</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("37.0")}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatOperaMobile(35)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
<tr>
<td><code>objectStoreNames</code></td>
<td>{{CompatChrome(48.0)}}</td>
<td>{{CompatChrome(48.0)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatOperaMobile(35)}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatChrome(48.0)}}</td>
</tr>
</tbody>
</table>
</div>
<p>[1] Older versions of Chrome serialize all transactions. So even if you have only read-only transactions and no read-write transaction, your transactions are executed one at a time. Any subsequent transactions are not executed until all read-only transactions are completed. For the status, see <a href="https://crbug/64076">bug 64076</a>.</p>
<p>Note that as of Firefox 40, IndexedDB transactions have relaxed durability guarantees to increase performance (see {{Bug("1112702")}}.) Previously in a <code>readwrite</code> transaction {{domxref("IDBTransaction.oncomplete")}} was fired only when all data was guaranteed to have been flushed to disk. In Firefox 40+ the <code>complete</code> event is fired after the OS has been told to write the data but potentially before that data has actually been flushed to disk. The <code>complete</code> event may thus be delivered quicker than before, however, there exists a small chance that the entire transaction will be lost if the OS crashes or there is a loss of system power before the data is flushed to disk. Since such catastrophic events are rare most consumers should not need to concern themselves further.</p>
<h2 id="Voir_aussi">Voir aussi</h2>
<ul>
<li><a href="/fr/docs/Web/API/API_IndexedDB/Using_IndexedDB">Utiliser IndexedDB</a></li>
<li>Initier une connexion : {{domxref("IDBDatabase")}}</li>
<li>Utiliser les transactions : {{domxref("IDBTransaction")}}</li>
<li>Définir un intervalle de clés : {{domxref("IDBKeyRange")}}</li>
<li>Récupérer et modifier les données : {{domxref("IDBObjectStore")}}</li>
<li>Utiliser les curseurs {{domxref("IDBCursor")}}</li>
<li>Exemple de référence : <a class="external" href="https://github.com/mdn/to-do-notifications/tree/gh-pages">To-do Notifications</a> (<a class="external" href="https://mdn.github.io/to-do-notifications/">exemple <em>live</em></a>).</li>
</ul>
|