reCaptcha 스크립트를 그대로 둔 상태에서 jQuery/AJAX를 사용하여 reCaptcha 양식을 로드하려면 어떻게 해야 합니까?

reCaptcha 스크립트를 그대로 둔 상태에서 jQuery/AJAX를 사용하여 reCaptcha 양식을 로드하려면 어떻게 해야 합니까?

JQuery/AJAX를 사용하여 연락처 양식을 페이지에 로드합니다.

연락처 양식에는 reCaptcha 스크립트가 포함되어 있습니다.

안타깝게도 JQuery는 스크립트 태그를 내 페이지에 삽입하기 전에 제거합니다.이러한 스크립트 태그는 캡차를 출력하기 때문에 필요합니다.이제 내 로드된 폼에는 캡차가 없습니다.

@벤크, 멋진 대답!하지만 그것은 좀 구식이 되었습니다.현재 스크립트 URL은 다음과 같습니다.

<script type="text/javascript" src="https://www.google.com/recaptcha/api.js"></script>

코드는 다음과 같습니다.

grecaptcha.render('element_id', {
    sitekey: recaptchaSiteKey,
    callback: function(response) {
        console.log(response);
    }
});

링크에는 필요한 모든 것이 있습니다. http://code.google.com/apis/recaptcha/docs/display.html

Ajax에서는 스크립트를 추가할 수 없습니다.다음 행을 추가해야 합니다.

  <script type="text/javascript" src="http://www.google.com/recaptcha/api/js/recaptcha_ajax.js"></script>

그런 다음 다음 코드를 추가하여 JS 코드에 재검색 양식을 동적으로 만들 수 있습니다.

  Recaptcha.create("your_public_key",
    "element_id",
    {
      theme: "red",
      callback: Recaptcha.focus_response_field
    }
  );

제 접근 방식은 조금 다릅니다.

<script src='https://www.google.com/recaptcha/api.js?render=explicit' async defer></script>
<form>
    <input name="whatEver" type="text">
    <div id="captcha"></div>
    <button>submit</button>
</form>
<script>
var captchaWidgetId = grecaptcha.render( 'captcha', {
    'sitekey' : 'your_site_key'
    'theme' : 'light'
});
$(document).ready(function(){
    $('form').on('click','button', function(e){
        var formDatas = $(this).closest('form').serialize()+'&response='+grecaptcha.getResponse(captcha);
        $.post('post.php', formDatas, function(data){
            //successful
        });
    });
});
</script>

언급URL : https://stackoverflow.com/questions/7261436/how-can-i-load-a-recaptcha-form-using-jquery-ajax-while-leaving-the-recaptcha-sc