Question

我有一个upvote按钮，用户可以按下该按钮并进行投票。再次单击此按钮，投票将被取消。

所以每次按下此按钮都会进行数据库写入。如果在此按钮上连续使用自动闪烁，则会发生连续的DB调用。我想阻止这个。我该怎么办？

PS。当点击upvote按钮时，我向后端发送ajax查询（运行Django）。

Answer 1

你真的想在服务器上查看这个，所以如果有人禁用了javascript就无所谓了。

如果你正在使用PHP，一个选项是设置投票之间的时间限制。例如，每分钟只允许一次投票。

因此，在每次投票时，将投票时间存储在会话变量中，如果在时间限制内，则忽略后续投票：

//on vote
$now=date('U');
if(!isset($_SESSION['lastvote']) || $now - $_SESSION['lastvote']<LIMIT){
    $_SESSION['lastvote']=$now;
    // do database call

}else{
    //throw error
}

Answer 2

最简单的方法可能是在单个操作运行时禁用按钮。

要获得这个，假设你使用JQuery ajax请求来调用“upvote”/“downvote”方法，你只需要：

$("#upvoteButton").click(function)
{
    $("#upvoteButton").attr("disabled");
    $.ajax({
      url: 'url/upvote.extension',
      success: function(data) {
        $("#upvoteButton").removeAttr("disabled");
      }
    });
}

这样就可以发送单个请求。每个标签/窗口解析。

Answer 3

如果您信任您的用户接受cookie，您可以将点击与对象ID和时间戳一起存储在会话中，并测试用户是否在最近n秒内点击了投票按钮。

您还可以使用javascript禁用网页上的投票按钮，并在n秒后再次启用它以撤消投票。

这两项建议都取决于使用启用了javascript或启用Cookie的浏览器的用户。

如果您必须考虑机器人，只需将网址重复发送到服务器，您需要采取不同的方法 - 例如检查当前ip地址是否在最近n秒内调用了url并引发了403 Forbidden http错误或其他内容。

Answer 4

如果你可以使用setTimeout，你可以尝试这样的事情：

var toggleVote = (function () {
  var voted = false,timeout;
  return function () {
     if( timeout )
       clearTimeout(timeout)

     voted = !voted

      timeout = setTimeout(function() {
        console.log("Ajax call - vote : " + voted)
      },400)
    }
  })()

document.getElementById("vote").addEventListener("click",toggleVote)

以JSBin

为例

尝试捣碎“点击我”div

Answer 5

简单方法：

<button id="upvote" onclick="upvote(this)">Up</button>

<script>
   var upvote = function(x){
      $(x).removeAttr('onclick'); //if you click this button again, it will do nothing

      //call ajax to do something here...
      //...............
      //after finishing, add attribute onclick to the button
      $(x).attr('onclick', 'upvote(this)')
   };
</script>

如何防止upvote / downvote按钮的Autoclick Spam？

5 个答案: