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
|
---
title: API Push
slug: Web/API/Push_API
tags:
- API
- Experimental
- Notificações
- Push
- Referencia
- Service Workers
translation_of: Web/API/Push_API
original_slug: Web/API/API_Push
---
<div>{{DefaultAPISidebar("Push API")}}{{SeeCompatTable}}</div>
<p>A <strong>API Push </strong>torna possível que aplicações web recebam mensagens enviadas a elas de um servidor, indepententemente de aplicação estar ou não em primeiro plano, ou até mesmo carregada, em um agente de usuário. Isso permite que desenvolvedores entreguem notificações e atualizações assíncronas a usuários que optarem por elas, resultando num melhor engajamento com conteúdo novo oportuno.</p>
<div class="note">
<p><strong>Nota</strong>: Esta documentação cobre a especificação W3C da API Push; se você procura pela documentação do sistema de notificação proprietária do mecanismo push, veja<a href="/en-US/docs/Web/API/Simple_Push_API"> Simple Push</a>.</p>
</div>
<h2 id="Conceitos_e_uso_de_Push">Conceitos e uso de Push</h2>
<p>Para uma aplicação receber mensagens push, ela precisa ter um <a href="/en-US/docs/Web/API/ServiceWorker_API">service worker</a> ativo. Quando o service worker está ativo, ele pode se inscrever para utilizar notificações push {{domxref("PushManager.subscribe()")}}.</p>
<p>O resultado de {{domxref("PushSubscription")}} inclui toda informação que a aplicação precisa para receber uma mensagem push: um endpoint e a chave encriptada necessária para o envio de dados.</p>
<p>O service worker será iniciado conforme o necessário para lidar com as mensagens recebidas, que são entregues ao manipulador de evento {{domxref("ServiceWorkerGlobalScope.onpush")}} . Isto permite que a aplicação reaja a cada mensagem recebida, por exemplo para exibir a notificação ao usuário (usando {{domxref("ServiceWorkerRegistration.showNotification()")}}.)</p>
<p>Cada assinatura é única para um service worker. O endpoint para a assinatura é uma <a href="http://www.w3.org/TR/capability-urls/">capability URL</a> única: o conhecimento do endpoint é tudo que é necessário para enviar uma mensagem para sua aplicação. A URL do endpoint precisa ser mantida em segredo, ou outras aplicações estranhas poderão enviar mensagens push para a sua aplicação.</p>
<p>A ativação de um service worker para entregar mensagens push pode resultar em um aumento de uso de recursos, particularmente de bateria. Diferentes navegadores tem diferentes formas para lidar com isso — atualmente não existe uma forma padrão. Firefox permite um número limitado (cota) de mensagens push para serem enviadas para uma aplicação, embora as mensagens Push que gerem notificações são isentas deste limite. O limite é atualizado a cada site visitado. Numa comparação, Chrome não aplica nenhum limite, mas requer que cada mensagem push exiba uma notificação.</p>
<div class="note">
<p><strong>Nota</strong>: A partir do Gecko 44, a cota permitida de mensagens push por aplicação não é incrementada quando uma nova notificação é disparada quando outra está visível, por um período de três segundos. Isso lida com casos em que várias notificações são recebidas ao mesmo tempo, mas nem todas estão visíveis.</p>
</div>
<div class="note">
<p><strong>Nota</strong>: Chrome atualmente requer que você crie um projeto no <a href="https://developers.google.com/cloud-messaging/">Google Cloud Messaging</a> para enviar mensagens push e use um número do projeto e chave da API para o envio de notificações push. Isto também requer um <em>app manifest</em> com alguns parâmetros especiais para usar o serviço. Essa restrição deverá ser removida no futuro.</p>
</div>
<h2 id="Interfaces">Interfaces</h2>
<dl>
<dt>{{domxref("PushEvent")}}</dt>
<dd>Representa uma ação push enviada para o <a href="/en-US/docs/Web/API/ServiceWorkerGlobalScope">global scope</a> de um {{domxref("ServiceWorker")}}. Ele contém informações enviadas de uma aplicação para um {{domxref("PushSubscription")}}.</dd>
<dt>{{domxref("PushManager")}}</dt>
<dd>Fornece uma forma de receber notificações de servidor third-party bem como solicitar URL para notificações push. Essa interface substitui a funcionalidade oferecida que está obsoleta {{domxref("PushRegistrationManager")}} interface.</dd>
<dt>{{domxref("PushMessageData")}}</dt>
<dd>Fornece acesso aos dados push enviados por um servidor, e inclui métodos para manipular os dados recebidos.</dd>
<dt>{{domxref("PushSubscription")}}</dt>
<dd>Fornece a URL de assinatura do endpoint e permite o cancelamento da assinatura de um serviço push.</dd>
</dl>
<h2 id="Service_worker_additions">Service worker additions</h2>
<p>As seguintes informações adicionais para a <a href="/en-US/docs/Web/API/Service_Worker_API">Service Worker API</a> foram especificadas na Push API spec, para fornecer um ponto de entrada para usar mensagens Push, e para monitorar e responder os eventos de envio e assinatura.</p>
<dl>
<dt>{{domxref("ServiceWorkerRegistration.pushManager")}} {{readonlyinline}}</dt>
<dd>Retorna uma referência para a interface {{domxref("PushManager")}} para administrar assinaturas push incluindo subscrever, obter uma assinatura ativa e acessar o status de permissão de envio. Este é o ponto de entrada para usar mensagens Push.</dd>
<dt>{{domxref("ServiceWorkerGlobalScope.onpush")}}</dt>
<dd>Um manipulador de eventos disparado sempre que um evento {{Event("push")}} ocorre; isto é, sempre que uma mensagem do servidor de envio for recebida.</dd>
<dt>{{domxref("ServiceWorkerGlobalScope.onpushsubscriptionchange")}}</dt>
<dd>Um manipulador de eventos disparado sempre que um evento {{Event("pushsubscriptionchange")}} ocorre; por exemplo, quando uma assinatura push está inválida, ou está prestes a ser invalidada (ex. quando um serviço push service define um tempo de expiração.)</dd>
</dl>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Status</th>
<th scope="col">Comentário</th>
</tr>
<tr>
<td>{{SpecName("Push API")}}</td>
<td>{{Spec2("Push API")}}</td>
<td>Definição Inicial</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Compatibilidade com navegadores</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Funcionalidade</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>Suporte básico</td>
<td>{{CompatChrome(42.0)}}</td>
<td>{{CompatGeckoDesktop(44.0)}}<sup>[1]</sup></td>
<td>{{CompatNo}}<sup>[2]</sup></td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>{{domxref("PushEvent.data")}},<br>
{{domxref("PushMessageData")}}</td>
<td>{{CompatNo}}</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>Funcionalidade</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>Suporte básico</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(42.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>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<p>[1] Atualmente disponível apenas nas versões desktop do Firefox; ainda, mensagens push são encaminhadas apenas quando o Firefox está em execução.</p>
<p>[2] Ainda não implementado. Veja <a href="https://dev.modern.ie/platform/status/pushapi/">Microsoft Edge status information</a>.</p>
<h2 id="Veja_também">Veja também</h2>
<ul>
<li><a href="/en-US/docs/Web/API/Push_API/Using_the_Push_API">Usando Push API</a></li>
<li><a href="https://github.com/chrisdavidmills/push-api-demo">Push API Demo</a>, no 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>
|
