jQuery 防止机器人表单提交

Preventing bot form submission

提问by Mike

I'm trying to figure out a good way to prevent bots from submitting my form, while keeping the process simple. I've read several great ideas, but I thought about adding a confirm option when the form is submitted. The user clicks submit and a Javascript confirm prompt pops up which requires user interaction.

我试图找出一种防止机器人提交我的表单的好方法，同时保持流程简单。我已经阅读了几个很棒的想法，但我想在提交表单时添加一个确认选项。用户点击提交并弹出一个需要用户交互的 Javascript 确认提示。

Would this prevent bots or could a bot figure this out too easy? Below is the code and JSFIddle to demonstrate my idea:

这会阻止机器人还是机器人可以很容易地解决这个问题？下面是代码和JSFIddle来演示我的想法：

JSFIDDLE

JSFIDDLE

$('button').click(function () {
  if(Confirm()) {
    alert('Form submitted');
    /* perform a $.post() to php */
  }
  else {
    alert('Form not submitted');
  }
});

function Confirm() {
  var _question = confirm('Are you sure about this?');
  var _response = (_question) ? true : false;
  return _response;
}

回答by Patrick M

This is one problem that a lot of people have encountered. As user166390 points out in the comments, the bot can just submit information directly to the server, bypassing the javascript (see simple utilities like cURLand Postman). Many bots are capable of consuming and interacting with the javascript now. Hari krishnan points out the use of captcha, the most prevalent and successful of which (to my knowledge) is reCaptcha. But captchas have their problemsand are discouraged by the World-Wide Web compendium, mostly for reasons of ineffectiveness and inaccessibility.

这是很多人都遇到过的一个问题。正如 user166390 在评论中指出的那样，机器人可以直接向服务器提交信息，绕过 javascript（参见简单的实用程序，如cURL和Postman）。许多机器人现在能够使用 javascript 并与之交互。Hari krishnan 指出了验证码的使用，其中最流行和最成功的（据我所知）是reCaptcha。但是验证码有它们的问题，并且被万维网纲要所劝阻，主要是因为效率低下和不可访问性。

And lest we forget, an attacker can always deploy human intelligence to defeat a captcha. There are stories of attackers paying for people to crack captchas for spamming purposes without the workers realizing they're participating in illegal activities. Amazon offers a service called Mechanical Turkthat tackles things like this. Amazon would strenuously object if you were to use their service for malicious purposes, and it has the downside of costing money and creating a paper trail. However, there are more erhmproviders out there who would harbor no such objections.

以免我们忘记，攻击者总是可以部署人类智能来击败验证码。有报道称，攻击者花钱请人破解验证码以发送垃圾邮件，而工人却没有意识到他们参与了非法活动。亚马逊提供了一项名为Mechanical Turk的服务，可以解决此类问题。如果你将他们的服务用于恶意目的，亚马逊会极力反对，而且它有花钱和创建书面记录的缺点。然而，有更多的erhm提供者不会持有这样的反对意见。

So what can you do?

所以，你可以做什么？

My favorite mechanism is a hidden checkbox. Make it have a label like 'Do you agree to the terms and conditions of using our services?' perhaps even with a link to some serious looking terms. But you default it to unchecked and hide it through css: position it off page, put it in a container with a zero height or zero width, position a div over top of it with a higher z-index. Roll your own mechanism here and be creative.

我最喜欢的机制是一个隐藏的复选框。让它有一个标签，比如“你同意使用我们服务的条款和条件吗？” 甚至可能链接到一些严肃的术语。但是您默认将其取消选中并通过 css 隐藏它：将其放置在页面外，将其放入零高度或零宽度的容器中，在其顶部放置一个具有更高 z-index 的 div。在这里滚动您自己的机制并发挥创意。

The secret is that no human will see the checkbox, but mostbots fill forms by inspecting the page and manipulating it directly, not through actual vision. Therefore, any form that comes in with that checkbox value set allows you to know it wasn't filled by a human. This technique is called a bot trap. The rule of thumb for the type of auto-form filling bots is that if a human has to intercede to overcome an individual site, then they've lost all the money (in the form of their time) they would have made by spreading their spam advertisements.

秘诀在于没有人会看到复选框，但大多数机器人通过检查页面并直接操作来填写表单，而不是通过实际视觉。因此，带有该复选框值集的任何表单都可以让您知道它不是由人填写的。这种技术称为机器人陷阱。自动表单填充机器人类型的经验法则是，如果一个人不得不说情来攻克一个单独的站点，那么他们已经失去了通过传播他们本来可以赚到的所有金钱（以他们的时间的形式）垃圾邮件广告。

