最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

Socket.emit()不发送数据

运维笔记admin10浏览0评论

Socket.emit()不发送数据

Socket.emit()不发送数据

我正在制作游戏,我想在客户端和服务器之间发送数据。我开始用一个教程来弄清楚如何做到这一点,但是,即使我复制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=".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>
回答如下:

您正在调用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>

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论