reCAPTCHAのカスタムフォームパラメータ名

Question

は、彼らが異なって呼ばれるようにreCAPTCHAのフォームパラメータ（recaptcha_challenge_fieldとrecaptcha_response_field）をカスタマイズすることは可能ですか？

基本的に私はcaptchaId、captchaUserResponse呼ばれる とrecaptcha_response_fieldと呼ばれるフォームパラメータrecaptcha_challenge_fieldをしたいです。私は彼らが私が抽象キャプチャの実装ことができますので、名前を変更したい

...リクエストが

POST /個人用サイト/ userSignup

に到着したときに私は気にしたくありませんキャプチャの実装（reCaptchaなど） - 正しいキャプチャの実装に適したパラメータを抽出して、それらのパラメータ名を統一したい。

今、私の要求は、こののようになります。

POST /mysite/userSignup HTTP/1.1 
Host: localhost:80 
Connection: keep-alive 
Content-Length: 416 
Cache-Control: max-age=0 
Origin: http://localhost:80 
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.46 Safari/536.5 
Content-Type: application/x-www-form-urlencoded 
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 
Referer: http://localhost:8080/mysite/signup/form.html 
Accept-Encoding: gzip,deflate,sdch 
Accept-Language: en-US,en;q=0.8,hr;q=0.6 
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3 

email:testUser%40gmail.com 
username:testUser 
password:test 
password2:test 
forename:Test 
surname:User 
recaptcha_challenge_field:<google generated challange> 
recaptcha_response_field:<user typed captcha answer> 
submit:Submit 

しかし、私はそれは次のようになりたい：

POST /mysite/userSignup HTTP/1.1 
Host: localhost:80 
Connection: keep-alive 
Content-Length: 416 
Cache-Control: max-age=0 
Origin: http://localhost:80 
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/536.5 (KHTML, like Gecko) Chrome/19.0.1084.46 Safari/536.5 
Content-Type: application/x-www-form-urlencoded 
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8 
Referer: http://localhost:8080/mysite/signup/form.html 
Accept-Encoding: gzip,deflate,sdch 
Accept-Language: en-US,en;q=0.8,hr;q=0.6 
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3 

email:testUser%40gmail.com 
username:testUser 
password:test 
password2:test 
forename:Test 
surname:User 
captchaId:<google generated challange> 
captchaUserResponse:<user typed captcha answer> 
submit:Submit 

エレガントな方法のようなものをフォームのパラメータ名を指定することですこれは：

<script> 
    var RecaptchaOptions = { 
     recaptcha_challenge_field_formparam_name : 'captchaId', 
     recaptcha_response_field_formparam_name: 'captchaUserResponse' 
    }; 
</script> 

---

これができない場合は、どのような回避策をお勧めしますか？

Answer 1

これは不可能です。余分なフィールドの必要はありません

<!-- the HTML part --> 
<input type="hidden" id="captchaId"> 
<input type="hidden" id="captchaUserResponse"> 

// the JavaScript (jQuery) part 
$('form').submit(function(){ 
    $('input#captchaId'). 
    val($('input#recaptcha_response_field').val()); 
    $('input#captchaUserResponse'). 
    val($('input#recaptcha_challenge_field').val()); 
    return true; 
}) 

Answer 2

：考えられる解決策、AFAIUは、例えば、右のフォームの送信前に、元のものの値をコピーし、新しいDOM要素を追加することです。あなたがしなければならないのは、フォーム要素をIDで識別し、提出前にその相対名を変更することだけです。

<div id="captcha" class="item recaptcha"> 
... 
<textarea id=custom1 name="recaptcha_challenge_field" rows="3" cols="40"></textarea> 
<input id=custom2 name="recaptcha_response_field" value="manual_challenge" type="hidden" /> 
<input type="submit" name="submit" value="Submit"> 
</div> 

あなたはこれらの変更は、直接または間接的にsubmitボタンに含めることができ

document.captcha.custom1.name='captchaId' 
document.captcha.custom2.name='captchaUserResponse' 

を使用して名前を変更することができます（別のメソッドを呼び出す）onclickのを使用して：あなたは次の形式を持っていると仮定すると

イベント。

ので、直接変更するために、あなたの提出は次のようになります。あなたが行くここ

<input type="submit" name="submit" value="Submit" onclick="document.captcha.custom1.name='captchaId';document.captcha.custom2.name='captchaUserResponse';return true"> 

Answer 3

、私はあなたと同じような状況にあったが、これは私がそれを作った方法です：

ショートバージョン：
ここ 、フォームにこの属性を追加し、これはあなたが必要とするすべてである：

