2017-07-28 4 views
0

私はこのシンプルなtic-tac-toeアプリで作業しています。プレーヤーがボタンを押すたびに、markTheCell(button)がボタンのidを渡します。この関数は、文字列値であるプレーヤとボタンIDをサーバに送出します。有効な値が渡されているかどうかを確認するためにコンソールページにコンソールログを記録します。しかし、サーバーにログインしようとすると、プレーヤーの値はオブジェクトObjectになり、ボタンのidは未定義です。パラメータを正しく設定して使用する方法に失敗したかどうかはわかりません。私はこれに固執しているので、誰かが助けを捧げることを願っています。ExpressのSocket.ioはクライアントから未定義のデータを受け取る

index.htmlを

<body> 
     <div class="col-lg-4"></div> 
     <div class="col-lg-4 jumbotron"> 
      <h4>You are player <span id="name"></span></h4> 
      <button id="one" onclick="markTheCell(this.id)" class="btn btn-default"></button> 
      <button class="btn btn-default"></button> 
      <button class="btn btn-default"></button></br> 
      <button class="btn btn-default"></button> 
      <button class="btn btn-default"></button> 
      <button class="btn btn-default"></button></br> 
      <button class="btn btn-default"></button> 
      <button class="btn btn-default"></button> 
      <button class="btn btn-default"></button> 
     </div> 
     <div class="col-lg-4"></div> 
    </div> 

    <script src="/socket.io/socket.io.js"></script> 
    <script> 
     var socket = io(); 
     var player = ""; 
     $(document).ready(function() { 

      socket.on('player', function (playerNo) { 
       player = playerNo; 
       $('#name').text(playerNo); 
      }); 

      socket.on('hitAMark', function (player, button) { 
       console.log("in client hit a mark player "+ player); 
       console.log("in client hit a mark button "+ button); 
       $(button).text(player); 
      }); 
     }) 
     function markTheCell(button) { 
      socket.emit('mark', {player,button }); 
      console.log("in markTheCell client hit a mark player "+ player); 
       console.log("in markTheCell client hit a mark button "+ button); 
     } 
    </script> 
</body> 

index.js

var player = 0; 
io.on('connection', function(socket){ 
    if(player==0){ 
     player++; 
     socket.emit('player', "X"); 
     console.log("Player "+ player +" is connected"); 
    }else if(player==1){ 
     player++; 
     socket.emit('player', "O"); 
     console.log("Player "+ player +" is connected"); 
    } 

    socket.on('disconnect', function(){ 
     console.log('A user is disconnected'); 
    }); 


    socket.on('mark', function(player, button){ 
     console.log("in server hit a mark button "+ player); 
      console.log("in server hit a mark player "+button); 

     io.emit('hitAMark', {player,button}); 
    }); 
}); 


http.listen(3000, function(){ 
    console.log('Server is listening on port 3000!'); 
}); 

ブラウザとCMDにおけるコンソールのスクリーンショット: enter image description here

enter image description here

+0

[オブジェクトオブジェクト]は通常、オブジェクトを文字列として印刷しようとしていることを意味します。文字列からオブジェクトに変換するオブジェクトを受け取った後にJSON.parse()を使用してください。 –

+0

サーバー上のconsole.logには、テキストボタンと可変のプレーヤーがあり、その逆もあります。小さな混乱。 – Myonara

答えて

1

の代わりに{player:player,button:button}を発光してみてください。それは働くことができるかもしれません。

関連する問題