All for Joomla All for Webmasters
Ruby On Rails

Usando Vapid para Web Push Notifications em uma aplicação Ruby on Rails

Atualmente, espera-se que a maior parte dos sites sejam aplicações web dinâmicas que funcionem através de toda a gama de dispositivos e navegadores disponíveis. Já que a forma de acesso mais utilizada atualmente é através de dispositivos móveis, os usuários esperam um nível de interatividade próximo aos apps no desktop. No sentido de melhorar a experiência de usuário nesse aspecto, a funcionalidade de enviar push notifications para os usuários da plataforma é uma maneira de manter o engajamento constante. Nesse post, vamos ver um exemplo de configuração e implementação do envio de notificações através do protocolo VAPID (Voluntary Application Server Identification) utilizando o framework Ruby on Rails.

 

Como o Web Push funciona?

Para implementar um Webpush você precisa cumprir os seguintes pré-requisitos:

  • Um servidor Rails configurado para service workers.
  • O recebedor da notificação acessando através de um navegador que suporte Web Push
  • Um provedor de serviço de push, como o Google ou Mozilla

 

Implementando Web Push

Configurando as chaves Vapid

  • O primeiro passo para enviar uma mensagem é configurar uma única vez o par de chaves VAPID (pública e privada) para salvar em seu servidor. Essas chaves vão ser usadas para assinar suas requisições à API
  • Um arquivo manifest.json que auxilie a identificação da aplicação
  • Configurar um service worker e instalar no navegador do usuário. O service worker é inscrito para eventos do tipo push com sua chave VAPID
  • Seu servidor precisará fazer requisições à API para enviar as mensagens ao usuário inscrito
  • Seu service worker conterá o um evento que será disparado no recebimento da notificação

O diagrama abaixo dá um sobrevoo de todo o fluxo:

Como os Web Pushs funcionam. Fonte: W3.org

 

Primeiros passos

Você pode utilizar este repositório (créditos ao Lachi Agnew) para acompanhar ou partir da sua aplicação em Rails.

Gems a serem instaladas:

  • WebPush

Instale na raiz do projeto através do comando:

Essa gem é usada para manipular os dados de push (criptografia e requisições)

  • Serviceworkers:

‍O Serviceworkers-rails é uma gem que permite que o servidor hospede um arquivo service-worker.js como se ele estivesse no diretório raiz. Um service worker é basicamente um javascript que está sempre executando em plano de fundo, mesmo quando a página não está aberta. Eles têm muitas aplicações úteis além de escutar às notificações push, como carregamento offline e sincronizações. Para aprender mais sobre: https://developers.google.com/web/fundamentals/primers/service-workers/

Configurando as chaves VAPID:

Abra o seu console ruby e execute os comandos abaixo:

Setting up your VAPID keys gives your server a unique signature to sign the messages send out over the subscription.

Declarando o manifest.json

O manifest.json  é usado para passar as configurações do servidor que está enviando as notificações para o navegador

Adicione o link na tag head  da sua aplicação:

Configurando o Service Worker

Instale os arquivos do service worker:

Declare todos os arquivos que você deseja que sejam incluídos com o service worker:

Essa declaração determina quais arquivos serão referenciados como se estivessem na raiz do diretório.

Configurando o Service Worker para escutar o push

Obtendo as informações da inscrição

Para que o servidor consiga enviar uma notificação, você primeiro precisa se inscrever para a chave VAPID pública.

É um trecho de código longo, então explicando por partes, conforme delimitado nos comentários:

  1. Se o navegador não suporta notificações, lança uma exceção e não continua
  2. Se já tem permissão para notificações, pegar os dados da inscrição
  3. Se ainda não tem a permissão, requisita para o envio das notificações
  4. Se o usuário aceitar, obtém os dados da inscrição
  5. Registra o service worker
  6. Inscreve o  service worker para a chave pública do servidor
  7. Envia os dados da inscrição para o servidor

Ao enviar os dados para o servidor, no backend, esses devem ser salvos de forma a permitir a identificação do usuário para o qual se deseja enviar a notificação.

Enviando uma notificação push

Finalmente, agora você tem todos os dados necessários para mandar a mensagem ao cliente:

Com as informações da inscrições que armazenou no servidor, você pode enviar a notificação usando a gem web push conforme indicado acima. Quaisquer dúvidas ou sugestões, utilize a área de comentários ou entre em contato!


Fonte: https://medium.com/seed-digital/using-vapid-for-web-push-notifications-in-a-ruby-on-rails-application-e8e3ae00ab50

Você Também Pode Gostar

Nenhum Comentário

Deixe uma Resposta