Service Worker

Um Service Worker e um script JavaScript que e executado em segundo plano no browser, independentemente da pagina web ativa. E a base tecnica das Browser Push Notifications, pois recebe e exibe as notificacoes mesmo que o site nao esteja aberto.

Definicao

Um Service Worker e um script JavaScript especial que e executado no browser em segundo plano, separado da pagina web normal. Ao contrario do JavaScript normal da pagina, o Service Worker continua a correr mesmo que o utilizador nao tenha o site aberto. Isto torna-o a base tecnica indispensavel das Browser Push Notifications.

Os Service Workers sao parte das Progressive Web App (PWA) APIs e sao suportados em todos os browsers modernos. Requerem obrigatoriamente HTTPS, pois o acesso a funcionalidades sensiveis do browser como notificacoes push e cache offline so e permitido atraves de ligacoes seguras.

Ciclo de vida de um Service Worker

Um Service Worker passa por tres fases:

  1. Registo: O JavaScript da pagina regista o Service Worker. O browser faz o download do arquivo do Service Worker e verifica se e novo ou atualizado.
  2. Instalacao: O browser instala o Service Worker. Aqui podem ser colocadas em cache recursos para utilizacao offline.
  3. Ativacao: O Service Worker fica ativo e controla todas as paginas do mesmo dominio. As versoes anteriores do Service Worker sao encerradas.

Uma vez registado, o Service Worker e atualizado automaticamente pelo browser quando o arquivo muda no servidor.

Service Worker e eventos Push

O componente mais importante para as Browser Push Notifications e o evento push do Service Worker. O fluxo tecnico:

  1. O servidor envia uma notificacao Push para o endpoint de subscricao do browser via Web Push API
  2. O browser acorda o Service Worker, mesmo que o site esteja fechado
  3. O Service Worker recebe o evento push e desencripta o payload
  4. O Service Worker exibe a notificacao atraves de self.registration.showNotification()
  5. Se o utilizador clicar na notificacao, o Service Worker recebe o evento notificationclick e pode abrir o URL correto ou focar um separador existente

Cache e uso offline

Alem das push notifications, os Service Workers tambem suportam o Cache API, que permite guardar recursos (HTML, CSS, imagens) localmente no browser. Isto permite:

  • Carregar o site mais rapido em visitas repetidas
  • Disponibilizar conteudo basico do site mesmo sem ligacao a internet
  • Mostrar uma pagina offline personalizada quando nao ha ligacao

Para a maioria dos projetos de Browser Push Notifications, a funcionalidade de cache e opcional e nao e necessaria para as notificacoes funcionarem.

HTTPS como requisito

Os Service Workers so podem ser registados em origens HTTPS (com excecao de localhost para desenvolvimento). Isto e intencional: os Service Workers tem acesso a funcionalidades poderosas do browser e nao devem ser intercetaveis por ataques man-in-the-middle.

Para a producao: assegure-se de que o seu site tem um certificado SSL valido. Os servicos de alojamento modernos e as CDNs oferecem certificados SSL gratuitamente (por exemplo, Let's Encrypt).

Debug e inspecao

A maioria dos browsers modernos tem ferramentas de debug para Service Workers. No Chrome DevTools, em Application > Service Workers, pode ver o Service Worker registado, o seu estado (instalado, ativo) e simular eventos push para testes. Isto e util para verificar se o Service Worker esta a funcionar corretamente durante o desenvolvimento.

Service Workers no SendSeven

Para usar as Browser Push Notifications via SendSeven, e necessario integrar um Service Worker no seu site. O SendSeven disponibiliza um arquivo de Service Worker predefinido e a documentacao de integracao no guia de Browser Push. A maioria das integracoes requer apenas a copia de um arquivo e o registo com duas linhas de JavaScript.