diff options
author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:24 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
commit | 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch) | |
tree | 30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/serviceworkerglobalscope | |
parent | c05efa8d7ae464235cf83d7c0956e42dc6974103 (diff) | |
download | translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2 translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip |
convert content to md
Diffstat (limited to 'files/fr/web/api/serviceworkerglobalscope')
-rw-r--r-- | files/fr/web/api/serviceworkerglobalscope/index.md | 197 | ||||
-rw-r--r-- | files/fr/web/api/serviceworkerglobalscope/onnotificationclick/index.md | 55 |
2 files changed, 109 insertions, 143 deletions
diff --git a/files/fr/web/api/serviceworkerglobalscope/index.md b/files/fr/web/api/serviceworkerglobalscope/index.md index 49afb28427..c16273acd7 100644 --- a/files/fr/web/api/serviceworkerglobalscope/index.md +++ b/files/fr/web/api/serviceworkerglobalscope/index.md @@ -12,87 +12,80 @@ tags: - TopicStub translation_of: Web/API/ServiceWorkerGlobalScope --- -<div>{{APIRef("Service Workers API")}}</div> - -<p>The <strong><code>ServiceWorkerGlobalScope</code></strong> interface of the <a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a> represents the global execution context of a service worker.</p> - -<p>Developers should keep in mind that the ServiceWorker state is not persisted across the termination/restart cycle, so each event handler should assume it's being invoked with a bare, default global state.</p> - -<p>Once successfully registered, a service worker can and will be terminated when idle to conserve memory and processor power. An active service worker is automatically restarted to respond to events, such as {{domxref("ServiceWorkerGlobalScope.onfetch")}} or {{domxref("ServiceWorkerGlobalScope.onmessage")}}.</p> - -<p>Additionally, synchronous requests are not allowed from within a service worker — only asynchronous requests, like those initiated via the {{domxref("GlobalFetch.fetch", "fetch()")}} method, can be used.</p> - -<p>This interface inherits from the {{domxref("WorkerGlobalScope")}} interface, and its parent {{domxref("EventTarget")}}, and therefore implements properties from {{domxref("WindowTimers")}}, {{domxref("WindowBase64")}}, and {{domxref("WindowEventHandlers")}}.</p> - -<p>{{InheritanceDiagram(700, 85, 20)}}</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt>{{domxref("ServiceWorkerGlobalScope.caches")}} {{readonlyinline}}</dt> - <dd>Contains the {{domxref("CacheStorage")}} object associated with the service worker.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope.clients")}} {{readonlyinline}}</dt> - <dd>Contains the {{domxref("Clients")}} object associated with the service worker.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope.registration")}} {{readonlyinline}}</dt> - <dd>Contains the {{domxref("ServiceWorkerRegistration")}} object that represents the service worker's registration.</dd> -</dl> - -<h2 id="Events">Events</h2> - -<dl> - <dt>{{domxref("ServiceWorkerGlobalScope/activate_event", "activate")}}</dt> - <dd>Occurs when a {{domxref("ServiceWorkerRegistration")}} acquires a new {{domxref("ServiceWorkerRegistration.active")}} worker.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onactivate")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/contentdelete_event", "contentdelete")}}</dt> - <dd>Occurs when an item is removed from the {{domxref("ContentIndex", "Content Index")}}.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.oncontentdelete")}} property.</dd> - <dt><code>fetch</code></dt> - <dd>Occurs when a {{domxref("GlobalFetch.fetch", "fetch()")}} is called.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onfetch")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/install_event", "install")}}</dt> - <dd>Occurs when a {{domxref("ServiceWorkerRegistration")}} acquires a new {{domxref("ServiceWorkerRegistration.installing")}} worker.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.oninstall")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/message_event", "message")}}</dt> - <dd>Occurs when incoming messages are received. Controlled pages can use the {{domxref("MessagePort.postMessage()")}} method to send messages to service workers. The service worker can optionally send a response back via the {{domxref("MessagePort")}} exposed in <a href="https://html.spec.whatwg.org/multipage/comms.html#messageport"><code>event.data.port</code></a>, corresponding to the controlled page.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onmessage")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/notificationclick_event", "notificationclick")}}</dt> - <dd>Occurs when a user clicks on a displayed notification.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onnotificationclick")}} property.</dd> - <dt><code>notificationclose</code></dt> - <dd>Occurs — when a user closes a displayed notification.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onnotificationclose")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/push_event", "push")}}</dt> - <dd>Occurs when a server push notification is received.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onpush")}} property.</dd> - <dt>{{domxref("ServiceWorkerGlobalScope/pushsubscriptionchange_event", "pushsubscriptionchange")}}</dt> - <dd>Occurs when a push subscription has been invalidated, or is about to be invalidated (e.g. when a push service sets an expiration time).<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}} property.</dd> - <dt><code>sync</code></dt> - <dd>Triggered when a call to {{domxref("SyncManager.register")}} is made from a service worker client page. The attempt to sync is made either immediately if the network is available or as soon as the network becomes available.<br> - Also available via the {{domxref("ServiceWorkerGlobalScope.onsync")}} property.</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt>{{domxref("ServiceWorkerGlobalScope.skipWaiting()")}}</dt> - <dd>Allows the current service worker registration to progress from waiting to active state while service worker clients are using it.</dd> -</dl> - -<p><code>ServiceWorkerGlobalScope</code> implements {{domxref("WorkerGlobalScope")}} — which implements {{domxref("WindowOrWorkerGlobalScope")}}. Therefore it also has the following property available to it:</p> - -<dl> - <dt>{{domxref("GlobalFetch.fetch()")}}</dt> - <dd>Starts the process of fetching a resource. This returns a promise that resolves to the {{domxref("Response")}} object representing the response to your request. This algorithm is the entry point for the fetch handling handed to the service worker context.</dd> -</dl> - -<h2 id="Examples">Examples</h2> - -<p>This code snippet is from the <a href="https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/prefetch/service-worker.js">service worker prefetch sample</a> (see <a href="https://googlechrome.github.io/samples/service-worker/prefetch/">prefetch example live</a>.) The {{domxref("ServiceWorkerGlobalScope.onfetch")}} event handler listens for the <code>fetch</code> event. When fired, the code returns a promise that resolves to the first matching request in the {{domxref("Cache")}} object. If no match is found, the code fetches a response from the network.</p> - -<p>The code also handles exceptions thrown from the {{domxref("GlobalFetch.fetch", "fetch()")}} operation. Note that an HTTP error response (e.g., 404) will not trigger an exception. It will return a normal response object that has the appropriate error code set.</p> - -<pre class="brush: js">self.addEventListener('fetch', function(event) { +{{APIRef("Service Workers API")}} + +The **`ServiceWorkerGlobalScope`** interface of the [Service Worker API](/en-US/docs/Web/API/Service_Worker_API) represents the global execution context of a service worker. + +Developers should keep in mind that the ServiceWorker state is not persisted across the termination/restart cycle, so each event handler should assume it's being invoked with a bare, default global state. + +Once successfully registered, a service worker can and will be terminated when idle to conserve memory and processor power. An active service worker is automatically restarted to respond to events, such as {{domxref("ServiceWorkerGlobalScope.onfetch")}} or {{domxref("ServiceWorkerGlobalScope.onmessage")}}. + +Additionally, synchronous requests are not allowed from within a service worker — only asynchronous requests, like those initiated via the {{domxref("GlobalFetch.fetch", "fetch()")}} method, can be used. + +This interface inherits from the {{domxref("WorkerGlobalScope")}} interface, and its parent {{domxref("EventTarget")}}, and therefore implements properties from {{domxref("WindowTimers")}}, {{domxref("WindowBase64")}}, and {{domxref("WindowEventHandlers")}}. + +{{InheritanceDiagram(700, 85, 20)}} + +## Properties + +- {{domxref("ServiceWorkerGlobalScope.caches")}} {{readonlyinline}} + - : Contains the {{domxref("CacheStorage")}} object associated with the service worker. +- {{domxref("ServiceWorkerGlobalScope.clients")}} {{readonlyinline}} + - : Contains the {{domxref("Clients")}} object associated with the service worker. +- {{domxref("ServiceWorkerGlobalScope.registration")}} {{readonlyinline}} + - : Contains the {{domxref("ServiceWorkerRegistration")}} object that represents the service worker's registration. + +## Events + +- {{domxref("ServiceWorkerGlobalScope/activate_event", "activate")}} + - : Occurs when a {{domxref("ServiceWorkerRegistration")}} acquires a new {{domxref("ServiceWorkerRegistration.active")}} worker. + Also available via the {{domxref("ServiceWorkerGlobalScope.onactivate")}} property. +- {{domxref("ServiceWorkerGlobalScope/contentdelete_event", "contentdelete")}} + - : Occurs when an item is removed from the {{domxref("ContentIndex", "Content Index")}}. + Also available via the {{domxref("ServiceWorkerGlobalScope.oncontentdelete")}} property. +- `fetch` + - : Occurs when a {{domxref("GlobalFetch.fetch", "fetch()")}} is called. + Also available via the {{domxref("ServiceWorkerGlobalScope.onfetch")}} property. +- {{domxref("ServiceWorkerGlobalScope/install_event", "install")}} + - : Occurs when a {{domxref("ServiceWorkerRegistration")}} acquires a new {{domxref("ServiceWorkerRegistration.installing")}} worker. + Also available via the {{domxref("ServiceWorkerGlobalScope.oninstall")}} property. +- {{domxref("ServiceWorkerGlobalScope/message_event", "message")}} + - : Occurs when incoming messages are received. Controlled pages can use the {{domxref("MessagePort.postMessage()")}} method to send messages to service workers. The service worker can optionally send a response back via the {{domxref("MessagePort")}} exposed in [`event.data.port`](https://html.spec.whatwg.org/multipage/comms.html#messageport), corresponding to the controlled page. + Also available via the {{domxref("ServiceWorkerGlobalScope.onmessage")}} property. +- {{domxref("ServiceWorkerGlobalScope/notificationclick_event", "notificationclick")}} + - : Occurs when a user clicks on a displayed notification. + Also available via the {{domxref("ServiceWorkerGlobalScope.onnotificationclick")}} property. +- `notificationclose` + - : Occurs — when a user closes a displayed notification. + Also available via the {{domxref("ServiceWorkerGlobalScope.onnotificationclose")}} property. +- {{domxref("ServiceWorkerGlobalScope/push_event", "push")}} + - : Occurs when a server push notification is received. + Also available via the {{domxref("ServiceWorkerGlobalScope.onpush")}} property. +- {{domxref("ServiceWorkerGlobalScope/pushsubscriptionchange_event", "pushsubscriptionchange")}} + - : Occurs when a push subscription has been invalidated, or is about to be invalidated (e.g. when a push service sets an expiration time). + Also available via the {{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}} property. +- `sync` + - : Triggered when a call to {{domxref("SyncManager.register")}} is made from a service worker client page. The attempt to sync is made either immediately if the network is available or as soon as the network becomes available. + Also available via the {{domxref("ServiceWorkerGlobalScope.onsync")}} property. + +## Methods + +- {{domxref("ServiceWorkerGlobalScope.skipWaiting()")}} + - : Allows the current service worker registration to progress from waiting to active state while service worker clients are using it. + +`ServiceWorkerGlobalScope` implements {{domxref("WorkerGlobalScope")}} — which implements {{domxref("WindowOrWorkerGlobalScope")}}. Therefore it also has the following property available to it: + +- {{domxref("GlobalFetch.fetch()")}} + - : Starts the process of fetching a resource. This returns a promise that resolves to the {{domxref("Response")}} object representing the response to your request. This algorithm is the entry point for the fetch handling handed to the service worker context. + +## Examples + +This code snippet is from the [service worker prefetch sample](https://github.com/GoogleChrome/samples/blob/gh-pages/service-worker/prefetch/service-worker.js) (see [prefetch example live](https://googlechrome.github.io/samples/service-worker/prefetch/).) The {{domxref("ServiceWorkerGlobalScope.onfetch")}} event handler listens for the `fetch` event. When fired, the code returns a promise that resolves to the first matching request in the {{domxref("Cache")}} object. If no match is found, the code fetches a response from the network. + +The code also handles exceptions thrown from the {{domxref("GlobalFetch.fetch", "fetch()")}} operation. Note that an HTTP error response (e.g., 404) will not trigger an exception. It will return a normal response object that has the appropriate error code set. + +```js +self.addEventListener('fetch', function(event) { console.log('Handling fetch event for', event.request.url); event.respondWith( @@ -115,38 +108,22 @@ translation_of: Web/API/ServiceWorkerGlobalScope }); }) ); -});</pre> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('Service Workers', '#serviceworkerglobalscope-interface', 'ServiceWorkerGlobalScope')}}</td> - <td>{{Spec2('Service Workers')}}</td> - <td>Initial definition</td> - </tr> - </tbody> -</table> +}); +``` -<h2 id="Browser_compatibility">Browser compatibility</h2> +## Specifications +| Specification | Status | Comment | +| ------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------ | ------------------ | +| {{SpecName('Service Workers', '#serviceworkerglobalscope-interface', 'ServiceWorkerGlobalScope')}} | {{Spec2('Service Workers')}} | Initial definition | +## Browser compatibility -<p>{{Compat("api.ServiceWorkerGlobalScope")}}</p> +{{Compat("api.ServiceWorkerGlobalScope")}} -<h2 id="See_also">See also</h2> +## See also -<ul> - <li><a href="/en-US/docs/Web/API/ServiceWorker_API/Using_Service_Workers">Using Service Workers</a></li> - <li><a href="https://github.com/mdn/sw-test">Service workers basic code example</a></li> - <li><a href="https://jakearchibald.github.io/isserviceworkerready/">Is ServiceWorker ready?</a></li> - <li>{{jsxref("Promise")}}</li> -</ul> +- [Using Service Workers](/en-US/docs/Web/API/ServiceWorker_API/Using_Service_Workers) +- [Service workers basic code example](https://github.com/mdn/sw-test) +- [Is ServiceWorker ready?](https://jakearchibald.github.io/isserviceworkerready/) +- {{jsxref("Promise")}} diff --git a/files/fr/web/api/serviceworkerglobalscope/onnotificationclick/index.md b/files/fr/web/api/serviceworkerglobalscope/onnotificationclick/index.md index a3dedb93af..c5e9dbe111 100644 --- a/files/fr/web/api/serviceworkerglobalscope/onnotificationclick/index.md +++ b/files/fr/web/api/serviceworkerglobalscope/onnotificationclick/index.md @@ -11,25 +11,25 @@ tags: - onnotificationclick translation_of: Web/API/ServiceWorkerGlobalScope/onnotificationclick --- -<p>{{APIRef("Service Workers API")}}</p> +{{APIRef("Service Workers API")}} -<p>La propriété <strong><code>ServiceWorkerGlobalScope.onnotificationclick</code></strong> est un gestionnaire d'événements appelé chaque fois que l'événement {{Event("notificationclick")}} est envoyé sur l'objet {{domxref ("ServiceWorkerGlobalScope")}}, c'est-à-dire lorsqu'un utilisateur clique sur une notification affichée générée par {{domxref("ServiceWorkerRegistration.showNotification()")}}.</p> +La propriété **`ServiceWorkerGlobalScope.onnotificationclick`** est un gestionnaire d'événements appelé chaque fois que l'événement {{Event("notificationclick")}} est envoyé sur l'objet {{domxref ("ServiceWorkerGlobalScope")}}, c'est-à-dire lorsqu'un utilisateur clique sur une notification affichée générée par {{domxref("ServiceWorkerRegistration.showNotification()")}}. -<p>Les notifications créées sur le thread principal ou dans un worker qui ne sont pas des service worker utilisant le constructeur {{domxref ("Notification.Notification", "Notification()")}} recevront à la place un événement {{Event("click")}} sur l'objet <code>Notification</code> lui-même.</p> +Les notifications créées sur le thread principal ou dans un worker qui ne sont pas des service worker utilisant le constructeur {{domxref ("Notification.Notification", "Notification()")}} recevront à la place un événement {{Event("click")}} sur l'objet `Notification` lui-même. -<div class="note"> -<p><strong>Note :</strong> Essayer de créer une notification dans le {{domxref ("ServiceWorkerGlobalScope")}} en utilisant le constructeur {{domxref ("Notification.Notification", "Notification()")}} générera une erreur.</p> -</div> +> **Note :** Essayer de créer une notification dans le {{domxref ("ServiceWorkerGlobalScope")}} en utilisant le constructeur {{domxref ("Notification.Notification", "Notification()")}} générera une erreur. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="brush: js">ServiceWorkerGlobalScope.onnotificationclick = function(NotificationEvent) { ... } -ServiceWorkerGlobalScope.onnotificationclick = (NotificationEvent) => { ... } -</pre> +```js +ServiceWorkerGlobalScope.onnotificationclick = function(NotificationEvent) { ... } +ServiceWorkerGlobalScope.onnotificationclick = (NotificationEvent) => { ... } +``` -<h2 id="Exemple">Exemple</h2> +## Exemple -<pre class="brush: js">self.onnotificationclick = (event) => { +```js +self.onnotificationclick = (event) => { console.log('On notification click: ', event.notification.tag) event.notification.close() @@ -40,34 +40,23 @@ ServiceWorkerGlobalScope.onnotificationclick = (NotificationEvent) => { ... } .matchAll({ type: 'window' }) - .then((clientList) => { - for (let i = 0; i < clientList.length; i++) { + .then((clientList) => { + for (let i = 0; i < clientList.length; i++) { const client = clientList[i] - if (client.url == '/' && 'focus' in client) return client.focus() + if (client.url == '/' && 'focus' in client) return client.focus() } if (clients.openWindow) return clients.openWindow('/') }) ) } -</pre> +``` -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">État</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('Web Notifications','#dom-serviceworkerglobalscope-onnotificationclick','onnotificationclick')}}</td> - <td>{{Spec2('Web Notifications')}}</td> - <td>Définition initiale. Cette propriété est spécifiée dans {{domxref ('Notifications_API')}} même si elle fait partie de {{domxref ('ServiceWorkerGlobalScope')}}.</td> - </tr> - </tbody> -</table> +| Spécification | État | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| {{SpecName('Web Notifications','#dom-serviceworkerglobalscope-onnotificationclick','onnotificationclick')}} | {{Spec2('Web Notifications')}} | Définition initiale. Cette propriété est spécifiée dans {{domxref ('Notifications_API')}} même si elle fait partie de {{domxref ('ServiceWorkerGlobalScope')}}. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.ServiceWorkerGlobalScope.onnotificationclick")}}</p> +{{Compat("api.ServiceWorkerGlobalScope.onnotificationclick")}} |