(The previous rule of thumb assumes you're protecting a forum or comment form. If actual money or personal information is on the line, then you need more security than just one heuristic. This is still security through obscurity, it just turns out that obscurity is enough to protect you from casual, scripted attacks. Don't deceive yourself into thinking this secures your website against all attacks.)

（先前的经验法则假设您正在保护论坛或评论表单。如果实际金钱或个人信息在线，那么您需要的安全性不仅仅是一种启发式方法。这仍然是通过默默无闻的安全性，事实证明默默无闻足以保护您免受随意的脚本攻击。不要自欺欺人地认为这可以保护您的网站免受所有攻击。）

The other half of the secret is keeping it. Do not alter the response in any way if the box is checked. Show the same confirmation, thank you, or whatever message or page afterwards. That will prevent the bot from knowing it has been rejected.

秘密的另一半是保守它。如果选中该框，请勿以任何方式更改响应。之后显示相同的确认，谢谢，或任何消息或页面。这将防止机器人知道它已被拒绝。

I am also a fan of the timing method. You have to implement it entirely on the server side. Track the time the page was served in a persistent way (essentially the session) and compare it against the time the form submission comes in. This prevents forgery or even letting the bot know it's being timed - if you make the served time a part of the form or javascript, then you've let them know you're on to them, inviting a more sophisticated approach.

我也是计时方法的粉丝。您必须完全在服务器端实现它。跟踪以持久方式提供页面的时间（主要是会话）并将其与提交表单的时间进行比较。这可以防止伪造甚至让机器人知道它正在计时 - 如果您将服务时间作为表单或 javascript，那么你已经让他们知道你正在关注他们，邀请更复杂的方法。

Again though, just silently discard the request while serving the same thank you page (or introduce a delay in responding to the spam form, if you want to be vindictive - this may not keep them from overwhelming your server and it may even let them overwhelm you faster, by keeping more connections open longer. At that point, you need a hardware solution, a firewall on a load balancer setup).

同样，在提供相同的感谢页面时，只需默默地丢弃请求（或者在响应垃圾邮件表单时引入延迟，如果您想报复的话——这可能无法阻止它们压倒您的服务器，甚至可能让它们不堪重负通过保持更多连接打开更长时间，您会更快。此时，您需要一个硬件解决方案，负载平衡器设置上的防火墙）。

There are a lot of resources out there about delaying server responses to slow down attackers, frequently in the form of brute-force password attempts. This IT Security questionlooks like a good starting point.

有很多关于延迟服务器响应以减缓攻击者的资源，通常以暴力密码尝试的形式出现。这个 IT 安全问题看起来是一个很好的起点。

Update regarding Captcha's

关于验证码的更新