EDIT2 - 追加の純粋なJavascriptのコード：

純粋なJavascriptをIE8、FF12とChromeでテストアプローチ
：

onsubmit="javascript:(function(p){var a=p.getElementsByTagName('input');var attr='';var toAttr='';for (var i in a){try {attr=a[i].getAttribute('name')} catch(e) {continue;}switch(attr){case 'recaptcha_challenge_field':{toAttr='captchaId';break;}case 'recaptcha_response_field':{toAttr='captchaUserResponse';break;}}a[i].setAttribute('name',toAttr);}p.submit();})(this)" 

jQueryのアプローチ：

onsubmit="javascript:(function(p){var f=$(p);$('input[name=recaptcha_challenge_field]',f).attr('name','captchaId');$('input[name=recaptcha_response_field]',f).attr('name','captchaUserResponse');f.submit();})(this)" 

例えば：

<form method="post" action="verify.php" onsubmit="javascript:(function(p){var f=$(p);$('input[name=recaptcha_challenge_field]',f).attr('name','captchaId');$('input[name=recaptcha_response_field]',f).attr('name','captchaUserResponse');f.submit();})(this)"> 
    <?php 
    require_once('recaptchalib.php'); 
    $publickey = "your_public_key"; // you got this from the signup page 
    echo recaptcha_get_html($publickey); 
    ?> 
    <input type="submit" /> 
</form> 

---

ロングバージョン：

の1-をこれは、入力の名前を置き換えることを担当している実際のjavascript関数、ここでは何も特別です：

function(param){ 
    var form = $(param); 
    $('input[name=recaptcha_challenge_field]',form).attr('name','captchaId'); 
    $('input[name=recaptcha_response_field]',form).attr('name','captchaUserResponse'); 
    form.submit(); 
} 

ここ
は私がやっているものです

私はこの関数を無名関数にして、インラインHTMLイベント（onsubmitイベント）で呼び出すことができます：

(function(param){...function code...})(this) 

• その(this)に気づきましたか？私たちの無名関数の終わりに？ これで、フォームのハンドルを関数に渡すことができます。

、3-あなたが可能なクライアント修正（または介入あなたが言った？）のように少しを必要とするので、私はHTMLのインラインイベントハンドラからこの無名関数を呼び出します。我々の場合、最良のハンドラはonsubmitです。

まあ、正直なところ、私は、自分自身、このソリューションを楽しんで、それはあまりにもあなたのために便利来る願っています：D

EDIT1：

ところで、あなたが望むなら、私は、あなたのコメントを気づいていませんこの方法でそれを行うには：

<form><!--blah blah--></form> 
<script type="text/js" src="somewhere"></script> 

これら

は短所は以下のとおりです。

1. 追加のHTTPリクエストを追加しています！どうして？
2. あなたはそれが不正確
3. は、あなたがこれまで多分あなたのウェブサーバは、その特定の時間に、クライアントの要求を拒否することを考えたことがありますフォームのLoad-completeイベントから非同期にそれを作っていますか？何が起こるのですか？それはあなたのサーバー側のスクリプトを壊す！
4. サーバー側でフォームを印刷している場合は、これらの変更をサーバー側で行わないのはなぜですか。

Answer 4

OPはまだ回答を受け付けていないので、私はこれを提供しています。これは、この投稿のコメントでOPが探している正確なものと同じです：one of the answers

PHPスクリプトを作成し、どこかに入れてください。私は、作成されたページのURIがDESIRED_URIと仮定します。その中にこのコードを配置：

<?php 
    header("Content-type: text/javascript"); 
    /* 
    * These are the script parameters 
    * You can change them by including desired ones in script's URL (as GET params) 
    * challenge_field_original: original name of captcha challenge field 
    * response_field_original: original name of captcha response field 
    * to_challenge_field: the name of the challenge field you want 
    * to_response_field: the name of the response field you want 
    */ 
    $params = array(
     /* 
     * Defining the defaults of the parameters 
     */ 
     "challenge_field_original" => "recaptcha_challenge_field", 
     "response_field_original" => "recaptcha_response_field", 
     "to_challenge_field" => "captchaId", 
     "to_response_field" => "captchaUserResponse", 
    ); 
    /* 
    * Checking for passed GET params to re-fill the parameters with non-default ones (if any) 
    */ 
    if(isset($_GET['challenge']) && $_GET['challenge'] != "") { 
     $params["to_challenge_field"] = $_GET['challenge']; 
    } 
    if(isset($_GET['response']) && $_GET['response'] != "") { 
     $params["to_response_field"] = $_GET['response']; 
    } 
    if(isset($_GET['challenge_original']) && $_GET['challenge_original'] != "") { 
     $params["challenge_field_original"] = $_GET['challenge_original']; 
    } 
    if(isset($_GET['response_original']) && $_GET['response_original'] != "") { 
     $params["response_field_original"] = $_GET['response_original']; 
    } 
