---
title: Push API
slug: Web/API/Push_API
tags:
  - API
  - Ссылка
  - Уведомления
  - Экспериментальная
translation_of: Web/API/Push_API
---
<p>{{DefaultAPISidebar("Push API")}}{{SeeCompatTable}}</p>

<p><strong>Push API</strong> даёт веб приложениям возможность получать сообщения отправленные с сервера, независимо от того, запущено ли веб приложение в фоне или даже загружено ли оно вообще пользователем. Это позволяет разработчикам посылать асинхронные сообщения и обновления пользователям которые подписались на них, как результат улучшается информированность пользователей о новом контенте</p>

<div class="note">
<p><strong>Примечание</strong>: Эта документация охватывает спецификацию W3C Push API ; если вы ищете документацию по запатентованной технологии Firefox OS , <a href="/en-US/docs/Web/API/Simple_Push_API">смотрите здесь</a>.</p>
</div>

<h2 id="Общие_сведения_об_использовании_push_уведомлений">Общие сведения об использовании push уведомлений</h2>

<div class="warning">
<p><span id="result_box" lang="ru"><span>При внедрении подписки PushManager, жизненно важно защищать запросы от CSRF/XSRF атак в вашем приложении.</span> </span><span lang="ru"><span> </span></span></p>

<p><span lang="ru"><span>Дополнительную информацию см. В следующих статьях:</span></span></p>

<ul>
 <li><a href="https://habr.com/post/318748/">Методы защиты от CSRF-атаки</a></li>
 <li><a href="https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF)_Prevention_Cheat_Sheet">Site Request Forgery (CSRF) Prevention Cheat Sheet</a></li>
 <li><a href="/ru/docs/https://blog.codinghorror.com/preventing-csrf-and-xsrf-attacks/">Preventing CSRF and XSRF Attacks</a></li>
</ul>
</div>

<p>Для получения push уведомлений приложение должно иметь активный <a href="/en-US/docs/Web/API/ServiceWorker_API">service worker</a>. Когда service worker активен, оно может подписаться на push уведомления используя {{domxref("PushManager.subscribe()")}}.</p>

<p>Полученный объект {{domxref("PushSubscription")}} включает в себя всю необходимую информацию, которая может потребоваться приложению чтобы отправить push уведомление: адрес и ключ шифрования, необходимые для отправки данных.</p>

<p>Service worker будет запущен для того чтобы обрабатывать входящие push сообщения, которые будут доставлены в {{domxref("ServiceWorkerGlobalScope.onpush")}} обработчик события. Это позволит приложению реагировать на push сообщения, к примеру показывать нотификации через метод {{domxref("ServiceWorkerRegistration.showNotification()")}}.</p>

<p>Каждая подписка уникальна по отношению к service worker. Адрес для подписки это уникальный <a href="http://www.w3.org/TR/capability-urls/">capability URL</a>: всё что нужно чтобы отослать сообщение вашему приложению это адрес. Однако это URL необходимо держать в секрете, иначе любое другое приложение сможет слать push уведомление к вашему приложению.</p>

<p>Использование service worker для получения push уведомлений может привести к повышенному потреблению ресурсов, например это может влиять на расход батареи. Во всех браузерах это работает по разному - нет стандарта на этот счёт. К примеру Firefox позволяет лишь ограниченное число уведомлений которое может быть отправлено приложению, а Chrome не имеет таких ограничений, однако обязывает показывать уведомление пользователю каждый раз, чтобы пользователь мог решить хочет он или нет принимать их дальше.</p>

<div class="note">
<p><strong>Примечание: </strong><span id="result_box" lang="ru"><span>Начиная с Gecko 44, разрешённая квота push-</span></span>уведомлений<span lang="ru"><span> для каждого приложения не увеличивается, в случае если новое уведомление срабатывает когда другое все ещё должна отображаться в течение трёх секунд.</span> <span>Это обрабатывает случаи, когда получены несколько Push </span></span>уведомлений подряд<span lang="ru"><span> и не все генерируют видимое уведомление.</span></span></p>
</div>

<div class="note">
<p><strong>Примечание</strong>: Так же Chrome обязывает регистрировать проект в <a href="https://developers.google.com/cloud-messaging/">Google Cloud Messaging</a> для отправки push сообщений, а также использовать присвоенный номер проекта и API ключ когда отправляются push уведомления. К тому же требуется наличие манифеста приложения с некоторыми параметрами для использования этого сервиса. Возможно эти ограничения будут убраны в будущем.</p>
</div>