I had been thinking about updating this question for a while regarding the topic of computer vision and form submission. An article surfaced recently that pointed me to this blog post by Steve Hickson, a computer vision enthusiast. Snapchat (apparently some social media platform? I've never used it, feeling older every day...) launched a new captcha-like system where you have to identify pictures (cartoons, really) which contain a ghost. Steve proved that this doesn't verify squat about the submitter, because in typical fashion, computers are better and faster at identifying this simple type of image.

我一直在考虑更新这个关于计算机视觉和表单提交主题的问题。最近出现的一篇文章让我看到了计算机视觉爱好者史蒂夫·希克森 (Steve Hickson) 的这篇博文。Snapchat（显然是一些社交媒体平台？我从未使用过它，每天都感觉自己变老了……）推出了一个新的类似验证码的系统，您必须在其中识别包含鬼魂的图片（真的是卡通）。史蒂夫证明，这并不能证明提交者深陷其中，因为在典型的方式中，计算机在识别这种简单类型的图像方面做得更好更快。

It's not hard to imagine extending a similar approach to other Captcha types. I did a search and found these links interesting as well:

不难想象将类似的方法扩展到其他 Captcha 类型。我进行了搜索，发现这些链接也很有趣：

Is reCaptcha broken?
Practical, non-image based Captchas
If we know CAPTCHA can be beat, why are we still using them?
Is there a true alternative to using CAPTCHA images?
How a trio of Hackers brought Google's reCaptcha to its knees- extra interesting because it is about the audio Captchas.

reCaptcha 坏了吗？
实用的、非基于图像的 Captchas
如果我们知道 CAPTCHA 可以被击败，为什么我们还在使用它们？
使用 CAPTCHA 图像是否有真正的替代方案？
三名黑客如何让 Google 的 reCaptcha 屈服——特别有趣，因为它是关于音频 Captcha 的。

Oh, and we'd hardly be complete without an obligatory XKCD comic.

哦，如果没有强制性的XKCD 漫画，我们几乎是不完整的。

回答by Magnus

Today I successfully stopped a continuous spamming of my form. This method might not always work of course, but it was simple and worked well for this particular case.

今天我成功阻止了我的表单的连续垃圾邮件。当然，这种方法可能并不总是有效，但它很简单，并且适用于这种特殊情况。

I did the following:

我做了以下事情：

• I set the action property of the form to mustusejavascript.aspwhich just shows a message that the submission did not work and that the visitor must have javascript enabled.

• I set the form's onsubmit property to a javascript function that sets the action property of the form to the real receiving page, like receivemessage.asp

• 我将表单的 action 属性设置为mustusejavascript.asp，它只显示一条消息，表明提交无效并且访问者必须启用 javascript。

• 我将表单的 onsubmit 属性设置为一个 javascript 函数，该函数将表单的操作属性设置为真正的接收页面，例如receivemessage.asp

The bot in question apparently does not handle javascript so I no longer see any spam from it. And for a human (who has javascript turned on) it works without any inconvenience or extra interaction at all. If the visitor has javascript turned off, he will get a clear message about that if he makes a submission.

有问题的机器人显然不处理 javascript，所以我不再看到来自它的任何垃圾邮件。对于人类（打开了 javascript）来说，它完全没有任何不便或额外的交互。如果访问者关闭了 javascript，他将在提交时收到明确的消息。

回答by Matt Lo

Your code would not prevent bot submission but its not because of how your code is. The typical bot out there will more likely do an external/automated POST request to the URL (actionattribute). The typical bots aren't rendering HTML, CSS, or JavaScript. They are reading the HTML and acting upon them, so any client logic will not be executed. For example, CURLing a URL will get the markup without loading or evaluating any JavaScript. One could create a simple script that looks for <form>and then does a CURL POST to that URL with the matching keys.

您的代码不会阻止机器人提交，但这不是因为您的代码如何。那里的典型机器人更有可能对 URL（action属性）执行外部/自动 POST 请求。典型的机器人不会渲染 HTML、CSS 或 JavaScript。他们正在阅读 HTML 并对其采取行动，因此不会执行任何客户端逻辑。例如，卷曲 URL 将在不加载或评估任何 JavaScript 的情况下获取标记。可以创建一个简单的脚本来查找<form>，然后使用匹配的键对该 URL 执行 CURL POST。

With that in mind, a server-side solution to prevent bot submission is necessary. Captcha + CSRF should be suffice. (http://en.wikipedia.org/wiki/Cross-site_request_forgery)

考虑到这一点，防止机器人提交的服务器端解决方案是必要的。验证码 + CSRF 应该就足够了。( http://en.wikipedia.org/wiki/Cross-site_request_forgery)

回答by ucefkh

No Realy are you still thinking that Captcha or ReCap are Safe ?

不 你真的还在认为 Captcha 或 ReCap 是安全的吗？

Bots nowDays are smart and can easly recognise Letters on images Using OCR Tools (Search for it to understand)

现在的机器人很聪明，可以使用 OCR 工具轻松识别图像上的字母（搜索以了解）

I say the best way to protect your self from auto Form submitting is adding a hidden hash generated (and stored on the Session on your server of the current Client) every time you display the form for submitting !

我说保护自己免受自动表单提交的最佳方法是在每次显示提交表单时添加一个生成的隐藏哈希（并存储在当前客户端的服务器上的会话中）！

That's all when the Bot or any Zombie submit the form you check if it the given hash equals the session stored Hash ;)

当 Bot 或任何 Zombie 提交表单时，您检查给定的哈希值是否等于会话存储的哈希值，这就是全部；)

for more info Read about CSRF!

有关更多信息，请阅读有关CSRF 的信息！

回答by oguzhanyalcin

you can not achieve your goal with javascript. because a client can parse your javascript and bypass your methods. You have to do validation on server side via captchas. the main idea is that you store a secret on the server side and validate the form submitted from the client with the secret on the server side.

你不能用 javascript 实现你的目标。因为客户端可以解析您的 javascript 并绕过您的方法。您必须通过验证码在服务器端进行验证。主要思想是您在服务器端存储一个机密，并在服务器端使用机密验证从客户端提交的表单。

回答by Hari krishnan

You could simply add captchato your form. Since captchas will be differentand also in images, bots cannot decodethat. This is one of the most widely used security for all wesites...

您可以简单地添加captcha到您的表单中。由于验证码将different和也在 中images，机器人不能那样decode做。这是所有网站使用最广泛的安全性之一......

回答by Mikatsu

You could measure the registration time offered no need to fill eternity to text boxes!

您可以测量注册时间，无需在文本框中填写永恒！

回答by The_Banality_In_Seeking

I ran across a form input validation that prevented programmatic input from registering.

我遇到了阻止程序输入注册的表单输入验证。

My initial tactic was to grab the element and set it to the Option I wanted. I triggered focus on the input fields and simulated clicks to each element to get the drop downs to show up and then set the value firing the events for changing values. but when I tried to click save the inputs where not registered as having changed.

我最初的策略是获取元素并将其设置为我想要的选项。我触发了对输入字段的关注并模拟了对每个元素的点击以显示下拉菜单，然后设置触发事件以更改值的值。但是当我尝试单击保存未注册为已更改的输入时。

    ;failed automation attempt because window doesnt register changes.
    ;$iUse = _IEGetObjById($nIE,"InternalUseOnly_id")
    ;_IEAction($iUse,"focus")        
    ;_IEAction($iUse,"click")
    ;_IEFormElementOptionSelect($iUse,1,1,"byIndex")
    ;$iEdit = _IEGetObjById($nIE,"canEdit_id")
    ;_IEAction($iEdit,"focus")
    ;_IEAction($iEdit,"click")
    ;_IEFormElementOptionSelect($iEdit,1,1,"byIndex")
    ;$iTalent = _IEGetObjById($nIE,"TalentReleaseFile_id")
    ;_IEAction($iTalent,"focus")
    ;_IEAction($iTalent,"click")
    ;_IEFormElementOptionSelect($iTalent,2,1,"byIndex")
    ;Sleep(1000)
    ;_IEAction(_IETagNameGetCollection($nIE,"button",1),"click")

This caused me to to rethink how input could be entered by directly manipulating the mouse's actions to simulate more selection with mouse type behavior. Needless to say I wont have to manualy upload images 1 by 1 to update product images for companies. used windows number before letters to have my script at end of the directory and when the image upload window pops up I have to use active accessibility to get the syslistview from the window and select the 2nd element which is a picture the 1st element is a folder. or the first element in a findfirstfile return only files call. I use the name to search for the item in a database of items and then access those items and update a few attributes after upload of images,then I move the file from that folder to a another folder so it doesn't get processed again and move onto the next first file in the list and loop until script name is found at the end of the update.

这让我重新思考如何通过直接操纵鼠标的动作来模拟更多选择和鼠标类型行为来输入输入。不用说，我不必手动一张一张地上传图片来更新公司的产品图片。在字母前使用 Windows 编号将我的脚本放在目录末尾，当图像上传窗口弹出时，我必须使用活动辅助功能从窗口获取 syslistview 并选择第二个元素，即图片第一个元素是文件夹. 或者 findfirstfile 中的第一个元素只返回文件调用。我使用名称在项目数据库中搜索项目，然后访问这些项目并在上传图像后更新一些属性，然后将文件从该文件夹移动到另一个文件夹，这样它就不会

Just sharing how a lowly data entry person saves time, and fights all these evil form validation checks.

只是分享一个卑微的数据输入人员如何节省时间，并与所有这些邪恶的表单验证检查作斗争。

Regards.

问候。

回答by RamseyTech

This is a very short version that hasn't failed since it was implemented on my sites 4 years ago with added variances as needed over time. This can be built up with all the variables and if else statements that you require

这是一个非常简短的版本，自从 4 年前在我的网站上实施以来一直没有失败，随着时间的推移，根据需要增加了差异。这可以使用所有变量和您需要的 if else 语句来构建

    function spamChk() {
    var ent1 = document.MyForm.Email.value
    var str1 = ent1.toLowerCase();
    if (str1.includes("noreply")) {
    document.MyForm.reset();
    }

<input type="text" name="Email" oninput="spamChk()">

I had actually come here today to find out how to redirect particular spam bot IP addresses to H E L L .. just for fun

我今天来这里是为了了解如何将特定的垃圾邮件机器人 IP 地址重定向到 HELL .. 只是为了好玩

回答by FenceGuy

Great ideas.

伟大的想法。

I removed re-captcha a while back converted my contactform.html to contactform.asp and added this to the top (Obviously with some code in between to full-fill a few functions like sendmail, verify form filled out completely etc.).

我删除了 re-captcha 一段时间后将我的 contactform.html 转换为 contactform.asp 并将其添加到顶部（显然中间有一些代码来完成一些功能，如发送邮件，验证完整填写的表单等）。

    <%
     if Request.Form("Text") = 8 then
        dothis
      else
        send them to google.com
     end if
   %>

On the form i stuck a basic text field with the name text so its just looks like anything not specifying what its for at all, I then stuck some text 2 lines above in red that states enter what 2 + 6 = in the box below to submit your request.

在表单上，​​我粘贴了一个带有名称 text 的基本文本字段，因此它看起来就像任何未指定其用途的东西，然后我将上面 2 行的一些文本粘贴为红色，表示在下面的框中输入 2 + 6 =提交您的请求。