SlideShare uma empresa Scribd logo
1 de 30
Websocket com PHP
DICA: PEGUEM CAFÉÉÉÉÉ!
TÓPICOS
● O que é Websocket;
● Para que serve;
● Sobre HTTP;
● Suporte dos navegadores;
● Sobre o Ratchet;
● Riscos;
● Exemplos e demonstrações;
● Conclusão;
● Dúvidas.
HELLO!
Sou o Leonardo Rifeli!
✘ Tenho 20 anos
✘ Eterno estudante no mundo tecnológico
✘ Já fiz mais de 100 sites
✘ Sou programador e sim, eu tomo muito café
✘ Escritor no blog leonardorifeli.com :D
MAS, O QUE É WEBSOCKET?
DEFINIÇÃO DE WEBSOCKET
Websockets são um full-duplex, conexão persistente bi-direcional de
um navegador web para um servidor. Depois que uma conexão
socket é estabelecida a conexão permanece aberta até que o cliente
ou servidor decida encerrar.
Com esta conexão aberta, o cliente ou servidor pode enviar uma
mensagem a qualquer outro cliente conectado. Sendo assim, neste
momento, uma única aplicação de servidor em execução estará
ciente de todas as conexões abertas, o que lhe permite comunicar
com qualquer outra conexão aberta e a qualquer momento.
CONEXÃO COM WEBSOCKET
E QUAL O USO?
Perfeito! Entendi o que é; mas, para que serve?
ONDE É UTILIZADO WEBSOCKET?
CHATS
Sim, eles são
desenvolvidos com
comunicação socket.
JOGOS ON-LINE
Aqueles games que
possuem interação em
tempo real dos
jogadores que estão em
uma respectiva fase.
ATUALIZAÇÕES REAL TIME
Toda atualização que ocorre
em tempo real, pode ser
desenvolvida facilmente com
web socket.
Exemplo de uso:
Usuários editando um documento no
Google Docs:
Entre várias aplicações.
UM POUCO SOBRE HTTP
E OS NAVEGADORES?
Eles já suportam conexões com socket?
SIM, EXCETO O OPERA!
PERFEITO!
Partiu usar websocket nos projetos! Espere, vá com calma, muita calma...
E NO SERVIDOR?
Sim, os servidores podem te impedir de obter e
executar uma aplicação websocket
SOBRE O RATCHET
As aplicações de socket para servidor não tem acompanhado os
navegadores. É aí que surgiu o Ratchet, uma ferramenta fantástica
para a implementação de um servidor, por protocolo TCP. Você pode
iniciar um servidor com o Ratchet I/O Component Server, tendo um
código que implementa o respectivo componente e poderá gerenciar
todas as conexões.
Site: socketo.me
Projeto: github.com/ratchetphp/Ratchet
FLUXO DE FUNCIONAMENTO
IMPLEMENTAÇÃO DO RATCHET
VAMOS CODAR! Será bem básico.
✘ 1. Dependência;
✘ 2. Implementação do servidor;
✘ 3. Gerenciador das conexões;
✘ 4. Script de conexão.
1. DEPENDÊNCIA
2. IMPLEMENTAÇÃO DO SERVIDOR
✘ RatchetServerIoServer: Cria um socket aberto para
escutar uma porta específica, para conexões de entrada. Os
eventos são delegados através deste para as aplicações
anexadas.
✘ RatchetHttpHttpServer: Implementa os métodos da
interface MessageComponentInterface e gerencia as
conexões.
✘ RatchetWebSocketWsServer: Um adaptador para lidar
com as requisições e respostas do websocket. Este é o
mediador entre o servidor e o cliente, para lidar com as
mensagens em tempo real, por intermédio de um navegador
web.
✘ HermesBusinessServiceSocketService: Este será nosso
gerenciador de conexões, mensagens, erros e encerramentos.
3. GERENCIADOR DAS CONEXÕES
3. REQUEST PELO SOCKET
4. SCRIPT DE CONEXÃO
Repare o ws: Há um novo
esquema de URL para conexões
Websocket, existe também wss:
para uma conexão Websocket
usando para conexões HTTP
seguras.
Com isso, você pode manipular
mensagens para o servidor e, ele
por sua vez, repassar para outras
conexões.
MAIS INFORMAÇÕES
Você pode encontrar mais informaçòes sobre o assunto no
meu blog: leonardorifeli.com
RISCOS
Sim, poderão haver riscos dependendo da complexidade da
aplicação e de como o servidor, o gerenciador das conexões e o
script, foram implementados.
Alguns riscos:
✘ Falhas de segurança na comunicação de informações privadas;
✘ Canais implementados incorretamente;
✘ Conexões simultâneas e queda do servidor.
✘ Entre muitos que, podem variar de acordo com a
implementação.
ALGORITMO PARA ACESSAR O CHAT
E INTERAGIR
✘ PEGUE O SEU
NOTEBOOK/CELULAR/TABLET/GELADEIRA;
✘ AUMENTE O VOLUME;
✘ CONECTE-SE NA REDE WIFI LOCAL;
✘ ABRA SEU NAVEGADOR (NÃO USE O OPERA MINI);
✘ ACESSE O ENDEREÇO: http://192.168.0.204/tag/chat;
✘ COLOQUE SEU NOME - SELECIONE A SALA 1;
✘ VOCÊ PODE ENVIAR MENSAGENS PARA AS PESSOAS E
BUZINAR PARA ELAS.
SHOW ME THE CODE
VAMOS AO CÓDIGO E EXEMPLOS
RESUMO
O que vimos até agora:
● O que é Websocket;
● Para que serve;
● Sobre HTTP;
● Suporte dos navegadores;
● Sobre o Ratchet;
● Exemplo divertido;
● Riscos.
CONCLUSÃO
Sempre que precisar de uma conexão quase em tempo real de baixa
latência entre o cliente e o servidor, você terá que implementar
Websocket. Isso pode envolver a reformulação do modo como você
desenvolve as aplicações de servidor com um novo foco em
tecnologias como filas de eventos.
AGRADECIMENTOS
✘ A TAG POR ACEITAR A PALESTRA E CEDER O ESPAÇO
✘ TODA A GALERA QUE AJUDOU A ORGANIZAR
✘ O LUIZ E FERNANDO PELO AUXÍLIO TÉCNICO
✘ VOCÊS PELO INTERESSE
✘ E AO LEONARDO PELA PALESTRA! :D
OBRIGADO!
Dúvidas?
Vocês podem me contactar por:
✘ Twitter: @leonardorifeli
✘ E-mail: leonardorifeli@gmail.com
✘ Blog: leonardorifeli.com

