Aplicações
Realtime com PHP
Gustavo Castro
II Congresso de Tecnologia da Informação (IFSUL)
Passo Fundo - RS
2019
Quem sou eu
Gustavo Castro
Tecnólogo em Sistemas para Internet (IFSUL - Passo Fundo)
Especializando em Ciência de Dados (Unopar - Passo Fundo)
Desenvolvedor PHP
Áreas de interesse: Bots, IoT, Embarcados, Programação paralela e distribuída.
Roteiro
● Uma visão sobre aplicações Realtime
● Técnicas Realtime
○ Polling
○ Long Polling
○ Server Sent Events (SSE)
○ Websockets
● PHP - Ratchet
Uma visão sobre aplicações Realtime
● O que são aplicações realtime?
○ Dados atualizados frequentemente
○ Velocidade nas interações
○ Sensação que está acontecendo “agora”
Uma visão sobre aplicações Realtime
● Principais áreas da utilização de aplicações realtime
○ Controle de tráfego aéreo
○ Bolsa de valores
○ Mensagens instantâneas
○ Transporte compartilhado
Técnicas Realtime
● Como funcionam as aplicações
realtime?
○ Como funciona a arquitetura cliente /
servidor?
■ Sempre começa pelo cliente
■ Se estabelece uma conexão
(Handshake)
■ Abre-se um canal para a troca
de mensagens
■ Encerra-se a conexão
Fonte: Do autor
Técnicas Realtime
● Polling
○ Cliente realiza requisições em intervalos regulares
○ O servidor retorna cada requisição
○ Não transmite sensação de realtime
■ Percebe-se a robotização no processo devido a
temporização
* handshake omitido no exemplo
Fonte: Do autor
Técnicas Realtime
● Long Polling
○ O cliente inicia conexão
○ Servidor mantém a conexão pelo maior tempo
possível
○ Ocorre evento para enviar os dados disponíveis
ou timeout
○ Cliente reinicia conexão imediatamente
* handshake omitido no exemplo
Fonte: Do autor
Técnicas Realtime
● Server Sent Events (SSE)
○ Cliente inicia conexão
○ Conexão unidirecional (servidor -> cliente)
○ Servidor envia respostas a cada evento
Fonte: Do autor
Técnicas Realtime
● Websocket
○ Cliente inicia conexão
○ Abre-se um canal bidirecional
○ Troca de mensagens até o encerramento
Fonte: Do autor
Técnicas Realtime
Sensação Realtime Única Conexão Full-duplex
Polling ~ X X
Long Polling V X X
SSE V V X
Websocket V V V
PHP
● “Implementa uma interface de baixo nível para funções de comunicação sockets baseadas
no popular BSD sockets, disponibilizando acionar como um servidor socket ou como um
cliente.” - PHP.net
● PHP 4.1.0 >=
● PHP 5.3.0 movido para o repositório PECL
○ --enable-sockets
PHP - Exemplo Socket
Fonte: Adaptação de https://www.php.net/manual/pt_BR/sockets.examples.php
Fonte: http://socketo.me/
PHP - Ratchet
● Ratchet
○ Framework PHP
○ Assíncrona (React PHP)
○ Websockets
○ Fácil manipulação de conexões
○ Escalável
PHP - Ratchet - Instalação
Instalação:
php ~/composer.phar require cboden/ ratchet
PHP - Ratchet - Arquitetura
A arquitetura de um APP com Ratchet é basicamente sustentado por duas classes.
A que contém a lógica da aplicação e a que contém o servidor.
PHP - Ratchet - Arquitetura
Classe lógica
● Implementa a interface
MessageComponentInterface com os métodos:
○ onOpen(ConnectionInterface)
○ onMessage(ConnectionInterface, string)
○ onClose(ConnectionInterface)
○ onError(ConnectionInterface, Exception)
Classe servidor
● Implementa um webserver IO baseado
em HTTP/Websocket
Fonte: Do autor
Fonte: Do autor
PHP - Ratchet - ConnectionInterface
● ConnectionInterface
○ Atributos
■ ->resourceId
● Id da conexão
○ Métodos
■ ->send(string)
● Envia uma mensagem para o cliente da conexão
■ ->close()
● Encerra a conexão
PHP - Consumindo o Websocket
● Javascript
● HTML5
● “O objeto WebSocket provê uma API para criação e gerenciamento de uma conexão
WebSocket com um servidor, bem como o envio e recebimento de dados através dessa
conexão.” - MDN
● Compatibilidade:
Fonte:
https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/WebSocket
PHP - Consumindo o Websocket
● Websocket API implementa os seguintes métodos
○ onopen(event)
○ onmessage(event)
○ onclose(event)
○ onerror(event)
Fonte: Do autor
Desenvolvimento de um
chat
Proposta de projeto para o II Congresso de
Tecnologia da Informação
Desenvolvimento de um chat
● Criar conta no Codenvy
○ https://codenvy.com/
● Montar a estrutura do projeto (script para acelerar o processo)
○ git clone https://github.com/debgustavocastro/oficina-websocket-php.git
○ mv oficina-websocket-php/install.sh ./
○ chmod +x install.sh
○ ./install.sh
install.sh
Fonte: Do autor
Desenvolvimento de um chat
● Configuração autoload
○ composer.json
● Atualiza o autoloader
○ ./composer.phar dump-autoload -o
Fonte: Do autor
Desenvolvimento de um chat
● Criar classe com regras do chat
○ Implementando a interface MessageComponentInterface
● Criar serviço
○ HTTP Server / WS Server
● Implementar WS na aplicação cliente
Live code….
Desenvolvimento de um chat
● Levantando aplicação servidor
○ php chat-service.php
● Ngrok
○ Gera URLs públicas para teste de aplicações
○ ./ngrok http 8070
● Utilizar link do ngrok na aplicação cliente
Desenvolvimento de um chat
Fonte disponível em https://github.com/debgustavocastro/chat-websocket-server
That’s all folks!
Gustavo Castro
Github: github.com/debgustavocastro
Linkedin: linkedin.com/in/gustavocastro78
SlideShare: pt.slideshare.net/GustavoCastro35
Referências
https://codeburst.io/polling-vs-sse-vs-websocket-how-to-choose-the-right-one-1859e4e13bd9
https://www.php.net/
http://socketo.me/
https://developer.mozilla.org/pt-BR/docs/Web/API/WebSocket

