diff options
Diffstat (limited to 'files/fr/web/api/web_storage_api')
| -rw-r--r-- | files/fr/web/api/web_storage_api/index.html | 8 | ||||
| -rw-r--r-- | files/fr/web/api/web_storage_api/using_the_web_storage_api/index.html | 26 |
2 files changed, 17 insertions, 17 deletions
diff --git a/files/fr/web/api/web_storage_api/index.html b/files/fr/web/api/web_storage_api/index.html index d90c9bfd37..bae54c054c 100644 --- a/files/fr/web/api/web_storage_api/index.html +++ b/files/fr/web/api/web_storage_api/index.html @@ -26,15 +26,15 @@ translation_of: Web/API/Web_Storage_API <p>Ces mécanismes sont disponibles via les propriétés {{domxref("Window.sessionStorage")}} et {{domxref("Window.localStorage")}} (pour être plus précis, pour le support des navigateurs, l'objet <code>Window</code> implemente le <code>WindowLocalStorage</code> et l'object <code>WindowSessionStorage</code>, dont les propriétés <code>localStorage</code> et <code>sessionStorage</code> dépendent) — L'appel de l'une de ces propriétés va créer une instance de l'objet {{domxref("Storage")}}, à travers de laquelle les éléments de données peuvent être définis, récupérés et éliminés. Un objet de stockage différent est utilisé pour le sessionStorage et le localStorage pour chaque origine — ils fonctionnent et sont contrôlés séparément.</p> <div class="note"> -<p><strong>Note</strong>: À partir de Firefox 45, lorsque le navigateur se bloque / redémarre, la quantité de données sauvegardées par origine est limitée à 10 Mo. Cela a été mis en place pour éviter les problèmes de mémoire causés par une utilisation excessive du stockage Web.</p> +<p><strong>Note :</strong> À partir de Firefox 45, lorsque le navigateur se bloque / redémarre, la quantité de données sauvegardées par origine est limitée à 10 Mo. Cela a été mis en place pour éviter les problèmes de mémoire causés par une utilisation excessive du stockage Web.</p> </div> <div class="note"> -<p><strong>Note</strong>: L'accès au Web Storage à partir d'iframes externes est interdit si l'utilisateur a <a href="https://support.mozilla.org/en-US/kb/disable-third-party-cookies">désactivé les cookies tierce-partie</a> (Firefox a adopté ce comportement à partir de la <a href="/en-US/docs/Mozilla/Firefox/Releases/43">version 43</a> et suivantes.)</p> +<p><strong>Note :</strong> L'accès au Web Storage à partir d'iframes externes est interdit si l'utilisateur a <a href="https://support.mozilla.org/en-US/kb/disable-third-party-cookies">désactivé les cookies tierce-partie</a> (Firefox a adopté ce comportement à partir de la <a href="/en-US/docs/Mozilla/Firefox/Releases/43">version 43</a> et suivantes.)</p> </div> <div class="note"> -<p><strong>Note:</strong> Le Web Storage n'est pas identique au <a href="/en-US/docs/Storage" title="Storage">mozStorage</a> (interfaces XPCOM de Mozilla vers SQLite) ou l'<a href="/en-US/docs/Session_store_API" title="Session_store_API">API Session store </a> (un utilitaire de stockage <a href="/en-US/docs/XPCOM" title="XPCOM">XPCOM</a> utilisable par des extensions).</p> +<p><strong>Note:</strong> Le Web Storage n'est pas identique au <a href="/en-US/docs/Storage">mozStorage</a> (interfaces XPCOM de Mozilla vers SQLite) ou l'<a href="/en-US/docs/Session_store_API">API Session store </a> (un utilitaire de stockage <a href="/en-US/docs/XPCOM">XPCOM</a> utilisable par des extensions).</p> </div> <h2 id="Web_Storage_interfaces">Web Storage interfaces</h2> @@ -45,7 +45,7 @@ translation_of: Web/API/Web_Storage_API <dt>{{domxref("Window")}}</dt> <dd>L'API Web Storage dérive de l'objet {{domxref("Window")}} avec 2 nouvelles propriétés — {{domxref("Window.sessionStorage")}} et {{domxref("Window.localStorage")}} — lesquelles donnent accès, pour le domaine courant, aux objets session et local {{domxref("Storage")}} respectivement.</dd> <dt>{{domxref("StorageEvent")}}</dt> - <dd>L'événement <code title="event-storage">storage</code> est déclenché sur l'objet <code>Window</code> du document en cas de changement dans un espace de stockage.</dd> + <dd>L'événement <code>storage</code> est déclenché sur l'objet <code>Window</code> du document en cas de changement dans un espace de stockage.</dd> </dl> <h2 id="Exemples">Exemples</h2> diff --git a/files/fr/web/api/web_storage_api/using_the_web_storage_api/index.html b/files/fr/web/api/web_storage_api/using_the_web_storage_api/index.html index 69a8a500b6..96ce992c18 100644 --- a/files/fr/web/api/web_storage_api/using_the_web_storage_api/index.html +++ b/files/fr/web/api/web_storage_api/using_the_web_storage_api/index.html @@ -9,9 +9,7 @@ tags: - localStorage translation_of: Web/API/Web_Storage_API/Using_the_Web_Storage_API --- -<div class="summary"> <p>L'API "Web Storage" fournit des mécanismes par lesquels les navigateurs web peuvent stocker des paires de clé-valeur, d'une manière plus intuitive qu'en utilisant des cookies. Cet article décrit pas à pas comment se servir de cette technologie facile d'utilisation.</p> -</div> <h2 id="Concepts_de_base">Concepts de base</h2> @@ -23,7 +21,7 @@ localStorage.setItem('colorSetting', '#a4509b'); </pre> <div class="blockIndicator note"> -<p><strong>Note</strong>: Il est recommandé d'utiliser l'API "Web Storage" (<code>setItem</code>, <code>getItem</code>, <code>removeItem</code>, <code>key</code>, <code>length</code>) pour prévenir les <a href="http://www.2ality.com/2012/01/objects-as-maps.html">embûches</a> associées à l'utilisation d'objets capable de stocker des couples clé-valeur.</p> +<p><strong>Note :</strong> Il est recommandé d'utiliser l'API "Web Storage" (<code>setItem</code>, <code>getItem</code>, <code>removeItem</code>, <code>key</code>, <code>length</code>) pour prévenir les <a href="http://www.2ality.com/2012/01/objects-as-maps.html">embûches</a> associées à l'utilisation d'objets capable de stocker des couples clé-valeur.</p> </div> <p>Les deux principaux mécanismes internes du Stockage Web sont :</p> @@ -82,25 +80,27 @@ else { <p>Au lieu de cela, vous pouvez tester la disponibilité de sessionStorage en appelant <code>storageAvailable('sessionStorage')</code>. </p> -<p>Vous pouvez retrouver ici <a class="external" href="https://gist.github.com/paulirish/5558557">une brève histoire de la détection de localStorage</a>.</p> +<p>Vous pouvez retrouver ici <a href="https://gist.github.com/paulirish/5558557">une brève histoire de la détection de localStorage</a>.</p> <h2 id="Un_exemple_simple">Un exemple simple</h2> -<p>Pour illustrer certains usages typiques du Stockage Web, nous avons créé un exemple simple ingénieusement appelé <strong>Web Storage Demo</strong>. La <a class="external" href="https://mdn.github.io/dom-examples/web-storage/">page de lancement</a> fournit des contrôles afin de personnaliser la couleur, la police de caractère et l'image de décoration:</p> +<p>Pour illustrer certains usages typiques du Stockage Web, nous avons créé un exemple simple ingénieusement appelé <strong>Web Storage Demo</strong>. La <a href="https://mdn.github.io/dom-examples/web-storage/">page de lancement</a> fournit des contrôles afin de personnaliser la couleur, la police de caractère et l'image de décoration:</p> + +<p><img alt="" src="landing.png"></p> -<p><img alt="" src="https://mdn.mozillademos.org/files/9685/landing.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;">Quand vous choisissez une option différente, la page est mise à jour instantanément; de plus, vos choix sont stockés avec localStorage, donc quand vous quitterez la page et la rechargerez plus tard, vos choix auront été mémorisés.</p> +<p>Quand vous choisissez une option différente, la page est mise à jour instantanément; de plus, vos choix sont stockés avec localStorage, donc quand vous quitterez la page et la rechargerez plus tard, vos choix auront été mémorisés.</p> -<p>Nous avons aussi fournit une <a class="external" href="https://mdn.github.io/dom-examples/web-storage/event.html">page pour l'événement émis</a> - Si vous chargez cette page dans un autre onglet, puis faite les changements de votre choix sur la page de démarrage, vous allez voir une information liée à l'événement {{domxref("StorageEvent")}} qui a été lancé.</p> +<p>Nous avons aussi fournit une <a href="https://mdn.github.io/dom-examples/web-storage/event.html">page pour l'événement émis</a> - Si vous chargez cette page dans un autre onglet, puis faite les changements de votre choix sur la page de démarrage, vous allez voir une information liée à l'événement {{domxref("StorageEvent")}} qui a été lancé.</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/9687/event-output.png" style="display: block; height: 482px; margin: 0px auto; width: 700px;"></p> +<p><img alt="" src="event-output.png"></p> <div class="note"> -<p><strong>Note</strong>: En plus de l'affichage en temps réel des pages en utilisant les liens ci-dessus, vous pouvez aussi <a class="external" href="https://github.com/mdn/dom-examples/tree/master/web-storage">regarder le code-source</a>.</p> +<p><strong>Note :</strong> En plus de l'affichage en temps réel des pages en utilisant les liens ci-dessus, vous pouvez aussi <a href="https://github.com/mdn/dom-examples/tree/master/web-storage">regarder le code-source</a>.</p> </div> <h2 id="Tester_si_le_stockage_a_déjà_été_rempli">Tester si le stockage a déjà été rempli</h2> -<p>Pour démarrer avec <a class="external" href="https://github.com/mdn/dom-examples/blob/master/web-storage/main.js">main.js</a>, nous allons tester que l'objet de stockage a bien été rempli (c-à-d, que l'on a déjà accédé à la page):</p> +<p>Pour démarrer avec <a href="https://github.com/mdn/dom-examples/blob/master/web-storage/main.js">main.js</a>, nous allons tester que l'objet de stockage a bien été rempli (c-à-d, que l'on a déjà accédé à la page):</p> <pre class="brush: js">if(!localStorage.getItem('bgcolor')) { populateStorage(); @@ -158,7 +158,7 @@ imageForm.onchange = populateStorage;</pre> <p>Les pages des autres domaines ne peuvent pas accéder aux mêmes objets de stockage.</p> -<p>Sur la page d'événement (voir <a class="external" href="https://github.com/mdn/web-storage-demo/blob/gh-pages/event.js">events.js</a>) le seul JavaScript est :</p> +<p>Sur la page d'événement (voir <a href="https://github.com/mdn/web-storage-demo/blob/gh-pages/event.js">events.js</a>) le seul JavaScript est :</p> <pre class="brush: js">window.addEventListener('storage', function(e) { document.querySelector('.my-key').textContent = e.key; @@ -206,10 +206,10 @@ imageForm.onchange = populateStorage;</pre> <p>{{Compat("api.Window.sessionStorage")}}</p> -<p>Tous les navigateurs ont des niveaux de capacité différents pour localStorage et sessionStorage. Voici un <a class="external" href="http://dev-test.nemikor.com/web-storage/support-test/" title="http://dev-test.nemikor.com/web-storage/support-test/">détail des capacités de stockage pour différents navigateurs</a>.</p> +<p>Tous les navigateurs ont des niveaux de capacité différents pour localStorage et sessionStorage. Voici un <a href="http://dev-test.nemikor.com/web-storage/support-test/">détail des capacités de stockage pour différents navigateurs</a>.</p> <div class="note"> -<p><strong>Note: </strong>depuis iOS 5.1, Safari Mobile stocke les données de localStorage dans le repertoire de cache, qui est parfois sujet à des nettoyages, à la demande de l'OS, typiquement quand l'espace restant est faible.</p> +<p><strong>Note :</strong> Depuis iOS 5.1, Safari Mobile stocke les données de localStorage dans le repertoire de cache, qui est parfois sujet à des nettoyages, à la demande de l'OS, typiquement quand l'espace restant est faible.</p> </div> <h2 id="Voir_aussi">Voir aussi</h2> |