Socket.emit()不发送数据

时间:2019-02-16 05:00:06

标签: node.js socket.io

我正在做一个游戏,并且我想在客户端和服务器之间发送数据。我从一个教程开始就弄清楚了如何做到这一点,但是,即使我完全像以前一样复制了socket.emit代码以发出变量op1,也没有任何反应。

//server

var express = require('express');
var app = express();
var serv = require('http').Server(app);

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

serv.listen(2000);
console.log('Server started.');

var optypes = [Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6)]

var op1 = [450, 600, optypes[0]];

function OpSend () {
	io.sockets.emit('operations', op1);
}
 
var io = require ('socket.io')(serv,{});

setInterval(function() {
		
		OpSend();
	
		var pack = [];
    
		for(var i in PLAYER_LIST) {
			var player = PLAYER_LIST[i];
			player.updatePosition();
			pack.clear();
			pack.push({
				x:player.x,
				y:player.y,
				number:player.number
			});
			
		}
		
		for(var i in SOCKET_LIST) {
		var socket = SOCKET_LIST[i];
		socket.emit('newPositions', pack);
		
		
		}
   },1000/500);
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script>
//client

	var ctx = document.getElementById("ctx").getContext("2d");
	ctx.font = '30px Arial';
	
	var socket = io();

	var fakeX;

	var op1 = {
		x: 100,
		y: 100,
		type: 0
	};
	
	
	function drawCanvas() {
		drawBoard();
		drawColors();
		drawOperations();
		drawRestrictions();
	}
	


	function drawOperations() {
		ctx.fillStyle = "red"
		ctx.beginPath();
		//ctx.rotate(180*Math.PI/180);
		ctx.fillText("U", op1.x-20, op1.y);
	}

	

	socket.on('newPositions',function(data) {
		drawCanvas();
		for(var i = 0; i < data.length; i++) {
			ctx.fillStyle = "black";
			ctx.fillText(data[i].number, data[i].x, data[i].y);
		}
	});
  
function checkOP() {
	console.log("checked")
	socket.on('operations', function(data) {
		//fakeX = data;
		console.log("got it");
	});
}

	setInterval(function(){
		checkOP();
	}, 1000/500)

	
</script>

当我发出“ newPositions”时,一切都按计划进行了,但是在“操作”中却似乎没有通过,怎么办?不发送吗?是否没有收到?我在这方面还很陌生,因此可以提供任何帮助。

1 个答案:

答案 0 :(得分:0)

您正在调用不需要在setInterval中一遍又一遍定义套接字的函数。您需要像配置socket.on一样静态配置newPositions

//server

var express = require('express');
var app = express();
var serv = require('http').Server(app);

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

serv.listen(2000);
console.log('Server started.');

var optypes = [Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6), Math.floor(Math.random()*6)]

var op1 = [450, 600, optypes[0]];

function OpSend () {
	io.sockets.emit('operations', op1);
}
 
var io = require ('socket.io')(serv,{});

setInterval(function() {
		
		OpSend();
	
		var pack = [];
    
		for(var i in PLAYER_LIST) {
			var player = PLAYER_LIST[i];
			player.updatePosition();
			pack.clear();
			pack.push({
				x:player.x,
				y:player.y,
				number:player.number
			});
			
		}
		
		for(var i in SOCKET_LIST) {
		var socket = SOCKET_LIST[i];
		socket.emit('newPositions', pack);
		
		
		}
   },1000/500);
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script>
//client

	var ctx = document.getElementById("ctx").getContext("2d");
	ctx.font = '30px Arial';
	
	var socket = io();

	var fakeX;

	var op1 = {
		x: 100,
		y: 100,
		type: 0
	};
	
	
	function drawCanvas() {
		drawBoard();
		drawColors();
		drawOperations();
		drawRestrictions();
	}
	


	function drawOperations() {
		ctx.fillStyle = "red"
		ctx.beginPath();
		//ctx.rotate(180*Math.PI/180);
		ctx.fillText("U", op1.x-20, op1.y);
	}

	

	socket.on('newPositions',function(data) {
		drawCanvas();
		for(var i = 0; i < data.length; i++) {
			ctx.fillStyle = "black";
			ctx.fillText(data[i].number, data[i].x, data[i].y);
		}
	});
  
	socket.on('operations', function(data) {
		//fakeX = data;
		console.log("got it");
	});


	
</script>