不能与socket.io

我在socket.io和节点JS begining沟通的NodeJS服务器和客户端之间的我的数据。我正在试图制作一款多人游戏“摇滚纸剪刀”。这里是我的server.js不能与socket.io

var app = require('express')(), 
server = require('http').createServer(app) 
io = require('socket.io').listen(server), 
fs = require('fs'); 

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

function GameServer(){ 
this.p1 = "" 
this.p2 = ""; 
this.choice1 = ""; 
this.choice2 = ""; 
this.countPlayer = 0; 
} 

GameServer.prototype = { 
addPlayer: function(player){ 
    if(this.countPlayer < 1) 
     this.p1 = player.name; 
    else 
     this.p2 = player.name; 
}, 
addChoice: function(player){ 
    if(this.p1 == player.name) 
     this.choice1 = player.choice; 
    else if(this.p2 == player.name) 
     this.choice2 = player.choice; 
}, 
getData: function(data){ 
    //var gameData = {}; 
    if(this.p1 =="") 
     this.p1 = data.p1; 
    else if(this.p1 !="" && this.p2=="") 
     this.p2 = data.p2;   
    if(this.choice1 =="") 
     this.choice1 = data.choice1; 
    else if(this.choice1 !="" && this.choice2=="") 
     this.choice2 = data.choice2; 
} 
} 

var game = new GameServer(); 

/* Connection events */ 
io.on('connection', function(client) { 
client.on('ClientInfoGame', function(player){ 
    console.log('User '+player.name+' connected'); 
    console.log('he chose '+player.choice); 
    game.getData(player); 
}); 
console.log("on passe au emit") 
client.emit('ServerInfoGame', {p1:game.p1,p2:game.p2,choice1:game.choice1,choice2:game.choice}) 
}); 

server.listen(8888);

这里是我的index.html和我的javascript代码

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <title>Super Chat temps réel !</title> 
     <style> 
      #zone_chat strong { 
       color: white; 
      background-color: black; 
      padding: 2px; 
     } 
    </style> 
</head> 
<body> 
    <h1>JANKEN GAME</h1> 
    <form action="/" method="post"> 
     <input type="submit" id="r" value="Rock" /> 
     <input type="submit" id="p" value="Paper" /> 
     <input type="submit" id="s" value="Sissor" /> 
    </form> 
    <h2 class="result"> Make a choice</h2> 
    <section id="zone_chat"> 
    </section> 
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script> 
    <script src="/socket.io/socket.io.js"></script> 
    <script> 
    function player(nom,choix,socket){ 
     this.name=nom; 
     this.choice = choix; 
     this.opponentChoice="" 
     this.socket=socket 
    } 
    player.prototype.sendDataToServer = function() { 
     //we send data from client to server 
     //var data = this; 
     this.socket.emit("ClientInfoGame",{name:this.name,choice:this.choice}); 
    }; 
    player.prototype.getDataFromServer = function() { 
     //we get data from server 
     this.socket.on("ServerInfoGame",function(dataFromServer){ 
      var data = dataFromServer; 
      if(data.p1 == this.name) 
       this.opponentChoice = data.choice2; 
      else if (data.p2 == this.name) 
       this.opponentChoice = data.choice1; 
     }) 
    }; 
    player.prototype.winnerIs = function() { 
     console.log("opponnent choice ..."+ this.opponentChoice) 

     if(this.choice == "Rock" && this.opponentChoice == "Rock" || this.choice == "Paper" && this.opponentChoice == "Paper" || this.choice == "Sissor" && this.opponentChoice == "Sissor") 
      return "Draaaaww , try again"; 
     else if(this.choice == "Rock" && this.opponentChoice == "Sissor" || this.choice == "Paper" && this.opponentChoice == "Rock" || this.choice == "Sissor" && this.opponentChoice == "Paper") 
      return " YOU WIIIIIINNN "; 
     else if(this.opponentChoice == "Rock" && this.choice == "Sissor" || this.opponentChoice == "Paper" && this.choice == "Rock" || this.opponentChoice == "Sissor" && this.choice == "Paper") 
      return " YOU LOOOOOOSE "; 
    }; 
    function end(p){ 
     $('h1.result').empty(); 
     $('h1.result').text(p.winnerIs()).html(); 
    } 

     var choice = ""; 
     $('#r').on('click', function(){choice = "Rock"; p.choice = choice;}) 
     $('#p').on('click', function(){choice = "Paper"; p.choice = choice;}) 
     $('#s').on('click', function(){choice = "Sissor"; p.choice = choice;}) 
     var pseudo = prompt('What's your name?'); 
     // Connexion à socket.io 
     var socket = io.connect('http://localhost:8888'); 
     var p = new player(pseudo,choice,socket); 
     //document.title = pseudo + ' - ' + document.title; 
//   socket.emit('choice', choice) 
     //socket.emit("infoPlayer",p) 
     p.sendDataToServer(); 
     p.getDataFromServer();    
     end(p); 
    </script> 
</body>

在我的客户端（浏览次数index.html）我创建了一个播放器对象与名称和选择属性（岩石，纸张或剪刀）。当一个按钮玩家点击它的变化选择值，然后其发送玩家对象到服务器。

在我的服务器端，我从每个客户的价值，将其添加到我的游戏服务器对象，并将其发送给所有的客户，然后客户端将采用游戏的逻辑来决定谁赢还是输。

当我与用户连接时，我的服务器上收到日志消息，但我在浏览器中收到了此消息。 “无法POST /”。我不知道为什么我得到这个和我的服务器我的游戏服务器属性是空的，我不明白为什么我从客户端发出的数据不会保存在我的服务器。

你有什么想法吗？

来源

2017-02-23 user3525616

当我与用户连接时，我的服务器上收到日志消息，但我在浏览器中收到了此消息。 “无法POST /”。我不知道为什么我得到这个

错误"Cannot POST /"来自您的窗体中的提交按钮。当在表单中按下提交按钮时，默认行为是将表单发布到操作URL。由于这不是你想要的，你有几种方法来解决这个问题。首先，如果您无意发布表单，那么您可以完全删除<form>标签，并将按钮更改为常规<button>元素。然后，就会因为按下按钮而没有默认的帖子。

你也可以离开HTML喜欢它，只是避免默认的职务行为。你将不得不以防止您的三个单击处理的这样的默认行为：

$('#r').on('click', function(e){ 
    // prevent default post of form 
    e.preventDefault(); 
    choice = "Rock"; 
    p.choice = choice; 
});

我不明白为什么我从客户端发出的数据不会保存在我的服务器。

我没有看到您实际上将任何数据发送到您的服务器。您正在呼叫：

p.sendDataToServer();

这将发送p.choice到您的服务器。但是，之前的任何值被设置成任何choice或p.choice这个函数调用发生。这些值仅在用户单击按钮时设置。同时，在点击任何按钮之前，您已经调用了p.sendDataToServer()。 .on()创建事件处理程序。这些事件处理程序将在用户点击按钮时的某个时候被调用。同时，其余的代码继续运行。

同样，您致电p.getDataFromServer()只是安装事件处理程序来侦听将来可能从服务器发送的数据。它实际上并没有在那个时间点获得任何数据。

看起来您需要一些关于事件驱动系统如何工作的入门知识。您设置事件处理程序，然后有时在将来调用其中一个事件处理程序时，然后在事件处理程序回调中执行一个操作。

来源

2017-02-23 05:19:20 jfriend00

谢谢你的回答。你是对的，我不习惯处理。我会做更多的研究。 :) – user3525616

不能与socket.io

回答

相关问题