Mais conteúdo relacionado

Semelhante a Websocket com PHP: Introdução ao protocolo e implementação com Ratchet

Semelhante a Websocket com PHP: Introdução ao protocolo e implementação com Ratchet (20)

Comet - ReverseAjax com DWR - Resumo
Comet - ReverseAjax com DWR - ResumoComet - ReverseAjax com DWR - Resumo
Comet - ReverseAjax com DWR - Resumo
 
Web socket - Trazendo soquetes para a web
Web socket - Trazendo soquetes para a webWeb socket - Trazendo soquetes para a web
Web socket - Trazendo soquetes para a web
 
Web socket - Trazendo soquetes para a web
Web socket - Trazendo soquetes para a webWeb socket - Trazendo soquetes para a web
Web socket - Trazendo soquetes para a web
 
Comunicação em tempo real com WebRTC e PHP
Comunicação em tempo real com WebRTC e PHPComunicação em tempo real com WebRTC e PHP
Comunicação em tempo real com WebRTC e PHP
 
O que há de PHP e Websockets por aí?
O que há de PHP e Websockets por aí?O que há de PHP e Websockets por aí?
O que há de PHP e Websockets por aí?
 
Tchelinux: Go Web!
Tchelinux:  Go Web!Tchelinux:  Go Web!
Tchelinux: Go Web!
 
