Usando notificações por push pra aplicações Web

programador

Olá Pessoal tudo certo?

Antes de tudo se você ainda não tem o Sencha Cmd instalado em sua máquina leia nosso post anterior Introdução ao Sencha CMD, hoje irei trazer um artigo de autoria da Sencha sobre como melhorar sua aplicação web através de notificações push e Webpush e seus conceitos, espero que ele ajude vocês com suas futuras aplicações web.

Protocolo de notificações por push da Web

O protocolo Web Push Notifications é relativamente novo. Ele permite que os aplicativos da Web funcionem como aplicativos nativos e recebam mensagens enviadas de um servidor a qualquer momento, mesmo quando o aplicativo da Web não está ativo ou não está carregado no momento em um navegador. Isso permite envolver os usuários com notificações urgentes e relevantes quando eles não estiverem usando seu aplicativo e motivá-los a retornar ao aplicativo.

web-push

Isso deixa claro o valor comercial da implementação de notificações por push da Web em seus aplicativos da Web. Aumenta o engajamento do usuário. O valor geral do seu aplicativo também aumenta, porque as notificações por push tornam seu aplicativo mais útil para seus usuários. Isso melhora a usabilidade dos aplicativos da Web e nos aproxima do desenvolvimento de um único aplicativo da Web para todas as plataformas, em vez de precisarmos desenvolver um aplicativo nativo para cada plataforma.

Web Push vs Sockets da Web

Antes de entrar nos detalhes da tecnologia, gostaria de falar um pouco sobre as diferenças entre Web Push e Web Sockets. Primeiro, aqui está o que eles têm em comum. Os Web Push e Web Sockets são projetados para implementar comunicação em tempo real entre o aplicativo da Web e o servidor de aplicativos e para enviar dados e atualizações em tempo real do servidor de aplicativos para o seu aplicativo da Web.

Aqui estão as diferenças:

• Os Web Sockets só podem ser usados ​​quando uma página da Web é carregada e ativa. Mas o oposto ocorre com as notificações por push da Web, que podem ser usadas a qualquer momento, inclusive quando o aplicativo está ativo, inativo ou não carregado, e quando o navegador não está ativo ou está fechado.

• Os dados enviados usando o Web Push devem ser criptografados e há um limite de tamanho por mensagem (não deve ser maior que 4Kb). Há também um limite de contagem para o número de mensagens que você pode enviar (o valor limite exato depende do navegador). Alguns navegadores (por exemplo, o Chrome) também podem exigir que uma notificação seja exibida ao usuário sempre que uma mensagem é recebida. Você não tem nenhuma dessas limitações quando usa Web Sockets: você pode enviar qualquer número de mensagens não criptografadas de qualquer tamanho e tratá-las como quiser; e você pode exibir uma notificação ou atualizar silenciosamente os dados em seu aplicativo ou até mesmo não fazer nada.

• A regra geral é usar o Web Sockets para enviar atualizações de dados comuns para seu aplicativo da Web quando um usuário estiver interagindo com o aplicativo. Use as notificações por push da Web para enviar mensagens urgentes e importantes a um usuário que precisam ser recebidas imediatamente, independentemente de o usuário estar ou não trabalhando com seu aplicativo no momento.

Conceitos Técnicos

Vamos para os detalhes técnicos da tecnologia. Eu gostaria de explicar os detalhes usando um jogo com regras especiais, jogadores e rodadas. Vou começar descrevendo os jogadores do jogo. Existem 5 jogadores envolvidos neste jogo chamados Web Push Notifications:

• Aplicação Web

• Service Worker

• Navegador

• Application Service

• Push Server

Push é um serviço implementado pelo fornecedor do navegador; é uma ponte de comunicação entre o seu servidor de aplicativos e um navegador. Ele é responsável por entregar mensagens do seu servidor de aplicativos para o navegador.

Usando um jogo para demonstrar Notificações por Push da Web

Usando um jogo, demonstrarei como você pode adicionar notificações push da Web aos seus aplicativos. As regras deste jogo são definidas por várias especificações fornecidas pelo World Wide Web Consortium e pela Internet Engineering Task Force:

• As comunicações entre o Navegador e o aplicativo da web ou o service worker associado a esse aplicativo são descritas na especificação do Push API.

• A exibição de diferentes tipos de notificações, bem como a manipulação de notificações, são descritas na especificação da API de Notificações.

• As comunicações entre o Application Server e o Push Server são definidas na especificação do Web Push Protocol.

• Há também especificações adicionais que descrevem a criptografia de mensagens push e a identificação do servidor de aplicativos que permitem ao servidor de aplicativos provar que tem permissão para enviar mensagens para o usuário.

web-push

Rodadas de Jogo

O jogo foi dividido em 4 rodadas para exemplificar o conceito e o alvo de cada uma delas e como você pode implementar todas as etapas no seu applicatiovo

1º Rodada: Registro do Service Worker

As Notificações por Push Web exigem que o Service Worker lide com mensagens push, portanto, a primeira rodada será registrar seu service worker. Apenas o seu aplicativo da web e o navegador estão envolvidos nesta rodada. E esta rodada ocorre no carregamento da página.

O aplicativo da Web envia uma solicitação a um navegador para registrar um Service Worker e o navegador responde com o objeto SeviceWorkerRegistration se o Service Worker foi registrado com êxito.

ServiceWorker

Para implementar essa rodada, adicione o seguinte código ao seu aplicativo Web

Veja também:

Desenvolvimento de aplicativos mobile: o que é e por que é importante?

Desenvolvimento de aplicativos mobile: o que é e por que é importante?

Atualmente, é quase impossível imaginar nossa rotina sem os smartphones que se tornaram uma parte crucial de nossas vidas. Em uma pesquisa feita pela FGV, só o Brasil tem 424 milhões de dispositivos digitais em uso. E à medida que surgem mais novidades e utilidades para esses dispositivos, a busca por tecnologias mais avançadas e […]

Tecnologia sencha: por que ela é tão importante?

Tecnologia sencha: por que ela é tão importante?

Quando se trata de aprimorar a integração e o suporte de registro em sua aplicação, é fundamental concentrar-se na otimização dos testes de desenvolvimento e integração. Nesse contexto, a tecnologia sencha se destaca como uma ferramenta indispensável. Ao oferecer recursos abrangentes para o desenvolvimento e teste de aplicativos da web e móveis, a tecnologia sencha […]

Ateliê de software: por que investir nele ao invés de uma fábrica de software?

Ateliê de software: por que investir nele ao invés de uma fábrica de software?

Na busca pelo fornecedor ideal para impulsionar seu negócio, entender as melhores práticas e modelos que se alinham às necessidades específicas da sua empresa é crucial. Esse princípio é ainda mais relevante quando se trata do desenvolvimento de software intuitivo e personalizado. Muitos associam a ideia de desenvolvimento de software a uma fábrica de software, […]

O que é a metodologia ágil e como aplica-la em 5 passos?

O que é a metodologia ágil e como aplica-la em 5 passos?

Você sabia que a metodologia ágil é o que guia as ações das empresas para melhorar seus resultados e o aumento na produtividade? A utilização de uma metodologia ágil contribui na gestão e impulso à inovação nas companhias, a partir de um modelo de fácil implementação em projetos e processos. Este método prioriza a eficiência, […]

Daniel da Cunha Bueno

Daniel da Cunha Bueno

Atualmente como Sencha MVP Senior Software Enginer em aplicações web e mobile (#C,Sencha Ext JS, Xamarin).