?> 
/* 
* I'm going to find the index of this script tag in the whole document 
* So I can find its previous sibling node (the captcha form node) 
*/ 
var scripts = document.getElementsByTagName('script'); 
var thisScriptTag = scripts[ scripts.length - 1 ]; 

//now we have the index, good, I'm going to find its previous sibling node 
var targetFormTag = (function(element) { 
    if(typeof(element.previousElementSibling) == "undefined") { 
     var p = element; 
     do p = p.previousSibling; 
     while (p && p.nodeType != 1); 
     return p; 
    } else { 
     return element.previousElementSibling; 
    } 
})(thisScriptTag); 

//Changing names... 
(function(targetForm) { 
    var a = targetForm.getElementsByTagName('input'); 
    var attr = ''; 
    var toAttr = ''; 
    for (var i in a) { 
     try { 
      attr = a[i].getAttribute('name') 
     } catch(e) { 
      continue; 
     } 
     switch(attr) { 
      case '<?php echo $params["challenge_field_original"]; ?>': 
      {toAttr='<?php echo $params["to_challenge_field"]; ?>';break;} 
      case '<?php echo $params["response_field_original"]; ?>': 
      {toAttr='<?php echo $params["to_response_field"]; ?>';break;} 
     } 
     a[i].setAttribute('name',toAttr); 
    } 
})(targetFormTag) 

使用法：

右のフォーム（これは非常に重要です！）の後にスクリプトを含むような単純な。

しばらくするとフィールドの名前を変更することができます。そのためには、コードのマニュアルを読んでください。

サイドノート：

• スクリプトは途方もなくクロスブラウザ（IE5 +、クロム、FF、Androidは）あなただけの名前を指定する、任意のキャプチャスクリプトのためにこれを使用すること
• ですスクリプトのsrcに入力フィールドの名前と元の入力の名前を入力します。
• すべてのキャプチャは、それ自身の検証機能を使用するためのフィールドを変更するにはをしようとスクリプトは、失敗した場合に、それは、私はあなたがいない抽象的すぎキャプチャ実装できると信じていたすべてのエラー

Answer 5

を上げません。クライアント側でキャプチャフィールドの名前を変更しても、それは最良の解決策ではありません。なぜなら、クライアントがJavaScriptを有効にしていなければ、単に機能しないからです。これを考慮

、私はあなたがフォームのポストを受け取った後、あなたが行うことができ、フィールドの名前は、サーバー側で変数を使用することである抽象化する最善の方法を信じて：

$captchaId = $_POST["recaptcha_challenge_field"]; 
$captchaUserResponse = $_POST["recaptcha_response_field"]; 

次に渡しますこれは、このような一般的な検証機能に：

recaptcha_generic_check ("PrivateKey", $_SERVER["REMOTE_ADDR"], $captchaId, $captchaUserResponse); 

理想的には、あなただけのフィールドの名前を変更する必要がありますこの方法は、ポスト（そしてもちろん機能）で受信し、すべてが同じままになります。

Answer 6

あなたはreCAPTCHA以外のものを使うことに決めたら、同じ方法で対処することができるように、キャプチャを扱う一般的な方法が必要です。私はあなたの考えが素晴らしいと思うが、あなたはあまりにも深く抽象化している。

理想的には、そのthangを行うブラックボックスのキャプチャシステムがほしいと思うので、どのcaptchaプラグインが入っているのか心配する必要はありません。そのボックスから抜け出すために必要なのは、ユーザーが正しいことを入力したかどうかだけです。

ブラックボックスがこのチェックを行う方法を指示しようとすると、あなたはそのボックスを酷使しています。さらに、あなたが別のcaptchaプラグインに切り替えることになった場合、あなたはそのプラグインと混乱しなければならないでしょう。

これらの理由から、1つのことを抽象化することをお勧めします：is_human_userメソッド（またはそれを呼び出したいもの）。あなたがする必要があるのは、使用することを決めた各captchaプラグインに対してこのメ​​ソッドを実装することだけです。 reCAPTCHAについては、このメソッドがrecaptcha_challenge_field == recaptcha_response_fieldを返すように聞こえます。次に、何が行われたとしても、is_human_userが呼び出され、実装が何であるかはわかりません。

これはあなたが探している答えではない場合は申し訳ありませんが、なぜ戻って、そのウサギの穴がダウンしている理由を思い出させることが常に重要です。