Aplicações Realtime com PHP

  • 1.
    Aplicações Realtime com PHP GustavoCastro II Congresso de Tecnologia da Informação (IFSUL) Passo Fundo - RS 2019
  • 2.
    Quem sou eu GustavoCastro Tecnólogo em Sistemas para Internet (IFSUL - Passo Fundo) Especializando em Ciência de Dados (Unopar - Passo Fundo) Desenvolvedor PHP Áreas de interesse: Bots, IoT, Embarcados, Programação paralela e distribuída.
  • 3.
    Roteiro ● Uma visãosobre aplicações Realtime ● Técnicas Realtime ○ Polling ○ Long Polling ○ Server Sent Events (SSE) ○ Websockets ● PHP - Ratchet
  • 4.
    Uma visão sobreaplicações Realtime ● O que são aplicações realtime? ○ Dados atualizados frequentemente ○ Velocidade nas interações ○ Sensação que está acontecendo “agora”
  • 5.
    Uma visão sobreaplicações Realtime ● Principais áreas da utilização de aplicações realtime ○ Controle de tráfego aéreo ○ Bolsa de valores ○ Mensagens instantâneas ○ Transporte compartilhado
  • 6.
    Técnicas Realtime ● Comofuncionam as aplicações realtime? ○ Como funciona a arquitetura cliente / servidor? ■ Sempre começa pelo cliente ■ Se estabelece uma conexão (Handshake) ■ Abre-se um canal para a troca de mensagens ■ Encerra-se a conexão Fonte: Do autor
  • 7.
    Técnicas Realtime ● Polling ○Cliente realiza requisições em intervalos regulares ○ O servidor retorna cada requisição ○ Não transmite sensação de realtime ■ Percebe-se a robotização no processo devido a temporização * handshake omitido no exemplo Fonte: Do autor
  • 8.
    Técnicas Realtime ● LongPolling ○ O cliente inicia conexão ○ Servidor mantém a conexão pelo maior tempo possível ○ Ocorre evento para enviar os dados disponíveis ou timeout ○ Cliente reinicia conexão imediatamente * handshake omitido no exemplo Fonte: Do autor
  • 9.
    Técnicas Realtime ● ServerSent Events (SSE) ○ Cliente inicia conexão ○ Conexão unidirecional (servidor -> cliente) ○ Servidor envia respostas a cada evento Fonte: Do autor
  • 10.
    Técnicas Realtime ● Websocket ○Cliente inicia conexão ○ Abre-se um canal bidirecional ○ Troca de mensagens até o encerramento Fonte: Do autor
  • 11.
    Técnicas Realtime Sensação RealtimeÚnica Conexão Full-duplex Polling ~ X X Long Polling V X X SSE V V X Websocket V V V
  • 12.
    PHP ● “Implementa umainterface de baixo nível para funções de comunicação sockets baseadas no popular BSD sockets, disponibilizando acionar como um servidor socket ou como um cliente.” - PHP.net ● PHP 4.1.0 >= ● PHP 5.3.0 movido para o repositório PECL ○ --enable-sockets
  • 13.
  • 14.
    Fonte: Adaptação dehttps://www.php.net/manual/pt_BR/sockets.examples.php
  • 15.
    Fonte: http://socketo.me/ PHP -Ratchet ● Ratchet ○ Framework PHP ○ Assíncrona (React PHP) ○ Websockets ○ Fácil manipulação de conexões ○ Escalável
  • 16.
    PHP - Ratchet- Instalação Instalação: php ~/composer.phar require cboden/ ratchet
  • 17.
    PHP - Ratchet- Arquitetura A arquitetura de um APP com Ratchet é basicamente sustentado por duas classes. A que contém a lógica da aplicação e a que contém o servidor.
  • 18.
    PHP - Ratchet- Arquitetura Classe lógica ● Implementa a interface MessageComponentInterface com os métodos: ○ onOpen(ConnectionInterface) ○ onMessage(ConnectionInterface, string) ○ onClose(ConnectionInterface) ○ onError(ConnectionInterface, Exception) Classe servidor ● Implementa um webserver IO baseado em HTTP/Websocket
  • 19.
  • 20.
    PHP - Ratchet- ConnectionInterface ● ConnectionInterface ○ Atributos ■ ->resourceId ● Id da conexão ○ Métodos ■ ->send(string) ● Envia uma mensagem para o cliente da conexão ■ ->close() ● Encerra a conexão
  • 21.
    PHP - Consumindoo Websocket ● Javascript ● HTML5 ● “O objeto WebSocket provê uma API para criação e gerenciamento de uma conexão WebSocket com um servidor, bem como o envio e recebimento de dados através dessa conexão.” - MDN ● Compatibilidade: Fonte: https://developer.mozilla.org/en-US/docs/Web/API/WebSocket/WebSocket
  • 22.
    PHP - Consumindoo Websocket ● Websocket API implementa os seguintes métodos ○ onopen(event) ○ onmessage(event) ○ onclose(event) ○ onerror(event)
  • 23.
  • 24.
    Desenvolvimento de um chat Propostade projeto para o II Congresso de Tecnologia da Informação
  • 25.
    Desenvolvimento de umchat ● Criar conta no Codenvy ○ https://codenvy.com/ ● Montar a estrutura do projeto (script para acelerar o processo) ○ git clone https://github.com/debgustavocastro/oficina-websocket-php.git ○ mv oficina-websocket-php/install.sh ./ ○ chmod +x install.sh ○ ./install.sh
  • 26.
  • 27.
    Desenvolvimento de umchat ● Configuração autoload ○ composer.json ● Atualiza o autoloader ○ ./composer.phar dump-autoload -o Fonte: Do autor
  • 28.
    Desenvolvimento de umchat ● Criar classe com regras do chat ○ Implementando a interface MessageComponentInterface ● Criar serviço ○ HTTP Server / WS Server ● Implementar WS na aplicação cliente Live code….
  • 29.
    Desenvolvimento de umchat ● Levantando aplicação servidor ○ php chat-service.php ● Ngrok ○ Gera URLs públicas para teste de aplicações ○ ./ngrok http 8070 ● Utilizar link do ngrok na aplicação cliente
  • 30.
    Desenvolvimento de umchat Fonte disponível em https://github.com/debgustavocastro/chat-websocket-server
  • 31.
    That’s all folks! GustavoCastro Github: github.com/debgustavocastro Linkedin: linkedin.com/in/gustavocastro78 SlideShare: pt.slideshare.net/GustavoCastro35
  • 32.