<h2 id="Интерфейсы">Интерфейсы</h2>

<dl>
 <dt>{{domxref("PushEvent")}}</dt>
 <dd>Представляет собой push действие отправленное в <a href="/en-US/docs/Web/API/ServiceWorkerGlobalScope">global scope</a> {{domxref("ServiceWorker")}}-а. Содержит информацию отправленную в {{domxref("PushSubscription")}}.</dd>
 <dt>{{domxref("PushManager")}}</dt>
 <dd>Предоставляет способ для получения уведомлений из сторонних серверов, а также из URL запросов для push уведомлений. Этот интерфейс заменил устаревшую функциональность интерфейса {{domxref("PushRegistrationManager")}}.</dd>
 <dt>{{domxref("PushMessageData")}}</dt>
 <dd>Предоставляет доступ к push данным отправленным сервером и включает методы для манипулирования полученными данными.</dd>
 <dt>{{domxref("PushSubscription")}}</dt>
 <dd>Предоставляет конечную точку URL подписки и позволяет отписаться от push сервиса.</dd>
</dl>

<h2 id="Служебный_работник_дополнения">Служебный работник дополнения</h2>

<p>Следующие дополнения к <a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a> описанные в спецификации Push API, представляют собой первостепенные действия для использования Push сообщений, а также для обработки push событий.</p>

<dl>
 <dt>{{domxref("ServiceWorkerRegistration.pushManager")}} {{readonlyinline}}</dt>
 <dd>Возвращает ссылку на интерфейс {{domxref("PushManager")}} для манипулирования push подписок включая подписывание, получение активной подписки и доступ к статусу push разрешения. Это входная точка к обмену push сообщениями.</dd>
 <dt>{{domxref("ServiceWorkerGlobalScope.onpush")}}</dt>
 <dd>Данный обработчик событий вызывается всякий раз когда происходит событие {{Event("push")}}; то есть всегда когда принимается push сообщение сервера.</dd>
 <dt>{{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}}</dt>
 <dd>Данный обработчик событий вызывается всякий раз когда происходит событие {{Event("pushsubscriptionchange")}}; например, когда push подписка стала недействительной или собирается быть недействительной (к примеру, когда push сервис устанавливает время истечения.)</dd>
</dl>

<h2 id="Спецификации">Спецификации</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">Спецификация</th>
   <th scope="col">Статус</th>
   <th scope="col">Комментарий</th>
  </tr>
  <tr>
   <td>{{SpecName("Push API")}}</td>
   <td>{{Spec2("Push API")}}</td>
   <td>Initial definition</td>
  </tr>
 </tbody>
</table>

<h2 id="Совместимость_браузера">Совместимость браузера</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Свойство</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>Базовая поддержка</td>
   <td>{{CompatChrome(42.0)}}</td>
   <td>{{CompatGeckoDesktop(44.0)}}<sup>[1]</sup></td>
   <td>{{CompatUnknown}}<sup>[2]</sup></td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
  </tr>
  <tr>
   <td>{{domxref("PushEvent.data")}},<br>
    {{domxref("PushMessageData")}}</td>
   <td>{{CompatChrome(50.0)}}</td>
   <td>{{CompatGeckoDesktop(44.0)}}</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>Свойство</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>Firefox OS</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>Базовая поддержка</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatUnknown}}<sup>[2]</sup></td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatChrome(51.0)}}</td>
  </tr>
  <tr>
   <td>{{domxref("PushEvent.data")}},<br>
    {{domxref("PushMessageData")}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatChrome(51.0)}}</td>
  </tr>
 </tbody>
</table>
</div>

<p>[1] В настоящее время доступно только для настольных версий Firefox; также push-сообщения доставляются только во время работы Firefox.</p>

<p>[2]: <a href="https://dev.modern.ie/platform/status/pushapi/">Microsoft Edge status: In Development</a></p>

<h2 id="Смотрите_также">Смотрите также</h2>

<ul>
 <li><a href="/en-US/docs/Web/API/Push_API/Using_the_Push_API">Using the Push API</a></li>
 <li><a href="https://github.com/chrisdavidmills/push-api-demo">Push API Demo</a>, на Github</li>
 <li><a href="http://updates.html5rocks.com/2015/03/push-notificatons-on-the-open-web">Push Notifications on the Open Web</a>, Matt Gaunt</li>
 <li><a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a></li>
</ul>

<div id="gtx-trans" style="position: absolute; left: 46px; top: 3314.75px;">
<div class="gtx-trans-icon"></div>
</div>