2011-09-05 96 views
2

我想創建一個花哨和易於使用的captcha我的註冊通過使用滑塊,用戶可以證明他是一個人,沒有劇本。如何使用jQuery UI滑塊構建安全驗證碼?

到目前爲止,我使用jQuery UI Slider實現了滑塊,如果值爲100,則會出現提交按鈕。看起來不錯,我對這種行爲感到滿意。

但是由於JS被客戶端執行,所有人都能夠看到我的代碼,並且可以通過使用腳本觸發相同的操作。對於腳本,如果按鈕可用或不可用,則不會有任何區別。腳本只發布數據以提交表單,而我的滑塊驗證碼沒用。

我簡單的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> 

是否有可能建立驗證碼保護?使用serverside散列?設置標誌?什麼是實踐歸檔安全與花哨的用戶界面和多一點用戶體驗比輸入字母。

我在服務器端使用Java EE和Spring MVC。如果使用滑塊而不是reCaptcha,那會很好。


編輯:我添加了一個哈希值滑塊邏輯。在服務器開始渲染隱藏字段時,註冊開始的日期,服務器根據此日期構建一個md5哈希。滑塊移動了一個函數被調用,它讀取隱藏字段的值並構建一個md5哈希。散列值將被髮送到服務器,並在提交註冊之前與散列的服務器值進行比較。不像保存文本驗證碼那樣有效,但比沒有做任何事情更有效。

我發現這一點:https://code.google.com/p/slidelock/

你有什麼事嗎?這個傢伙如何構建一個「安全」滑塊?他如何管理服務器端驗證和SALT?它是安全的還是隻有更多的昂貴的腳本才能破解它?

+0

鏈接轉到停放的域 – Neberu

+0

謝謝,我添加了一個新的。 – Nils

回答

1

爲什麼不使用現有的驗證碼組件而不是自己寫驗證碼?

這裏有很多。我會推薦http://www.google.com/recaptcha,這是免費的,並有助於圖書數字化。

+2

第一個原因是我需要我的所有服務器,其次是關於一個很好的解決方案,這個解決方案並不枯燥,甚至在註冊表中也提供了一些用戶體驗。是的,我知道reCaptcha是可靠和可定製的,並支持不同的語言。我想知道如何建立一個驗證碼,應該有人以外的人知道如何:) – Nils

+0

我想添加reCaptcha也幫助ditigize書同時,這是相當整潔。所以驗證碼實際上是用於保護您的網站以外的其他目的。 –

+0

手機上的標準驗證碼是terribad。滑塊方法很性感,但需要增強安全性。 –

0

跳到結論,並張貼我不應該,對不起。

我完全理解你的願望,讓它定製,特別是當它很容易做到的時候。但是,我並沒有發現任何使用滑塊驗證碼的內在錯誤,只要它不是保護表單/應用程序的唯一方法。我認爲它可以很容易地擴大到具有獨特的標識符,我認爲它的易用性遠遠優越。我打算在測試它並進行更多研究後,將其用於將來的應用程序。