Webflow

ينزل Caputchin على موقع Webflow بشيفرة مخصّصة. لا يوجد تطبيق marketplace لتثبيته: تضيف الأداة تمامًا كما تضيف أي سكربت من طرف ثالث، وتوصّلها بنموذجك. وتعمل الأداة الكاملة والألعاب على حدّ سواء.

1. حمّل الأداة

افتح Site Settings → Custom Code في مشروعك، وألصق المُحمِّل في حقل Head Code:

<script src="https://cdn.jsdelivr.net/npm/@caputchin/widget@3/dist/widget.js"></script>

الـ @3 يثبّت الإصدار الأكبر الحالي، فتحصل على الإصلاحات والألعاب الجديدة دون كسر مفاجئ. ذلك السطر الواحد يسجّل عنصرَي <caputchin-widget> و <caputchin-game> للموقع كلّه. (انظر التكامل على جانب العميل لخيار npm إن كان لموقعك خطوة بناء.)

2. ضعها على نموذجك

في الـ Designer، أضف عنصر Embed (Add panel → Components → Embed) داخل الـ <form> الذي تريد حمايته، وضع الأداة فيه. استخدم مفتاح موقعك العام من لوحة التحكّم:

<caputchin-widget sitekey="cpt_pub_..." trigger="form-submit"></caputchin-widget>

trigger="form-submit" يشغّل الفحص عند إرسال النموذج ويحجب الإرسال حتى يُجتاز. وخانة الاختيار قابلة للنقر أيضًا: يستطيع الزائر نقرها ليتحقّق قبل الإرسال، فيُحقَن الرمز في مكانه دون إرسال النموذج. وعند النجاح (بالنقر أو بالإرسال)، تحقن الأداة حقل <input name="caputchin-token"> مخفيًّا في النموذج المحيط، وهو ما تقرأه خطوة التحقّق لديك.

للعبة بدل خانة الاختيار، استخدم <caputchin-game>:

<caputchin-game sitekey="cpt_pub_..." game="caputchin/games/leaf-memory" layout="inline"></caputchin-game>

3. أكّد الرمز

تُثبت الأداة أن إنسانًا اجتاز في المتصفّح؛ ومع ذلك تؤكّد أنت الرمز على الخادم قبل أن تثق بالإرسالية. اختر النمط الذي يناسب إعدادك.

خادمك الخلفي (مُوصى به إن كان لديك واحد)

افتح إعدادات النموذج في الـ Designer، واضبط Send to → Custom action، ووجّهه إلى نقطة نهايتك. يقرأ خادمك حقل caputchin-token ويؤكّده بـ /siteverify. انظر التكامل على جانب الخادم وانتقل من reCAPTCHA لنداء الخادم بالضبط.

التحقّق المُستضاف من Caputchin (بلا خادم خلفي)

إن كنت لا تشغّل خادمًا، فوجّه Custom action الخاص بالنموذج إلى رابط مُحوِّل التحقّق المُستضاف الذي تجده في لوحة التحكّم. يتحقّق Caputchin من الرمز ويسلّم الإرسالية إلى الـ webhook أو البريد لديك. هذه ميزة مدفوعة، وهي تحلّ محلّ صندوق الإرساليات الأصلي في Webflow (فالنموذج يرسل إلى Caputchin بدل Webflow). انظر التحقّق المُستضاف.

بوّابة العميل (رادع، لا تحقّق على الخادم)

اترك النموذج على معالج Webflow الأصلي واعتمد على trigger="form-submit" لمنع الإرسال حتى يُجتاز الفحص. هذا يرفع الحاجز أمام البوتات لكنه ليس ضمانًا متحقَّقًا منه على الخادم، فاستخدمه فقط حيث يكون ذلك مقبولًا.