如何防止网页游戏作弊?

时间:2012-02-27 10:29:53

标签: jquery html5 css3 jquery-animate html5-canvas

我已经在这个论坛上经历了其他网页游戏作弊问题,但我没有得到我的问题的答案,这就是为什么我在相似的标题下发布它。

问题在于:

我正在开发一个基于网络的游戏,其中使用简单的html在网页上显示三个类似的框。

<img src="box.jpg" />
<img src="box.jpg" />
<img src="box.jpg" />

现在使用jquery.path插件我在随机路径上旋转这些框,并且根据动画结尾的游戏要求,用户需要通过点击三个框来识别中间框的位置。 / p>

但是如果用户使用firebug或chrome web开发工具,那么只需检查dom的元素,他/她就可以轻松识别中间盒的位置。

所以请给我建议解决这个问题。

P.S。

我主要使用简单的jquery动画,因为我想让游戏兼容旧浏览器,所以在我的情况下使用canvas或css3动画会更好吗?他们会解决这种作弊问题吗?

1 个答案:

答案 0 :(得分:3)

尝试考虑使用javascript闭包。尽管可以通过JS调试器进行跟踪,但学习使用调试器将是一种更高级别的知识,而不仅仅是窥视源代码或DOM树。

构建一个具有私有范围的对象。使用该对象,创建您需要的3个图像。将这3个图像分配给该对象中的3个私有变量。只有那个对象知道哪个图像是哪个。你甚至不需要区分它的属性,因为你可以使用这3个私有变量在对象中跟踪它们。

在我的例子中,我正在使用可查看的$ .data()。虽然他们可以知道框的ID,但是他们不知道闭包内target变量的值。

考虑随机化target值,并在中间放置具有该值的任何框。这样,他们就不会一直跟踪同一个盒子。

var game = (function(){

    //set which box is the target
    //they will never know this value
    //i sugest including this in randomizing
    var target = 1;

    //storage variable for the boxes
    var boxes = {};

    //retrieve data stored and check with target
    var check = function(element){
        var boxID = $(element).data('boxID');

        //check if a match
        if(boxID === target){
            alert('got me!');
        } else {
            alert('not me!!!');
        }

    }

    //create 3 boxes and store them in boxes object
    for(var i = 0; i < 3 ; i++){

         //create box HTML and store it in a variable
         //notice that all boxes will have this very same HTML
         var box = $('<img src="box.jpg" />');

         //store the box identifier using $.data()
         //at least in this manner, you are not storing 
         //the id as an attribute
         box.data('boxID',i);

         //if your plugin looks like "element.path()"
         //plug it to every box created
         box.path({
             options:value....
         });

         //add handler for checking
         box.on('click',function(){
             check(this);
         });

         //store in the private variable
         boxes['box'+ i] = box

         //append box to the display, in this case, the body.
         $('body').append(box);
    }

    //your "pathing" function
    var randomize = function(){
        //do your random path stuff here
        //access boxes using: boxes.box1, boxes.box2 and so on...
        //they are jQuery objects already so you can use jQuery functions on them
    };

    //return public accessible methods and functions
    return {
        randomize : randomize //expose the randomize function
    }

}());

在此之后,只需致电game.randomize()来执行您的路径(因为只有随机化可在代码中公开获得)

tried logging game对象以及div,没有真实target的迹象。