我在Meteor中构建了一个简单的实时多人数学游戏,你可以在这里试试:http://mathplay.meteor.com
在本地玩(使用不同的浏览器)时,一切正常。但是当我和朋友一起在互联网上玩游戏时,客户经常会失去同步:一个玩家列出的活动问题实际上已经被其他玩家解决了。
我的猜测是,一些应该只服务器的代码会在其中一个客户端上执行。有关如何调试此行为的任何建议吗?
以下是用户提交答案时客户端上发生的情况:
Template.number_input.events[okcancel_events('#answertextbox')] = make_okcancel_handler({
ok: function (text, event) {
question = Questions.findOne({ order_number: Session.get("current_question_order_number") });
if (question.answer == document.getElementById('answertextbox').value) {
console.log('True');
Questions.update(question._id, {$set: {text: question.text.substr(0, question.text.length - 1) + question.answer, player: Session.get("player_name")}});
callGetNewQuestion();
}
else {
console.log('False');
}
document.getElementById('answertextbox').value = "";
document.getElementById('answertextbox').focus();
}
});
callGetNewQuestion()在客户端和服务器上触发:
getNewQuestion: function () {
var nr1 = Math.round(Math.random() * 100);
var nr2 = Math.round(Math.random() * 100);
question_string = nr1 + " + " + nr2 + " = ?";
question_answer = (nr1 + nr2);
current_order_number = Questions.find({}).count() + 1;
current_question_id = Questions.insert({ order_number: current_order_number, text: question_string, answer: question_answer });
return Questions.findOne({_id: current_question_id});//current_question_id;
},
完整的源代码可供参考:https://github.com/tomsoderlund/MathPlay
答案 0 :(得分:3)
你的问题在于:
callGetNewQuestion()
在客户端和服务器上触发此操作
由于时间差异,这将产生不同的_id
,以及一个不同的问题,然后将被服务器生成的问题替换。但是,情况可能并非总是如此。这使得很容易让事情变得不同步,因为你的客户正在生成自己的东西。
您需要找出一种更好的方法来确保客户端生成与服务器相同的数据。这可以通过确保随机数生成器以相同的方式播种来完成,因此每次都会给出相同的随机数。这将解决任何闪烁,因为值不同。
然后,对于实际的错误,你可能不想要这样做:
return Questions.findOne({_id: current_question_id});
但是这样做(仅在客户端上,在服务器上什么都不做):
Session.set('current_order', current_order_number); // ORDER! Not the _id / question_id.
这样,您可以将以下内容放在模板助手中:
return Questions.findOne({ order_number: Session.get('current_order') });
从本质上讲,这将在Collection上以反应方式工作,而不依赖于返回值。