DEV Community

Cover image for Broadcasting e Notificações 📡
Northon Iserhardt
Northon Iserhardt

Posted on

Broadcasting e Notificações 📡

Notificações

Notificações são um meio de informar aos nossos usuários que algo aconteceu. Existem diversos tipos de notificações, como e-mail e SMS, mas para este projeto, utilizaremos notificações do tipo push, que são mensagens enviadas aos dispositivos dos usuários, mesmo quando o aplicativo está fechado ou não em uso. Geralmente, essas notificações ficam no ícone do "sininho".

Na documentação, em notificações: https://laravel.com/docs/10.x/notifications conseguimos encontrar o que precisaremos para que as notificações funcionem. Uma dependência é o broadcast: https://laravel.com/docs/10.x/notifications#broadcast-notifications, a própria documentação nos instrui a configurar e compreender o conceito de broadcasting, e é exatamente isso que faremos antes de prosseguir:
Image description

Broadcasting

Resumidamente, de acordo com a documentação, os broadcasts são canais que permitem compartilhar os mesmos nomes de eventos e dados entre sua aplicação Laravel no servidor e sua aplicação JavaScript no cliente. Os clientes se conectam no frontend em canais pré-nomeados, enquanto sua aplicação Laravel transmite eventos para esses canais no backend. Esses eventos podem conter qualquer dado adicional que você queira disponibilizar para o frontend. Broadcasting é o que possibilitará que nosso backend informe em tempo real ao nosso frontend quando algo ocorre.

Configuração inicial para utilizar Broadcasting

  • Precisamos ter uma conta no Pusher que será nosso server-side broadcasting driver, você pode criar uma conta gratuita de teste (Sandbox). Posteriormente criar um app: Image description Depois vamos pegar nossas credenciais e preencher no .env: Image description .env:

Image description

  • Vamos usar queues, logo precisamos configurar um queue worker Queue: No .env:

Image description

Executar os comandos:
php artisan queue:table
php artisan migrate
Agora devemos ter uma nova tabela no nosso banco de dados:

Image description

Essa tabela guarda todos os jobs que ainda não foram executados pela nossa queue.

Configuração do broadcasting

  • Descomente "App\Providers\BroadcastServiceProvider" no array de providers do seu arquivo config/app.php

Image description

  • Instale o Pusher Channels PHP SDK:
    composer require pusher/pusher-php-server

  • Mude seu driver de broadcasting para o pusher no arquivo .env:
    Image description

  • Instale o Laravel Echo, uma biblioteca JavaScript que torna simples se inscrever em canais e ouvir eventos transmitidos pelo driver de broadcasting no lado do servidor. Vamos aproveitar para instalar o pusher-js, já que escolhemos o Pusher como driver:
    npm install --save-dev laravel-echo pusher-js

  • Crie uma nova instância do Echo em JavaScript para a aplicação; um ótimo local para fazer isso é no arquivo de configuração resources/js/bootstrap.js. O arquivo já possui um exemplo que usaremos como referência:
    Image description

  • Vamos compilar a aplicação:
    npm run dev

  • No nosso projeto usaremos canais privados, canais que precisam de autorização para serem acessados. Você pode encontrar mais detalhes aqui: https://laravel.com/docs/10.x/broadcasting#defining-authorization-routes

Precisamos definir nossas regras de autorização de canais em routes/channels.php, usaremos o canal de exemplo:

Image description

Nesse exemplo estamos passando o usuário logado que é padrão, e o id de algum usuário através do "{id}", para verificar se o id do usuário que estamos passando é o mesmo do usuário logado.
Image description

Top comments (0)