我想创建一个琐事游戏,其中2个用户回答问题,然后在最后宣布获胜者。我正在使用socket.io
接收答案。为什么这个socket.io服务器不响应我的客户端程序?
我的问题是我的server.js
无法正常工作。看起来按下按钮时功能allUsershaveAnswered
没有响应。我也收到一个错误Failed to load resource: the server responded with a status of 404 (Not Found)
。我在寻找寻找困难问题的所在
$(function(){
var socket =io();
$('#userIdForm').submit(function() {
console.log($('#userIdForm').val());
socket.emit('new user', $('#userIdInput').val());
$(gameDiv).show();
$(logInDiv).hide();
return false;
});
// in game div a series of question are displayed
$('#questionForm').submit(function() {
socket.emit('answer' , $('#answeredInput').val());
$('#guessForm').hide();
$('#questionForm').show();
return false;
});
// this is called when all users have answered the question
socket.on('allUsersHaveAnswered', function (msg) {
$('#resultsDiv').append("The answer was:" + msg.answer + "<br>Winner:"+ msg.winner);
$('#waitingDiv').hide();
$('#resultsDiv').show();
});
});
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font: 13px Helvetica, Arial;
}
form {
background: #000;
padding: 3px;
position: fixed;
bottom: 0;
width: 100%;
}
form input {
border: 0;
padding: 10px;
width: 90%;
margin-right: .5%;
}
form button {
width: 9%;
background: rgb(130, 224, 255);
border: none;
padding: 10px;
}
#messages {
list-style-type: none;
margin: 0;
padding: 0;
}
#messages li {
padding: 5px 10px;
}
#messages li:nth-child(odd) {
background: #eee;
}
<!doctype html>
<html>
<head>
<title>Socket.IO chat</title>
<link rel="stylesheet" href="master.css">
</head>
<body>
<div id="logInDiv">
<h1>Create an Username</h1>
<form id="userIdForm" action="">
<input id="userIdInput" autocomplete="off" /><button>Send</button>
</form>
</div>
<div id="gameDiv" hidden>
<h1 id="info">Answer the General Knowlegde Question</h1>
<h2 id="info2">Once the other player has answered, you will find out who won!</h2>
<p>Who won the English Premeier League this year?</p>
<form id="questionForm" action="">
<input id="answeredInput" autocomplete="off" /><button>Send</button>
</form>
<div id='waitingDiv' hidden>
<p>Waiting for answers</p>
</div>
<div id='resultsDiv' hidden>
</div>
</div>
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="./socket.io/socket.io.js"></script>
<script src="/main.js"></script>
</body>
</html>
这是在服务器上运行:
// server
var express = require('express');
var app = express();
var server = require('http').createServer(app);
var io = require('socket.io')(server);
var port = process.env.PORT || 3000;
server.listen(port, function() {
console.log('Server listening at port %d', port);
});
//Routing
app.use(express.static(__dirname + '/public'));
// this is the answer
var answer = "chelsea";
var guessedanswers = {};
io.on("connection", function(socket) {
socket.on('new user', function(id) {
socket.userId = id;
});
socket.on('guess', function(guess) {
guesses[socket.userId] = parseInt(guess);
var numAnswers = Object.keys(guessedanswers).lenght;
console.log("we've gotten: " + numAnswers + " guesses");
if (numAnswers >= 2) {
var winner = "";
for (var userId in guessedanswers) {
var guess = guesses[userId];
if (guess == answer) {
winner = userId;
}
}
io.emit('allUsersHaveAnswered', {
winner: winner,
answer: "chelsea"
});
}
});
});
可能是什么原因,怎么要解决这个问题?
你的404具体说什么,你可以更详细吗?你的客户端在哪里发出“猜测”?你是否尝试过用'socket.broadcast.emit(...)'来代替'io.emit(...)' – urbz