Quero mudar a conexão do meu jogo de WebSockts pra Requisições https, Ajax.

1. Quero mudar a conexão do meu jogo de WebSockts pra Requisições https, Ajax.

Adriano de Oliveira Maia
adrianomaia12

(usa Kali)

Enviado em 28/03/2017 - 15:24h

Olá pessoal.
Estou fazendo um trabalho da faculdade que compara uma conexão Websockts com a simples http do tipo Ajax. fiz aplicação com WS só que estou tentando mudar pra requisições http para compara.
A aplicação é simples, numa pagina fica um objeto e em outra um controle que movimenta em tempo real esse objeto, estou utilizando node.js. alguém pode me ajuda a fazer essa mesmo coisa só com requisições http do tipo Ajax?
Aquivo server.js
var express = require('express');
var app = express();
var http = require('http').Server(app);
var io = require('socket.io')(http);
var port = 3001;

app.use(express.static('./static'));

app.get('/', function(req, res){
res.sendFile(__dirname + '/static/index.html');
});

app.get('/controle', function(req, res){
res.sendFile(__dirname + '/static/controle.html');
});

io.on('connection', function(socket){
socket.on('sendPosition', function(positions){
io.emit('setPosition', positions);
});
});

http.listen(port, function(){
console.log('listening on *:' + port);
});

Arquivo index.html
<html>
<head>
<title>Car Teste</title>
<style>
#myDiv{
position: absolute;
width: 100px;
height: 100px;
background-color: red;
}
</style>


<!--div id="myDiv"></div-->

<img src="Car.png" id="myDiv" />

<script src="//cdn.socket.io/socket.io-1.7.3.js"></script>
<script>
var myDiv = document.getElementById('myDiv');
function setPosition(positions){
myDiv.style.left = `${positions.x}px`;
myDiv.style.top = `${positions.y}px`;
}

var socket = io('http://10.1.1.102:3001');
socket.on('setPosition', setPosition);

</script>
</body>
</html>

e Arquivo controle.html
<!doctype html>
<html>
<head>
<title>Controle Car</title>
</head>
<body>
<center>
<button onclick="y-=10;setPosition()" ><img src="Up.png"/></button><br>
<button onclick="x-=10;setPosition()" ><img src="Left.png"/></button>
<button onclick="setPosition()" ><img src="If.png"/></button>
<button onclick="x+=10;setPosition()" ><img src="Right.png"/></button><br>
<button onclick="y+=10;setPosition()" ><img src="Down.png"/></button>
</center>


<script src="//cdn.socket.io/socket.io-1.7.3.js"></script>
<script>
var x = 0,
y = 0,
left = 97,
up = 119,
right = 100,
down = 115;

function setPosition(){
socket.emit('sendPosition', {x, y});
}

var socket = io('http://10.1.1.102:3001');


window.addEventListener('keypress', function(event){ console.log(event.keyCode)
var keyCode = event.keyCode;
switch(keyCode){
case up: y-=10; break;
case left: x-=10; break;
case down: y+=10; break;
case right: x+=10; break;
}
setPosition();
})

</script>
</body>
</html>



  






Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts