Bu sayfa, Cloud Translation API ile çevrilmiştir.

Görünmez reCAPTCHA

Bu sayfada, web sayfanızdaki görünmez reCAPTCHA'yı nasıl etkinleştireceğiniz ve özelleştireceğiniz açıklanmaktadır.

Görünmez reCAPTCHA'yı çağırmak için aşağıdakilerden birini yapabilirsiniz:

Meydan okumayı otomatik olarak bir düğmeye bağlayın veya
Meydan okumayı programlı olarak bir düğmeye bağlama veya
Sorguyu programatik olarak çağırma

Görünmeyen reCAPTCHA'yı nasıl özelleştireceğinizi öğrenmek için Yapılandırmalar bölümüne bakın. Örneğin, dili veya rozet konumunu belirtmek isteyebilirsiniz.

Kullanıcının CAPTCHA'yı başarıyla çözüp çözmediğini kontrol etmek için Kullanıcı yanıtını doğrulama başlıklı makaleye bakın.

Meydan okumayı otomatik olarak bir düğmeye bağla

Görünmez reCAPTCHA widget'ını sayfanızda kullanmanın en kolay yöntemi, gerekli JavaScript kaynağını dahil etmek ve html düğmenize birkaç özellik eklemektir. Gerekli özellikler; "g-recaptcha" sınıf adı, data-sitekey özelliğinde site anahtarınız ve data-callback özelliğinde captcha'nın tamamlanmasını ele almak için bir JavaScript geri çağırmasının adıdır.

<html>
  <head>
    <title>reCAPTCHA demo: Simple page</title>
     <script src="https://www.google.com/recaptcha/api.js" async defer></script>
     <script>
       function onSubmit(token) {
         document.getElementById("demo-form").submit();
       }
     </script>
  </head>
  <body>
    <form id="demo-form" action="?" method="POST">
      <button class="g-recaptcha" data-sitekey="your_site_key" data-callback="onSubmit">Submit</button>
      <br/>
    </form>
  </body>
</html>

Komut dosyası, HTTPS protokolü kullanılarak yüklenmelidir ve sayfanın herhangi bir noktasından kısıtlama olmaksızın eklenebilir.

Sorguyu programatik olarak bir düğmeye bağlama veya sorgulamayı çağırma

Bağlamanın ertelenmesi, onload geri çağırma işlevinizi belirterek ve JavaScript kaynağına parametreler ekleyerek gerçekleştirilebilir. Bu, normal reCAPTCHA sorgulaması ile aynı şekilde çalışır.

Programatik olarak meydan okumayı çağırın.

reCAPTCHA doğrulamasının programatik olarak çağrılması, sorgulamanın data-size="invisible" özelliğine sahip bir div içinde oluşturulması ve programatik olarak yürütülmesinin çağrılmasıyla gerçekleştirilebilir.

data-size="invisible" ile bir div oluşturun.

<div class="g-recaptcha"
      data-sitekey="_your_site_key_"
      data-callback="onSubmit"
      data-size="invisible">
</div>

JavaScript yönteminden grecaptcha.execute çağrısı yapın.
```
grecaptcha.execute();
```
Geri çağırmanız yürütüldüğünde, JavaScript API'sından grecaptcha.render yöntemini çağırabilirsiniz.
Onload geri çağırma işleviniz, reCAPTCHA API yüklenmeden önce tanımlanmalıdır. Herhangi bir yarış koşulu olmadığından emin olmak için:
- komut dosyalarınızı önce geri çağırma ile sıralayın, ardından reCAPTCHA'ya ekleyin
- "script" etiketlerinde "async" ve "defer" parametrelerini kullanma

Yapılandırma

JavaScript kaynağı (api.js) parametreleri

Parametre	Değer	Açıklama
onload		İsteğe bağlı. Tüm bağımlılıklar yüklendikten sonra yürütülecek geri çağırma işlevinizin adı.
oluşturmak	explicit onload	İsteğe bağlı. Widget'ın açık bir şekilde oluşturulup oluşturulmayacağı. Varsayılan olarak onload seçeneği kullanılır. Bu işlem widget'ı bulduğu ilk `g-recaptcha` etikette oluşturur.
hl	Dil kodlarına bakın	İsteğe bağlı. Widget'ı belirli bir dilde oluşturmaya zorlar. Dil belirtilmezse kullanıcının dilini otomatik olarak algılar.

g-recaptcha etiketi özellikleri ve grecaptcha.render parametreleri

