{"id":83389,"date":"2022-08-23T08:12:40","date_gmt":"2022-08-23T06:12:40","guid":{"rendered":"https:\/\/rmarketingdigital.com\/dev\/activadores-de-notificacion\/"},"modified":"2020-09-16T21:52:52","modified_gmt":"2020-09-17T00:52:52","slug":"activadores-de-notificacion","status":"publish","type":"post","link":"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/","title":{"rendered":"Notification triggers"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_86 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">Contents<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewbox=\"0 0 24 24\" version=\"1.2\" baseprofile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#%C2%BFQue-son-los-activadores-de-notificaciones\" >What are notification triggers?<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Casos-de-uso\" >Use cases<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Estado-actual\" >Actual state<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Como-utilizar-los-activadores-de-notificaciones\" >How to use notification triggers<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Habilitacion-a-traves-de-chrome-flags\" >Enabling via chrome: \/\/ flags<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Deteccion-de-caracteristicas\" >Feature detection<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Programar-una-notificacion\" >Schedule a notification<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Cancelar-una-notificacion-programada\" >Cancel a scheduled notification<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Depuracion\" >Depuration<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Manifestacion\" >Manifestation<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Seguridad-y-permisos\" >Security and permissions<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Control-de-usuario\" >User control<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-13\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Transparencia\" >Transparency<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-14\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Realimentacion\" >Feedback<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-15\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Cuentanos-sobre-el-diseno-de-la-API\" >Tell us about the API design<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-16\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#%C2%BFProblema-con-la-implementacion\" >Problem with the implementation?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-17\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#%C2%BFPlanea-utilizar-la-API\" >Planning to use the API?<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-18\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Enlaces-Utiles\" >Helpful Links<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-19\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/activadores-de-notificacion\/#Agradecimientos\" >Thanks<\/a><\/li><\/ul><\/nav><\/div>\n<p><\/p>\n<div>\n<header class=\"w-article-header\">\n<p class=\"w-article-header__subhead w-mb--non\">\n<p>          Notification triggers allow you to schedule local notifications that don&#039;t require a network connection, making them ideal for use cases like calendar apps.\n        <\/p>\n<p>\n          <time>Oct 24, 2019<\/time><br \/>\n            Updated <time>23 Aug 2020<\/time>\n        <\/p>\n<\/header>\n<div class=\"w-aside w-aside--note\">\n<p>The development of the Notification Triggers API, part of Google<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/updates\/capabilities\">capabilities project<\/a>, is currently on hold. This post will be updated as implementation progresses.<\/p>\n<\/div>\n<h2 id=\"what\"><span class=\"ez-toc-section\" id=\"%C2%BFQue-son-los-activadores-de-notificaciones\"><\/span>What are notification triggers? <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Web developers can display notifications using the<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/www.w3.org\/TR\/notifications\/\">Web Notifications API<\/a>. This function is often used with <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/w3c.github.io\/push-api\/\">API push<\/a> to inform the user of urgent information, such as breaking news or received messages. Notifications are displayed by running JavaScript on the user&#039;s device.<\/p>\n<p>The problem with the Push API is that it is not reliable to trigger notifications that <em>has to<\/em> will be displayed when a particular condition is met, such as time or location. An example of <em>time-based condition<\/em> is a calendar notification that reminds you of an important meeting with your boss at 2 pm An example of <em>location-based condition<\/em> it is a notification that reminds you to buy milk when you enter the vicinity of your supermarket. Network connectivity or battery-conserving features, such as sleep mode, can delay the delivery of push notifications.<\/p>\n<p>Notification triggers solve this problem by allowing you to schedule notifications with their activation condition in advance, so that the operating system delivers the notification at the right time even if there is no network connectivity or the device is in battery saving mode.<\/p>\n<div class=\"w-aside w-aside--note\">\n<p>For now, Chrome only supports <em>time-based triggers<\/em>. Additional triggers, such as location-based triggers, may be added in the future, depending on developer demand.<\/p>\n<\/div>\n<h3 id=\"use-cases\"><span class=\"ez-toc-section\" id=\"Casos-de-uso\"><\/span>Use cases <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Calendar applications can use time-based notification triggers to remind the user of upcoming meetings. The default notification scheme for a calendar app might be to show a first notification one hour before a meeting and then another more urgent notification five minutes before.<\/p>\n<p>A television station may remind users that their favorite television program is about to begin or that a live broadcast of a conference is about to begin.<\/p>\n<p>Time zone conversion sites can use time-based notification triggers to allow their users to schedule alarms for conference calls or video calls.<\/p>\n<h2 id=\"status\"><span class=\"ez-toc-section\" id=\"Estado-actual\"><\/span>Actual state <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<div class=\"w-table-wrapper\">\n<table>\n<thead>\n<tr>\n<th>He passed<\/th>\n<th>Condition<\/th>\n<\/tr>\n<\/thead>\n<tbody>\n<tr>\n<td>1. Create an explainer<\/td>\n<td><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/beverloo\/notification-triggers\/blob\/master\/README.md\">To complete<\/a><\/td>\n<\/tr>\n<tr>\n<td>2. Create initial draft specification<\/td>\n<td>Not started<\/td>\n<\/tr>\n<tr>\n<td><strong>3. Collect feedback and repeat the design<\/strong><\/td>\n<td><strong>In progress<\/strong><\/td>\n<\/tr>\n<tr>\n<td>4. Proof of origin<\/td>\n<td><a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.chrome.com\/origintrials\/#\/view_trial\/6883752030435803137\">To complete<\/a><\/td>\n<\/tr>\n<tr>\n<td>5. Launch<\/td>\n<td>Not started<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div class=\"w-aside w-aside--note\">\n<p>A proof of origin for the feature, which gave developers the opportunity to test the proposed API, ran from Chrome 80 to 83 and ended on July 29, 2020. Unfortunately, we did not receive many registrations and the feedback we received was not strong. For now, we have decided to put the API on hold until further notice and not extend the proof of origin. The feature will continue to be available behind the experimental web platform feature mark for developers to experiment with the API. Given future developer interest or new use cases, we will reconsider the API and resume efforts to standardize it.<\/p>\n<\/div>\n<h2 id=\"use\"><span class=\"ez-toc-section\" id=\"Como-utilizar-los-activadores-de-notificaciones\"><\/span>How to use notification triggers <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h3 id=\"enabling-via-chrome:flags\"><span class=\"ez-toc-section\" id=\"Habilitacion-a-traves-de-chrome-flags\"><\/span>Enabling via chrome: \/\/ flags <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To experiment with the Claims Triggers API locally, without a source test token, enable the<br \/>\n<code>#enable-experimental-web-platform-features<\/code> flag on <code>chrome:\/\/flags<\/code>.<\/p>\n<h3 id=\"feature-detection\"><span class=\"ez-toc-section\" id=\"Deteccion-de-caracteristicas\"><\/span>Feature detection <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>You can find out if the browser supports notification triggers by checking for the existence of the<br \/>\n<code>showTrigger<\/code> property:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"token keyword\">if<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token string\">\"showTrigger\"<\/span> <span class=\"token keyword\">in<\/span> <span class=\"token class-name\">Notification<\/span><span class=\"token punctuation\">.<\/span>prototype<span class=\"token punctuation\">)<\/span> <span class=\"token punctuation\">{<\/span><br><span class=\"token punctuation\">}<\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"scheduling-a-notification\"><span class=\"ez-toc-section\" id=\"Programar-una-notificacion\"><\/span>Schedule a notification <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Scheduling a notification is similar to displaying a regular push notification, except that you must pass a <code>showTrigger<\/code> property condition with a <code>TimestampTrigger<\/code> object as the claim value <code>options<\/code> object.<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"highlight-line\"><span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">createScheduledNotification<\/span> <span class=\"token operator\">=<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">tag<span class=\"token punctuation\">,<\/span> title<span class=\"token punctuation\">,<\/span> timestamp<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><\/span><br><span class=\"highlight-line\">  <span class=\"token keyword\">const<\/span> registration <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>serviceWorker<span class=\"token punctuation\">.<\/span><span class=\"token function\">getRegistration<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/span><br><span class=\"highlight-line\">  registration<span class=\"token punctuation\">.<\/span><span class=\"token function\">showNotification<\/span><span class=\"token punctuation\">(<\/span>title<span class=\"token punctuation\">,<\/span> <span class=\"token punctuation\">{<\/span><\/span><br><span class=\"highlight-line\">    tag<span class=\"token operator\">:<\/span> tag<span class=\"token punctuation\">,<\/span><\/span><br><span class=\"highlight-line\">    body<span class=\"token operator\">:<\/span> <span class=\"token string\">\"This notification was scheduled 30 seconds ago\"<\/span><span class=\"token punctuation\">,<\/span><\/span><br><mark class=\"highlight-line highlight-line-active\">    showTrigger<span class=\"token operator\">:<\/span> <span class=\"token keyword\">new<\/span> <span class=\"token class-name\">TimestampTrigger<\/span><span class=\"token punctuation\">(<\/span>timestamp <span class=\"token operator\">+<\/span> <span class=\"token number\">30<\/span> <span class=\"token operator\">*<\/span> <span class=\"token number\">1000<\/span><span class=\"token punctuation\">)<\/span><\/mark><br><span class=\"highlight-line\">  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/span><br><span class=\"highlight-line\"><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<div class=\"w-aside w-aside--note\">\n<p>On desktop, the notification is triggered only if Chrome is running. On Android, they fire independently.<\/p>\n<\/div>\n<h3 id=\"canceling-a-scheduled-notification\"><span class=\"ez-toc-section\" id=\"Cancelar-una-notificacion-programada\"><\/span>Cancel a scheduled notification <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>To cancel scheduled notifications, first request a list of all notifications that match a certain tag via <code>ServiceWorkerRegistration.getNotifications ()<\/code>. Please note that you must pass the<br \/>\n<code>includeTriggered<\/code> Check for scheduled notifications to be listed:<\/p>\n<p><web-copy-code><\/p>\n<pre class=\"language-js\"><code class=\"language-js\"><span class=\"highlight-line\"><span class=\"token keyword\">const<\/span> <span class=\"token function-variable function\">cancelScheduledNotification<\/span> <span class=\"token operator\">=<\/span> <span class=\"token keyword\">async<\/span> <span class=\"token punctuation\">(<\/span><span class=\"token parameter\">tag<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> <span class=\"token punctuation\">{<\/span><\/span><br><span class=\"highlight-line\">  <span class=\"token keyword\">const<\/span> registration <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> navigator<span class=\"token punctuation\">.<\/span>serviceWorker<span class=\"token punctuation\">.<\/span><span class=\"token function\">getRegistration<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/span><br><span class=\"highlight-line\">  <span class=\"token keyword\">const<\/span> notifications <span class=\"token operator\">=<\/span> <span class=\"token keyword\">await<\/span> registration<span class=\"token punctuation\">.<\/span><span class=\"token function\">getNotifications<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">{<\/span><\/span><br><span class=\"highlight-line\">    tag<span class=\"token operator\">:<\/span> tag<span class=\"token punctuation\">,<\/span><\/span><br><mark class=\"highlight-line highlight-line-active\">    includeTriggered<span class=\"token operator\">:<\/span> <span class=\"token boolean\">true<\/span><span class=\"token punctuation\">,<\/span><\/mark><br><span class=\"highlight-line\">  <span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/span><br><span class=\"highlight-line\">  notifications<span class=\"token punctuation\">.<\/span><span class=\"token function\">forEach<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">(<\/span><span class=\"token parameter\">notification<\/span><span class=\"token punctuation\">)<\/span> <span class=\"token operator\">=&gt;<\/span> notification<span class=\"token punctuation\">.<\/span><span class=\"token function\">close<\/span><span class=\"token punctuation\">(<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">)<\/span><span class=\"token punctuation\">;<\/span><\/span><br><span class=\"highlight-line\"><span class=\"token punctuation\">}<\/span><span class=\"token punctuation\">;<\/span><\/span><\/code><\/pre>\n<p><\/web-copy-code><\/p>\n<h3 id=\"debugging\"><span class=\"ez-toc-section\" id=\"Depuracion\"><\/span>Depuration <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>You can use the <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developers.google.com\/web\/updates\/2019\/07\/devtools#backgroundservices\">Chrome DevTools notification panel<\/a> to debug notifications. To start debugging, press <strong>Start event recording<\/strong> <img alt='record-8885793' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/record-8885793.png'> or<br \/>\n<kbd>Control<\/kbd>+<kbd>me<\/kbd> (<kbd>Command<\/kbd>+<kbd>me<\/kbd> on Mac). Chrome DevTools logs all notification events, including scheduled, displayed, and closed notifications, for three days, even when DevTools is closed.<\/p>\n<figure class=\"w-figure w-figure--fullbleed\">\n  <img alt='devtools-scheduled-4433090' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/devtools-scheduled-4433090.png'><figcaption class=\"w-figcaption w-figcaption--fullbleed\">\n<p>    A scheduled notification.<br \/>\n  <\/figcaption><\/figure>\n<figure class=\"w-figure w-figure--fullbleed\">\n  <img alt='devtools-displayed-6666399' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/devtools-displayed-6666399.png'><figcaption class=\"w-figcaption w-figcaption--fullbleed\">\n<p>    A notification displayed.<br \/>\n  <\/figcaption><\/figure>\n<h3 id=\"demo\"><span class=\"ez-toc-section\" id=\"Manifestacion\"><\/span>Manifestation <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>You can see the notification triggers in action in the <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/notification-triggers.glitch.me\/\">manifestation<\/a>, which allows you to schedule notifications, list scheduled notifications, and cancel them. The source code is available at<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/glitch.com\/edit\/#!\/notification-triggers\">Failure<\/a>.<\/p>\n<figure class=\"w-figure w-figure--fullbleed\">\n  <img alt='demo-9370521' src='https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/demo-9370521.png'><figcaption class=\"w-figcaption w-figcaption--fullbleed\">\n<p>    Notification triggers <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/notification-triggers.glitch.me\/\">manifestation<\/a>.<br \/>\n  <\/figcaption><\/figure>\n<h2 id=\"security-and-permissions\"><span class=\"ez-toc-section\" id=\"Seguridad-y-permisos\"><\/span>Security and permissions <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>The Chrome team has designed and implemented the Notification Triggers API using the basic principles defined in <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/chromium.googlesource.com\/chromium\/src\/+\/lkgr\/docs\/security\/permissions-for-powerful-web-platform-features.md\">Control access to powerful features of the web platform<\/a>, including user control, transparency and ergonomics. Because this API requires service workers, it also requires a secure context. Using the API requires the same permission as regular push notifications.<\/p>\n<h3 id=\"user-control\"><span class=\"ez-toc-section\" id=\"Control-de-usuario\"><\/span>User control <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>This API is only available in the context of a <code>ServiceWorkerRegistration<\/code>. This implies that all required data is stored in the same context and is automatically removed when the worker is removed from the service or when the user removes all data from the site for the source. Blocking cookies also prevents service workers from being installed on Chrome and thus this API from being used. The user can always disable notifications for the site in the site settings.<\/p>\n<h3 id=\"transparency\"><span class=\"ez-toc-section\" id=\"Transparencia\"><\/span>Transparency <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Unlike the Push API, this API is not network dependent, which means that scheduled notifications need all the necessary data beforehand, including the image resources referenced by the <code>badge<\/code>,<br \/>\n<code>icon<\/code> and <code>image<\/code> attributes. This means that displaying a scheduled notification is not observable by the developer and does not involve waking up the service worker until the user interacts with the notification. Consequently, there is currently no known way that the developer can obtain information about the user through potentially invasive approaches to privacy such as IP address geolocation lookup. This design also allows the feature to optionally take advantage of the scheduling mechanisms provided by the operating system, such as Android.<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/developer.android.com\/reference\/android\/app\/AlarmManager\"><code>AlarmManager<\/code><\/a>, which helps conserve battery life.<\/p>\n<h2 id=\"feedback\"><span class=\"ez-toc-section\" id=\"Realimentacion\"><\/span>Feedback <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>The Chrome team wants to hear about your experiences with notification triggers.<\/p>\n<h3 id=\"tell-us-about-the-api-design\"><span class=\"ez-toc-section\" id=\"Cuentanos-sobre-el-diseno-de-la-API\"><\/span>Tell us about the API design <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Is there something in the API that is not working as you expected? Or are you missing any methods or properties you need to implement your idea? Have a question or comment about the security model? File a spec issue on the <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/github.com\/beverloo\/notification-triggers\/issues\">Notification Triggers GitHub repository<\/a>or add your thoughts to an existing problem.<\/p>\n<h3 id=\"problem-with-the-implementation\"><span class=\"ez-toc-section\" id=\"%C2%BFProblema-con-la-implementacion\"><\/span>Problem with the implementation? <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Found a bug with the Chrome implementation? Or is the implementation different from the specification? File a bug in <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/new.crbug.com\/\">new.crbug.com<\/a>. Be sure to include as much detail as you can, simple instructions for reproducing and configuring Components <code>UI&gt; Notifications<\/code>. Glitch works great for sharing bug replays quickly and easily.<\/p>\n<h3 id=\"planning-to-use-the-api\"><span class=\"ez-toc-section\" id=\"%C2%BFPlanea-utilizar-la-API\"><\/span>Planning to use the API? <span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>Planning to use notification triggers on your site? Your public support helps us prioritize features and shows other browser vendors how important it is to support them. Send a tweet to<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/chromiumdev\">@Cromodev<\/a> with <code>#notificationtriggers<\/code> and let us know where and how you are using it.<\/p>\n<h2 id=\"helpful\"><span class=\"ez-toc-section\" id=\"Enlaces-Utiles\"><\/span>Helpful Links <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<h2 id=\"acknowledgements\"><span class=\"ez-toc-section\" id=\"Agradecimientos\"><\/span>Thanks <span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>Notification Triggers was implemented by <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/uk.linkedin.com\/in\/richardknoll\">Richard Knoll<\/a><br \/>\nand the explainer written by <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/beverloo?lang=en\">Peter beverloo<\/a>, with contributions from Richard. The following people have reviewed the article:<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/medleyjp\">Joe medley<\/a>, <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/twitter.com\/petele\">Pete LePage<\/a>as well as Richard and Peter. <a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/unsplash.com\/photos\/UAvYasdkzq8\">Hero image<\/a> for<br \/>\n<a rel=\"nofollow noopener noreferrer\" target=\"_blank\" href=\"https:\/\/unsplash.com\/@goumbik\">Lukas blazek<\/a> on Unsplash.<\/p>\n<p>    <web-feedback additional-questions=\"api\"><\/web-feedback>\n  <\/div>\n<p><script async src=\"\/\/platform.twitter.com\/widgets.js\" charset=\"utf-8\"><\/script><\/p>","protected":false},"excerpt":{"rendered":"<p>Los activadores de notificaciones le permiten programar notificaciones locales que no requieren una conexi\u00f3n de red, lo que las hace ideales para casos de uso como aplicaciones de calendario. 24&#8230;<\/p>","protected":false},"author":1,"featured_media":83390,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1356],"tags":[1434,1418],"class_list":["post-83389","post","type-post","status-publish","format-standard","has-post-thumbnail","category-dev","tag-chrome","tag-mac"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.0 (Yoast SEO v28.2) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Activadores de notificaci\u00f3n - R Marketing Digital<\/title>\n<meta name=\"description\" content=\"Los activadores de notificaciones le permiten programar notificaciones locales que no requieren una conexi\u00f3n de red, lo que las hace ideales para casos de\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/rmarketingdigital.com\/en\/dev\/benachrichtigungs-trigger\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Activadores de notificaci\u00f3n\" \/>\n<meta property=\"og:description\" content=\"Los activadores de notificaciones le permiten programar notificaciones locales que no requieren una conexi\u00f3n de red, lo que las hace ideales para casos de\" \/>\n<meta property=\"og:url\" content=\"https:\/\/rmarketingdigital.com\/en\/dev\/benachrichtigungs-trigger\/\" \/>\n<meta property=\"og:site_name\" content=\"R Marketing Digital\" \/>\n<meta property=\"article:published_time\" content=\"2022-08-23T06:12:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"360\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"R Marketing Digital\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/\"},\"author\":{\"name\":\"R Marketing Digital\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"headline\":\"Activadores de notificaci\u00f3n\",\"datePublished\":\"2022-08-23T06:12:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/\"},\"wordCount\":1418,\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-2373349.jpg\",\"keywords\":[\"Chrome\",\"Mac\"],\"articleSection\":[\"Dev\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/\",\"name\":\"Activadores de notificaci\u00f3n - R Marketing Digital\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-2373349.jpg\",\"datePublished\":\"2022-08-23T06:12:40+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\"},\"description\":\"Los activadores de notificaciones le permiten programar notificaciones locales que no requieren una conexi\u00f3n de red, lo que las hace ideales para casos de\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/de\\\/dev\\\/benachrichtigungs-trigger\\\/#primaryimage\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-2373349.jpg\",\"contentUrl\":\"https:\\\/\\\/rmarketingdigital.com\\\/wp-content\\\/uploads\\\/2020\\\/09\\\/hero-2373349.jpg\",\"width\":1200,\"height\":360,\"caption\":\"hero-2373349-4192217-jpg\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#website\",\"url\":\"https:\\\/\\\/rmarketingdigital.com\\\/\",\"name\":\"R Marketing Digital\",\"description\":\"Agencia SEO | Publicidad redes sociales | Community Management\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/rmarketingdigital.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/rmarketingdigital.com\\\/#\\\/schema\\\/person\\\/7c0d9782b2977b840b3740f00c69a73e\",\"name\":\"R Marketing Digital\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g\",\"caption\":\"R Marketing Digital\"}}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Activadores de notificaci\u00f3n - R Marketing Digital","description":"Notification triggers allow you to schedule local notifications that do not require a network connection, making them ideal for cases of","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/rmarketingdigital.com\/en\/dev\/benachrichtigungs-trigger\/","og_locale":"en_US","og_type":"article","og_title":"Activadores de notificaci\u00f3n","og_description":"Los activadores de notificaciones le permiten programar notificaciones locales que no requieren una conexi\u00f3n de red, lo que las hace ideales para casos de","og_url":"https:\/\/rmarketingdigital.com\/en\/dev\/benachrichtigungs-trigger\/","og_site_name":"R Marketing Digital","article_published_time":"2022-08-23T06:12:40+00:00","og_image":[{"width":1200,"height":360,"url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg","type":"image\/jpeg"}],"author":"R Marketing Digital","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/#article","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/"},"author":{"name":"R Marketing Digital","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"headline":"Activadores de notificaci\u00f3n","datePublished":"2022-08-23T06:12:40+00:00","mainEntityOfPage":{"@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/"},"wordCount":1418,"image":{"@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg","keywords":["Chrome","Mac"],"articleSection":["Dev"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/","url":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/","name":"Activadores de notificaci\u00f3n - R Marketing Digital","isPartOf":{"@id":"https:\/\/rmarketingdigital.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/#primaryimage"},"image":{"@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/#primaryimage"},"thumbnailUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg","datePublished":"2022-08-23T06:12:40+00:00","author":{"@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e"},"description":"Notification triggers allow you to schedule local notifications that do not require a network connection, making them ideal for cases of","inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/rmarketingdigital.com\/de\/dev\/benachrichtigungs-trigger\/#primaryimage","url":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg","contentUrl":"https:\/\/rmarketingdigital.com\/wp-content\/uploads\/2020\/09\/hero-2373349.jpg","width":1200,"height":360,"caption":"hero-2373349-4192217-jpg"},{"@type":"WebSite","@id":"https:\/\/rmarketingdigital.com\/#website","url":"https:\/\/rmarketingdigital.com\/","name":"R Digital Marketing","description":"SEO Agency | Advertising social networks | Community Management","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/rmarketingdigital.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/rmarketingdigital.com\/#\/schema\/person\/7c0d9782b2977b840b3740f00c69a73e","name":"R Digital Marketing","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c5599c203e0120b8ccbff4666af86f35f9b3dcad468a8bc6295313a3964a80be?s=96&d=mm&r=g","caption":"R Marketing Digital"}}]}},"_links":{"self":[{"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/posts\/83389","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/comments?post=83389"}],"version-history":[{"count":0,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/posts\/83389\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/media\/83390"}],"wp:attachment":[{"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/media?parent=83389"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/categories?post=83389"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rmarketingdigital.com\/en\/wp-json\/wp\/v2\/tags?post=83389"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}