تمت ترجمة هذه الصفحة بواسطة Cloud Translation API‏.

reCAPTCHA غير مرئي

توضّح هذه الصفحة كيفية تفعيل reCAPTCHA غير المرئي على صفحة الويب الخاصة بك وتخصيصه.

لاستدعاء reCAPTCHA غير المرئي، يمكنك إما:

ربط التحدي تلقائيًا بزر أو
ربط التحدي برمجيًا بزر أو
استدعاء التحدي برمجيًا

راجع عمليات التهيئة للتعرف على كيفية تخصيص reCAPTCHA غير المرئي. على سبيل المثال، يمكنك تحديد اللغة أو موقع الشارة.

اطلع على التحقق من استجابة المستخدم للتحقق مما إذا كان المستخدم قد نجح في اختبار CAPTCHA أم لا.

ربط التحدي بزر تلقائيًا

إن أسهل طريقة لاستخدام أداة reCAPTCHA غير المرئية على صفحتك هي تضمين مورد جافا سكريبت اللازم وإضافة بعض السمات إلى زر html. السمات اللازمة هي اسم الفئة "g-recaptcha"، ومفتاح موقعك الإلكتروني في السمة data-sitekey، واسم استدعاء JavaScript للتعامل مع اختبار CAPTCHA في السمة data-callback.

<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>

يجب تحميل النص البرمجي باستخدام بروتوكول HTTPS ويمكن تضمينه من أي نقطة في الصفحة بدون قيود.

اربط التحدي آليًا بزر أو استحضار التحدي.

يمكن تأجيل الربط عن طريق تحديد دالة رد الاتصال onload وإضافة معلمات إلى مورد JavaScript. ويعمل هذا بالطريقة نفسها التي يعمل بها اختبار reCAPTCHA العادي.

استدعاء التحدي بشكل برمجي.

يمكن تنفيذ استدعاء التحقق reCAPTCHA آليًا عن طريق عرض التحدي في div مع سمة data-size="invisible" وتنفيذ استدعاء برمجي.

أنشئ قسم div باستخدام data-size="invisible".

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

يمكنك استدعاء grecaptcha.execute من طريقة جافا سكريبت.
```
grecaptcha.execute();
```
عندما يتم تنفيذ معاودة الاتصال، يمكنك استدعاء طريقة grecaptcha.render من واجهة برمجة تطبيقات JavaScript.
يجب تحديد دالة رد الاتصال onload قبل تحميل واجهة برمجة تطبيقات reCAPTCHA. لضمان عدم توفّر شروط للسباقات:
- ترتيب النصوص البرمجية مع معاودة الاتصال أولاً، ثم reCAPTCHA
- استخدام المعلمتَين "غير متزامن" و"المؤجَّل" في العلامتين `script`

الإعدادات

معلَمات مورد JavaScript (api.js)

المعلمة	القيمة	الوصف
تحميل		اختياريّ. اسم دالة رد الاتصال المطلوب تنفيذها بعد تحميل جميع التبعيات.
عرض	تحميل صريح	اختياريّ. ما إذا كان سيتم عرض الأداة بشكل صريح الإعدادات التلقائية للتحميل، والتي ستعرض الأداة في أول علامة `g-recaptcha` تعثر عليها.
hl	راجع رموز اللغة	اختياريّ. لفرض عرض الأداة بلغة معينة. يكتشف تلقائيًا لغة المستخدم إذا لم يتم تحديده.

سمات علامة g-recaptcha ومعلمات grecaptcha.render