g-recaptcha etiketi özelliği	grecaptcha.render parametresi	Değer	Varsayılan	Açıklama
data-sitekey	site anahtarı			Site anahtarınız.
veri rozeti	rozet	sağ alt sol alt satır içi	sağ alt	İsteğe bağlı. reCAPTCHA rozetini yeniden konumlandırın. "satır içi" dosyayı CSS ile konumlandırmanızı sağlar.
veri boyutu	beden	görünmez		İsteğe bağlı. Bir div öğesine bağlı görünmez bir widget oluşturmak için kullanılır ve programatik olarak yürütülür.
data-tabindex	sekme dizini		0	İsteğe bağlı. Ödevin sekme dizini. Sayfanızdaki diğer öğeler tabindex kullanıyorsa, kullanıcının gezinmesini kolaylaştırmak için sekme dizini ayarlanmalıdır.
data-callback	geri çağırma			İsteğe bağlı. Kullanıcı başarılı bir yanıt gönderdiğinde yürütülen geri çağırma işlevinizin adı. `g-recaptcha-response` jetonu, geri çağırmanıza iletilir.
data-expired-callback	expired-callback			İsteğe bağlı. reCAPTCHA yanıtının süresi dolduğunda ve kullanıcının yeniden doğrulama yapması gerektiğinde yürütülen geri çağırma işlevinizin adı.
data-error-callback	hata-geri-arama			İsteğe bağlı. reCAPTCHA bir hatayla (genellikle ağ bağlantısı) karşılaştığında yürütülen geri çağırma işlevinizin adı ve bağlantı yeniden kurulana kadar devam edemez. Burada bir işlev belirtirseniz kullanıcıya tekrar denemesi gerektiğini bildirmek sizin sorumluluğunuzdadır.
	ayrı		false	İsteğe bağlı. Eklenti sahiplerinin sayfadaki mevcut reCAPTCHA kurulumlarına müdahale etmemesi için. Doğru ise bu reCAPTCHA örneği ayrı bir kimlik alanının parçası olur.

JavaScript API

Yöntem	Açıklama
grecaptcha.render( kapsayıcı, parametreleri ile devral )	Kapsayıcıyı bir reCAPTCHA widget'ı olarak oluşturur ve yeni oluşturulan widget'ın kimliğini döndürür. . kapsayıcı reCAPTCHA widget'ını oluşturacak HTML öğesi. Kapsayıcının kimliğini (dize) veya DOM öğesinin kimliğini belirtin. . parametreler Anahtar=değer çiftleri olarak parametreler içeren bir nesne (ör. {"siteanahtarı": "sitenizin_anahtarı", "theme": "light"}. grecaptcha.render parametrelerine bakın. . devral Karşılık gelen parametre belirtilmemişse öğedeki mevcut data-* özelliklerini kullanın. Parametreler özelliklere göre öncelikli olur.
grecaptcha.execute( opt_widget_id )	reCAPTCHA kontrolünü programatik olarak çağırın. Görünmez reCAPTCHA bir div öğesindeyse kullanılır ekleyebilirsiniz. . opt_widget_id İsteğe bağlı widget kimliği, belirtilmediyse varsayılan olarak oluşturulan ilk widget'tır.
grecaptcha.reset( opt_widget_id )	reCAPTCHA widget'ını sıfırlar. . opt_widget_id İsteğe bağlı widget kimliği, belirtilmediyse varsayılan olarak oluşturulan ilk widget'tır.
grecaptcha.getResponse( opt_widget_id )	reCAPTCHA widget'ının yanıtını alır. . opt_widget_id İsteğe bağlı widget kimliği, belirtilmediyse varsayılan olarak oluşturulan ilk widget'tır.

Örnekler

Bir onload geri çağırmasından sonra açık oluşturma

<html>
  <head>
    <title>reCAPTCHA demo: Explicit render after an onload callback</title>
    <script>
        var onSubmit = function(token) {
          console.log('success!');
        };

        var onloadCallback = function() {
          grecaptcha.render('submit', {
            'sitekey' : 'your_site_key',
            'callback' : onSubmit
          });
        };
    </script>
  </head>
  <body>
    <form action="?" method="POST">
      <input id="submit" type="submit" value="Submit">
    </form>
    <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit"
        async defer>
    </script>
  </body>
</html>

İstemci tarafı doğrulamasından sonra görünmez reCAPTCHA sorgulaması çağrılır.

<html>
  <head>
  <script>
    function onSubmit(token) {
      alert('thanks ' + document.getElementById('field').value);
    }

    function validate(event) {
      event.preventDefault();
      if (!document.getElementById('field').value) {
        alert("You must add text to the required field");
      } else {
        grecaptcha.execute();
      }
    }

    function onload() {
      var element = document.getElementById('submit');
      element.onclick = validate;
    }
  </script>
  <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  </head>
  <body>
    <form>
      Name: (required) <input id="field" name="field">
      <div id="recaptcha" class="g-recaptcha"
          data-sitekey="_your_site_key_"
          data-callback="onSubmit"
          data-size="invisible"></div>
      <button id="submit">submit</button>
    </form>
    <script>onload();</script>
  </body>
</html>