29

Dev Day 2013: Push Notification + SignalR

Embed Size (px)

DESCRIPTION

Já pensou como um sistema de Push Notification de um celular funciona? Como o facebook e twitter entregam novas mensagem no seu browser sem ação do usuário? Além disso qual é a aplicabilidades desta técnica em aplicações corporativas? O objetivo desta palestra é discutir sobre o modelo de Push Notification em aplicações corporativas, para tal, utilizaremos o SignalR como framework de comunicação em tempo real explorando técnicas como Polling, Long Polling, Forever Frame e WebSockets. Se quer saber mais sobre Push Notification, comunicação em tempo real para ambientes corporativos você veio ao local correto!

Citation preview

Page 1: Dev Day 2013: Push Notification + SignalR
Page 2: Dev Day 2013: Push Notification + SignalR

[email protected]

Arquiteto Software

Tecnologias Microsoft

Bio

@walterbh

Walter DiasSI & EAS

Localiza Rent a CarVideo Game Whore

G33KLevel 26

bit.ly/1721Szi

Page 3: Dev Day 2013: Push Notification + SignalR

Agenda

ConceitosPush

TechnologyCenários

Técnicas SignalR Demo

Alternativas Conclusão Q&A

Page 4: Dev Day 2013: Push Notification + SignalR

Conhecimento é...

Page 5: Dev Day 2013: Push Notification + SignalR

...poder

Page 6: Dev Day 2013: Push Notification + SignalR

Informação

Page 7: Dev Day 2013: Push Notification + SignalR

Dados em tempo Real

Page 8: Dev Day 2013: Push Notification + SignalR

Computação em tempo real

Page 9: Dev Day 2013: Push Notification + SignalR

Computação em tempo real

A • Agressivo

B • Baixo

C •Consistente

Page 10: Dev Day 2013: Push Notification + SignalR

Push Technology

Page 11: Dev Day 2013: Push Notification + SignalR

Push Technology

Page 12: Dev Day 2013: Push Notification + SignalR

Cenários

Page 13: Dev Day 2013: Push Notification + SignalR

Cenários

Page 14: Dev Day 2013: Push Notification + SignalR

Cenários

Page 15: Dev Day 2013: Push Notification + SignalR

HTTP Normal

ServidorCliente

Page 16: Dev Day 2013: Push Notification + SignalR

Polling

Tempo

Servidor

Cliente

Page 17: Dev Day 2013: Push Notification + SignalR

Polling

setInterval(function () {$.ajax({

type: "POST",url: "URL",data: "{}",contentType: "application/json; charset=utf-8",dataType: "json",success: function (msg) {

// do something...}

});}, 10000);

Page 18: Dev Day 2013: Push Notification + SignalR

Long Polling

Tempo

Servidor

Cliente

Page 19: Dev Day 2013: Push Notification + SignalR

Long Polling

function longPolling() {$.ajax({

type: "POST",url: "URL",data: "{}",contentType: "application/json; charset=utf-8",dataType: "json",success: function (msg) {

// do something nice...},error: function (msg) {

// do something evil...},complete: function () {

longPolling(); // call again}

});}

Page 20: Dev Day 2013: Push Notification + SignalR

Server Sent Events

Servidor

Cliente

Tempo

Page 21: Dev Day 2013: Push Notification + SignalR

Server Sent Events - JS

if (!window.EventSource) {alert("Seu browser é o M$IE");

}

var source = new EventSource('stream.asp');

source.addEventListener('message', function (e) {//do something

}, false);

source.addEventListener('open', function (e) {// connection was opened.

}, false);

source.addEventListener('error', function (e) {if (e.readyState == EventSource.CLOSED) {

// connection was closed.}

}, false);

Page 22: Dev Day 2013: Push Notification + SignalR

Server Sent Events - Server

Content-Type: text/event-stream

data: {\ndata: "msg": "hello world",\ndata: "id": 12345\ndata: }\n\n

data, event, id, retry

Page 23: Dev Day 2013: Push Notification + SignalR

Forever Frame

Servidor

Cliente

Tempo

Page 24: Dev Day 2013: Push Notification + SignalR

Forever Frame

<iframe src="URL" style="visibility: hidden;">

<script>doSomething();</script>

window.parent

Page 25: Dev Day 2013: Push Notification + SignalR

Web Sockets

Servidor

Cliente

Tempo

Page 26: Dev Day 2013: Push Notification + SignalR

Web Sockets

function doSomething() {websocket = new WebSocket(URL);

websocket.onopen = function (evt) { };websocket.onclose = function (evt) { };websocket.onmessage = function (evt) { };websocket.onerror = function (evt) { };

websocket.send(message);websocket.close();

}

Page 27: Dev Day 2013: Push Notification + SignalR

SignalR

Page 28: Dev Day 2013: Push Notification + SignalR

Alternativas

Page 29: Dev Day 2013: Push Notification + SignalR