سمة علامة g-recaptcha	معلمة grecaptcha.render	القيمة	تلقائي	الوصف
مفتاح موقع البيانات	مفتاح الموقع			مفتاح موقعك الإلكتروني.
شارة البيانات	شارة	مضمن أسفل اليمين	أسفل اليمين	اختياريّ. أعد وضع شارة reCAPTCHA. تتيح لك 'inline' إمكانية عرضها باستخدام CSS.
حجم البيانات	size	غير مرئي		اختياريّ. تستخدم لإنشاء أداة غير مرئية مرتبطة بـ div ويتم تنفيذها برمجيًا.
فهرس علامة تبويب البيانات	فهرس علامة التبويب		0	اختياريّ. هي علامة تبويب التحدي. إذا كانت هناك عناصر أخرى في صفحتك تستخدم index.، ينبغي تعيينها لتسهيل تنقل المستخدم.
رد اتصال البيانات	معاودة الاتصال			اختياريّ. اسم دالة رد الاتصال، التي يتم تنفيذها عندما يرسل المستخدم استجابة ناجحة. يتمّ تمرير الرمز `g-recaptcha-response` إلى معاودة الاتصال.
رد اتصال منتهي الصلاحية للبيانات	معاودة الاتصال منتهية الصلاحية			اختياريّ. اسم دالة رد الاتصال، التي يتم تنفيذها عند انتهاء صلاحية استجابة reCAPTCHA ويحتاج المستخدم إلى إعادة إثبات الملكية.
رد اتصال خطأ البيانات	معاودة الاتصال بالخطأ			اختياريّ. اسم وظيفة رد الاتصال، والذي يتم تنفيذه عندما يواجه reCAPTCHA خطأ (عادةً ما يكون اتصال الشبكة) ولا يمكن المتابعة حتى تتم استعادة الاتصال. إذا حددت دالة هنا، فإنك مسؤول عن إبلاغ المستخدم بضرورة إعادة المحاولة.
	معزول		خطأ	اختياريّ. بالنسبة إلى مالكي المكوِّنات الإضافية لعدم التداخل مع عمليات تثبيت reCAPTCHA الحالية على إحدى الصفحات. في حال التعيين على "true"، سيصبح مثيل reCAPTCHA جزءًا من مساحة رقم تعريف منفصلة.

JavaScript API

الطريقة	الوصف
grecaptcha.render( ) أو الحاوية ، موروث )	لعرض الحاوية كأداة reCAPTCHA وعرض معرّف الأداة التي تم إنشاؤها حديثًا. حاوية عنصر HTML لعرض أداة reCAPTCHA. حدِّد رقم تعريف الحاوية (سلسلة) أو عنصر DOM نفسه. المعلّمات كائن يحتوي على معلّمات كأزواج المفتاح/القيمة، على سبيل المثال، {"sitekey": "your_site_key"، "theme": "light"}. راجع معلمات grecaptcha.render. اكتساب استخدِم سمات data-* الحالية على العنصر في حال عدم تحديد المَعلمة المقابلة. تحظى المُعلمَات بالأولوية على السمات.
grecaptcha.execute( #id_widget_id )	استدعاء التحقق reCAPTCHA بشكل برمجي. يتم استخدامه إذا كان اختبار reCAPTCHA غير المرئي على div بدلاً من زر. opt_widget_id معرّف الأداة الاختياري، ويتم ضبطه تلقائيًا على الأداة الأولى التي يتم إنشاؤها في حال عدم تحديدها.
grecaptcha.reset( ) #id_widget_id )	لإعادة تعيين أداة reCAPTCHA. opt_widget_id معرّف الأداة الاختياري، ويتم ضبطه تلقائيًا على الأداة الأولى التي يتم إنشاؤها في حال عدم تحديدها.
grecaptcha.getResponse( ) #id_widget_id )	للحصول على استجابة أداة reCAPTCHA. opt_widget_id معرّف الأداة الاختياري، ويتم ضبطه تلقائيًا على الأداة الأولى التي يتم إنشاؤها في حال عدم تحديدها.

أمثلة

العرض الصريح بعد معاودة الاتصال بالتحميل

<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>

استدعاء اختبار reCAPTCHA غير المرئي بعد التحقُّق من جانب العميل.

<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>