jquery - 如何使用 jQuery UI Slider 构建安全的验证码？

Question

我想通过使用 slider 来为我的注册构建一个精美且易于使用的验证码，用户可以在该 slider 上证明他是人类而不是脚本。

到目前为止，我使用 jQuery UI Slider 实现了 slider ，如果值为 100，则会出现提交按钮。看起来不错，我对这种行为很满意。

但是由于 JS 是由客户端执行的，每个人都可以看到我的代码，并且可以通过使用脚本触发相同的操作。对于脚本来说，按钮是否可用没有区别。脚本仅发布数据来提交表单，而我的 slider 验证码毫无用处。

我的简单 JS 代码:

$(function() {
        $( "#slider" ).slider({
            value:0,
            min: 0,
            max: 100,
            step: 50,
            slide: function( event, ui ) {
                if(ui.value == 100){
                    $( "#amount" ).val( "human" );
                    $("#regButton").slideDown();
                } else if (ui.value == 50) {
                    $( "#amount" ).val( "nerd" );
                    $("#regButton").slideUp();
                } else {
                    $( "#amount" ).val( "script" );
                    $("#regButton").slideUp();
                }
            }
        });
        $("#regButton").hide();
        $( "#amount" ).val( "Script" );
    });

HTML:

<label for="amount" style="text-align:right;">I'm a:</label>
        <input type="text" id="amount" style="border:0; color:#f6931f; font-weight:bold; width: 197px;" />
        <div id="slider"></div>

是否有可能构建验证码保护程序？使用服务器端哈希？设置标志？有哪些实践可以通过精美的 UI 和比输入字母更多的用户体验来实现安全性。

我在服务器端使用 Java EE 和 Spring MVC。使用 slider 而不是 reCaptcha 会很好，例如。

<小时/>

编辑:我向 slider 逻辑添加了一个哈希值。首先，服务器渲染一个隐藏字段，其中包含注册开始的日期，服务器根据该日期构建 md5 哈希值。当 slider 移动时，会调用一个函数来读取隐藏字段的值并构建 md5 哈希值。哈希值将发送到服务器，并在提交注册之前与服务器的哈希值进行比较。不像文本验证码那样保存，但比什么都不做更有效。

我发现了这个:https://code.google.com/p/slidelock/

你在意什么？这家伙如何 build 一个“安全”的 slider ？他如何管理服务器端验证和 SALT？它安全还是脚本编写者破解它的成本更高？

Answer 1

为什么不使用现有的验证码组件而不是编写自己的验证码组件？

那里有很多这样的东西。我会推荐http://www.google.com/recaptcha ，它是免费的，有助于书籍数字化。