防止用户发送垃圾邮件 - Jquery Append

Question

如何防止用户发送垃圾邮件？比如，如果用户一次又一次快速快速地进入 cmets，如何防止他？

JS Fiddle

HTML：

<p>
  <a href="javascript:void(0);" class="add_more">Add More</a>
</p>

<table border="0" width="500" cellspacing="0">
  <tbody class="append_data"></tbody>

  <tr>
    <td> 
      <textarea name="description" id="description"></textarea>
    </td> 
  </tr> 

</table>  

CSS：

#description{
  width:400px;    
}

.description_text{
  border:#333333 solid 1px;
  width:400px !important;
}

.append_data{
  white-space: pre-wrap;      /* CSS3 */   
  white-space: -moz-pre-wrap; /* Firefox */    
  white-space: -pre-wrap;     /* Opera <7 */   
  white-space: -o-pre-wrap;   /* Opera 7 */    
  word-wrap: break-word;      /* IE */
}

jQuery：

$('.add_more').click(function(){
    var description = $('#description').val();
    $(".append_data").append('<div class="description_text">'+description+'</div><br><br>');
  });

Answer 1

如果是人类放入垃圾邮件cmets，那么使用set-timeout之类的功能或使用jQuery Debounce之类的插件，设置为60秒，让人们感到沮丧。

假设，如果你只是在做“速率限制”而不是垃圾邮件，那么上面的解决方案就可以了（有助于“聊天室”之类的行为），以防止人们喜欢

一个

b

c

d

e

发布...

它仍然没有使用服务器端那么强大，但它可以让你达到一半。

但如果它是垃圾邮件机器人，您可以使用一些不同的技术，设置超时不会这样做（因为他们可以每天 24 小时在您的网站上敲击而不会出现问题）。首先，正如一些人所指出的，服务器端验证。他们发出 AJAX 请求，您的服务响应，您检查他们的个人资料，并使用上次发布的变量，检查当前时间。如果当前时间 - 上次发布时间

.done(function(data) {
  if(data.timeoutCode == 1) {
    $.append("You can't post again so quickly");
  }})

您还可以使用一种非常古老的 hacky 技术来添加垃圾邮件机器人通常会填写的额外字段......就像

<input type="text" name="location" style="display:none"></input>

而垃圾邮件机器人是盲目的，他们会填写所有字段，认为他们会在服务器响应中得到失败的回复。但是，在 javascript 方面，当您提交时，请检查您的 onclick 按钮是否 $("input[name='location']).val().length > 0... 如果长度大于 0，它会忽略该请求（并在服务器端也为您节省一些精力），普通用户不会触摸它，因为该字段将被隐藏并且无法填写它。但那是如果他们只是使用可用的 POST 功能，客户端验证仍然会失败，然后您还必须使用服务器端验证来备份它。

确实没有万无一失的解决方案来提供客户端垃圾邮件解决方案...您可以在客户端提供帮助。

编辑：Archer 提出了一个不错的观点。

我的意思是，用例也很奇怪，但是，您可以在发布帖子之前使用 event.which 来确定用户是否点击了按钮（或使用了 enter 或其他），并且只有当他们点击了然后，您只能向发表评论的特定用户显示他们确实按下/单击了提交，而不是使用自动化进行提交。但这带来了一个奇怪的用例：如果你使用 jQuery.append，你只会影响当前会话的视图，除非它是通过服务器路由的，如果它是通过服务器路由的，你应该只是在服务器端检查它...

Answer 2

我使用了一个 sessionStorage 变量并设置了一个间隔。这使得您在添加内容后 60 秒内无法单击添加更多按钮

http://jsfiddle.net/vMcEE/

`sessionStorage.timer = 0;
  setInterval(function(){if (sessionStorage.timer > 0) {sessionStorage.timer--}},1000);
  $('.add_more').click(function(){
                         if (sessionStorage.timer == 0){
                             sessionStorage.timer += 30
                        var description = $('#description').val();
                        $(".append_data").append('<div class="description_text">'+description+'</div><br><br>');
                         }
                         });`

Answer 3

这个怎么样...

http://jsfiddle.net/7jE9p/2/

当你点击它时，我已经让它隐藏了“添加更多”链接 10 秒...

$('.add_more').click(function() {
    var description = $('#description').val();
    $(".append_data").append('<div class="description_text">'+description+'</div><br><br>');
    var $this = $(this);
    $this.hide();
    setTimeout(function() {
        $this.show();
    }, 10000);
});

Answer 4

你可以尝试在每次有人单击添加按钮时将 + 1 添加到变量中，并且 setInterval 将使变量 = 0 每 n 秒