Aplicações Realtime em Android | Fisl 15 | GuMobileRS
Aplicações Realtime em Android | Fisl 15 | GuMobileRSAplicações Realtime em Android | Fisl 15 | GuMobileRS
Aplicações Realtime em Android | Fisl 15 | GuMobileRS
 
Python CGI
Python CGIPython CGI
Python CGI
 
Aprendendo a programar <3
Aprendendo a programar <3Aprendendo a programar <3
Aprendendo a programar <3
 
Javascript
JavascriptJavascript
Javascript
 
Html - Capitulo 02
Html - Capitulo 02Html - Capitulo 02
Html - Capitulo 02
 
Reverse Ajax Dwr
Reverse Ajax DwrReverse Ajax Dwr
Reverse Ajax Dwr
 
Curso ASP.Net - Módulo 1
Curso ASP.Net - Módulo 1Curso ASP.Net - Módulo 1
Curso ASP.Net - Módulo 1
 
PHP - Capítulo 01
PHP - Capítulo 01PHP - Capítulo 01
PHP - Capítulo 01
 
Web Services com Apache Axis
Web Services com Apache AxisWeb Services com Apache Axis
Web Services com Apache Axis
 
Protocolo Http
Protocolo HttpProtocolo Http
Protocolo Http
 
ASP.NET 5, MVC 6 e além
ASP.NET 5, MVC 6 e alémASP.NET 5, MVC 6 e além
ASP.NET 5, MVC 6 e além
 
Aula01
Aula01Aula01
Aula01
 
Internet
InternetInternet
Internet
 
Professor rogerio-apostila
Professor rogerio-apostilaProfessor rogerio-apostila
Professor rogerio-apostila
 

