隐藏内容以防止在JavaScript制作的游戏中作弊

时间:2017-07-19 21:45:20

标签: javascript html5 canvas hide secure-coding

我知道完全阻止用户欺骗和/或破解网络应用程序是不可能的,但我发现这个漏洞很容易被发现它应该被插上。

https://mcthompsonatl.github.io/

我实际上没有对此进行编码。我得到了这个非常基本的&#34;找到所有6个对象&#34; (在这种情况下,键)猜测游戏,一名前雇员,他不是一个贸易程序员,为我们的一个客户写了促销。逻辑是合理的,它需要一些格式化工作,但是在开发人员模式下测试时,我花了很少的时间才发现只需检查{{1} {{1} <div>就可以轻松赢得游戏} .class。因为这是用于促销比赛,我一直试图想办法隐藏或更改破坏游戏的代码,以便在开发者模式下检查任何卡片时不会显示任何提示

我能找到的一个解决方案是将卡元素更改为多个HTML5 Canvas元素。两个问题是1.我没有使用Canvas和2的经验。即使我这样做,这似乎是一个非常漫长而痛苦的任务,我不确定我是否会被允许我需要学习的时间足以解决问题。这可以用PHP隐藏吗?我在这里找到一个合理的解决方案有点难过。任何帮助表示赞赏。

1 个答案:

答案 0 :(得分:1)

评论太长了。

基于我对游戏的理解。你有36个盒子,你需要点击随机盒子。如果你点击正确方框的X数字,你就赢了。

我可以通过检查HTML并搜索指示获胜密钥的图像来作弊。图片名称为images/keytowin/frontImage.png

解决方案可能是不预先指定指示&#34;正确&#34;选择HTML div。相反,只有在点击图像后才分配图像。这将使得更难找到,因为单独的HTML不会放弃它。

这里的想法是Random。使用Javascript,在1到36之间生成3个随机数。这三个随机数表示获胜框。如果用户单击一个框,并且它具有相同的编号(我注意到div编号为data-id="1"),则使用JS在运行中添加内部div的图像。

然而,三个随机数将在游戏开始时确定。因此,模糊变量很重要。

我提供了一个示例代码来演示这个概念。

&#13;
&#13;
var luckyNumbers = getUniqueNumbers();
var winImg = "<img  src='https://mcthompsonatl.github.io/images/keytowin/frontImage.png' alt='X LOGO'>";
var loseImg = "<img  src='https://mcthompsonatl.github.io/images/keytowin/TryAgain.png' alt='X LOGO'>";

console.log(luckyNumbers);

$(".card").on("click", function() {

  if (!$(this).hasClass("clicked")) {
    $(this).addClass("clicked");

    selected = Number($(this).attr("data-id"));
    if (luckyNumbers.indexOf(selected) > -1) {
      //code to put a key image     
      $(this).find(".back").append(winImg);
    } else {
      console.log("wrong: " + selected);
      //code to put not-winning image     
      $(this).find(".back").append(loseImg);
    }

  }

});



function getUniqueNumbers() {
  var arr = []
  while (arr.length < 3) {
    var someRand = Math.ceil(Math.random() * 36)
    if (arr.indexOf(someRand) > -1) continue;
    arr[arr.length] = someRand;
  }
  return arr;
}
&#13;
img {
  width: 50px;
}
&#13;
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta content="width=device-width" name="viewport">
  <title>JS Bin</title>
</head>

<body>
  <div class="game">


    <div class="card" data-id="5">
      <div class="inside">
        <div class="front">
          <img src="image/someimage.jpg" alt="keytowin">
        </div>
        <div class="back">
        </div>
      </div>
    </div>

    <div class="card" data-id="6">
      <div class="inside">
        <div class="front">
          <img src="image/someimage.jpg" alt="keytowin">
        </div>
        <div class="back">
        </div>
      </div>
    </div>


    <div class="card" data-id="7">
      <div class="inside">
        <div class="front">
          <img src="image/someimage.jpg" alt="keytowin">
        </div>
        <div class="back">
        </div>
      </div>
    </div>


  </div>
  <script src="https://code.jquery.com/jquery-2.2.4.js">
  </script>
</body>

</html>
&#13;
&#13;
&#13;