Websocket com PHP: Introdução ao protocolo e implementação com Ratchet

  • 3. TÓPICOS ● O que é Websocket; ● Para que serve; ● Sobre HTTP; ● Suporte dos navegadores; ● Sobre o Ratchet; ● Riscos; ● Exemplos e demonstrações; ● Conclusão; ● Dúvidas.
  • 4. HELLO! Sou o Leonardo Rifeli! ✘ Tenho 20 anos ✘ Eterno estudante no mundo tecnológico ✘ Já fiz mais de 100 sites ✘ Sou programador e sim, eu tomo muito café ✘ Escritor no blog leonardorifeli.com :D
  • 5. MAS, O QUE É WEBSOCKET?
  • 6. DEFINIÇÃO DE WEBSOCKET Websockets são um full-duplex, conexão persistente bi-direcional de um navegador web para um servidor. Depois que uma conexão socket é estabelecida a conexão permanece aberta até que o cliente ou servidor decida encerrar. Com esta conexão aberta, o cliente ou servidor pode enviar uma mensagem a qualquer outro cliente conectado. Sendo assim, neste momento, uma única aplicação de servidor em execução estará ciente de todas as conexões abertas, o que lhe permite comunicar com qualquer outra conexão aberta e a qualquer momento.
  • 8. E QUAL O USO? Perfeito! Entendi o que é; mas, para que serve?
  • 9. ONDE É UTILIZADO WEBSOCKET? CHATS Sim, eles são desenvolvidos com comunicação socket. JOGOS ON-LINE Aqueles games que possuem interação em tempo real dos jogadores que estão em uma respectiva fase. ATUALIZAÇÕES REAL TIME Toda atualização que ocorre em tempo real, pode ser desenvolvida facilmente com web socket. Exemplo de uso: Usuários editando um documento no Google Docs: Entre várias aplicações.
  • 11. E OS NAVEGADORES? Eles já suportam conexões com socket?
  • 12. SIM, EXCETO O OPERA!
  • 13. PERFEITO! Partiu usar websocket nos projetos! Espere, vá com calma, muita calma...
  • 14. E NO SERVIDOR? Sim, os servidores podem te impedir de obter e executar uma aplicação websocket
  • 15. SOBRE O RATCHET As aplicações de socket para servidor não tem acompanhado os navegadores. É aí que surgiu o Ratchet, uma ferramenta fantástica para a implementação de um servidor, por protocolo TCP. Você pode iniciar um servidor com o Ratchet I/O Component Server, tendo um código que implementa o respectivo componente e poderá gerenciar todas as conexões. Site: socketo.me Projeto: github.com/ratchetphp/Ratchet
  • 17. IMPLEMENTAÇÃO DO RATCHET VAMOS CODAR! Será bem básico. ✘ 1. Dependência; ✘ 2. Implementação do servidor; ✘ 3. Gerenciador das conexões; ✘ 4. Script de conexão.
  • 19. 2. IMPLEMENTAÇÃO DO SERVIDOR ✘ RatchetServerIoServer: Cria um socket aberto para escutar uma porta específica, para conexões de entrada. Os eventos são delegados através deste para as aplicações anexadas. ✘ RatchetHttpHttpServer: Implementa os métodos da interface MessageComponentInterface e gerencia as conexões. ✘ RatchetWebSocketWsServer: Um adaptador para lidar com as requisições e respostas do websocket. Este é o mediador entre o servidor e o cliente, para lidar com as mensagens em tempo real, por intermédio de um navegador web. ✘ HermesBusinessServiceSocketService: Este será nosso gerenciador de conexões, mensagens, erros e encerramentos.
  • 20. 3. GERENCIADOR DAS CONEXÕES
  • 21. 3. REQUEST PELO SOCKET
  • 22. 4. SCRIPT DE CONEXÃO Repare o ws: Há um novo esquema de URL para conexões Websocket, existe também wss: para uma conexão Websocket usando para conexões HTTP seguras. Com isso, você pode manipular mensagens para o servidor e, ele por sua vez, repassar para outras conexões.
  • 23. MAIS INFORMAÇÕES Você pode encontrar mais informaçòes sobre o assunto no meu blog: leonardorifeli.com
  • 24. RISCOS Sim, poderão haver riscos dependendo da complexidade da aplicação e de como o servidor, o gerenciador das conexões e o script, foram implementados. Alguns riscos: ✘ Falhas de segurança na comunicação de informações privadas; ✘ Canais implementados incorretamente; ✘ Conexões simultâneas e queda do servidor. ✘ Entre muitos que, podem variar de acordo com a implementação.
  • 25. ALGORITMO PARA ACESSAR O CHAT E INTERAGIR ✘ PEGUE O SEU NOTEBOOK/CELULAR/TABLET/GELADEIRA; ✘ AUMENTE O VOLUME; ✘ CONECTE-SE NA REDE WIFI LOCAL; ✘ ABRA SEU NAVEGADOR (NÃO USE O OPERA MINI); ✘ ACESSE O ENDEREÇO: http://192.168.0.204/tag/chat; ✘ COLOQUE SEU NOME - SELECIONE A SALA 1; ✘ VOCÊ PODE ENVIAR MENSAGENS PARA AS PESSOAS E BUZINAR PARA ELAS.
  • 26. SHOW ME THE CODE VAMOS AO CÓDIGO E EXEMPLOS
  • 27. RESUMO O que vimos até agora: ● O que é Websocket; ● Para que serve; ● Sobre HTTP; ● Suporte dos navegadores; ● Sobre o Ratchet; ● Exemplo divertido; ● Riscos.
  • 28. CONCLUSÃO Sempre que precisar de uma conexão quase em tempo real de baixa latência entre o cliente e o servidor, você terá que implementar Websocket. Isso pode envolver a reformulação do modo como você desenvolve as aplicações de servidor com um novo foco em tecnologias como filas de eventos.
  • 29. AGRADECIMENTOS ✘ A TAG POR ACEITAR A PALESTRA E CEDER O ESPAÇO ✘ TODA A GALERA QUE AJUDOU A ORGANIZAR ✘ O LUIZ E FERNANDO PELO AUXÍLIO TÉCNICO ✘ VOCÊS PELO INTERESSE ✘ E AO LEONARDO PELA PALESTRA! :D
  • 30. OBRIGADO! Dúvidas? Vocês podem me contactar por: ✘ Twitter: @leonardorifeli ✘ E-mail: leonardorifeli@gmail.com ✘ Blog: leonardorifeli.com