مقدمة
موقعك الإلكتروني دايما حاسس بالوحدة، كل ما تخش الموقع يسألك هل انت روبوت؟ هل انت روبوت؟ عايز يتأكد انك روبوت زيك زيه عشان هو بيدور على حد شبهه ينكشوا في بعض.. لو انت انسان فهتاخد كامل الإحترام والتقدير، هيخليك تعدي الطريق منغير ما ينكشك ولا ييجي جنبك، إنما بقى لو كنت روبوت فيمسكه يبهدله ويتخانق معاه وحرفيا اى روبوت هيلمحُه هيمرجحُه..
حرفيا يا صديقي دا المعنى والغرض الحرفي لحاجة اسمها reCAPTCHA. ولو متعرفش دا ايه فخليني اقولك انها من أهم أدوات الدفاع عن موقعك من البوتات الضارة.. اصبر معايا في القراءة عشان هشرحلك الموضوع بالتفصيل وبالخطوات العملية وهشرحلك كل حاجة ليها علاقة بالموضوع دا..
خلينا نخش في صلب الموضوع ونسأل اسئلة تجيب من الاخر.. هو ايه اصلا الـreCAPTCHA دا؟ وبيشتغل ازاي؟ وازاي انشئه؟ واربطه بالموقع ازاي؟ وايه هي المواضع المهمة اللي المفروض اشغله فيها؟
لو كنت سألت الاسئلة دي بعضها او كلها.. فالله ينور عليك دي الأسئلة اللي فعلا لازم نجني ثمارها بالرد عليها.
ما هو الـreCAPTCHA؟
بإختصار ليس مُخِل دي أداة بتخلي موقعك يتحقق من طبيعة الزائر على الموقع، بيتحقق هل طبيعته آلية أم طبيعة بشرية، وبناءا عليه بياخد فعل معين تجاه النتيجة اللي بيعملها من خلال التحقق دا..
خليني أبسطهالك بقى بسرد ليس مُخِل برضو، الزائر بيخش موقعك (ممكن يكون زائر حقيقي او زائر بوت) الأداة بتكشف عن دا هل الزائر حقيقي بشري فعلا بيستخدم الكمبيوتر وبيخش يتصفح؟ ولا مجرد بوت مبرمج بشكل معين ودخل موقعك لأي غرض كان؟ طيب لو بشري؟ بيخليه ياخد صلاحية عادي.. لو آلي او بوت ومش بشري؟ بيمنعه من دا..
طيب بيسمحله بايه او بيديله صلاحية على ايه؟ ولو آلي بينزع منه صلاحية ايه برضو؟ الصلاحيات دي انت اللي بتحددها، يعني مثلا انا مش عايز حد يضغط على يملي البيانات دي ويبعتلي ايميل الا اما يكون انسان حقيقي، فبتقوم حاطط reCAPTCHA هنا عشان ميتبعتش الا اما يعمل تحقق انه فعلا زائر حقيقي.. دا مجرد مثال..
أضرار عدم وجود الـreCAPTCHA
فيه مشكلة في مجالنا وخصوصا في مواقع الووردبريس إن حمايتها مبتكنش جاهزة 100% ومن أحد الحمايات دي إن موقعك مبيبقاش ضد البوتات اللي بتخش المواقع بشكل عشوائي وتتشعب جواه، قد يبدو الموضوع غير مضر ظاهريا بس خليني اقولك ان البوت دا ممكن يعمل بلاوي واللي بسببها الموقع بتاعك يقع مثلا، ايوة موقعك مش هيخترق بس هيواجه مشاكل كتير في الموقع والسيرفر..
طب ليه كل الكلام دا؟ دا ببساطة لأن البوت ممكن يخش عندك يتصفح موقعك صفحة صفحة ويعمل Loop لا نهائية جوة صفحاتك ويستهلك الـbandwidth بتاعت السيرفر بتاعك كلها ويوقعلك الموقع او ياخد جزء كبير من إستهلاك موارد السيرفر، وبناءا عليه موقعك هيتأثر بشكل كبير..
دا غير إن لو عندك استمارة تواصل او صفحة بيتعمل فيها اتمام الطلب على action معين زي الـLogin والـRegisteration والـOrder Confirmation فالـreCAPTCHA دي بتتأكد ان الـaction دا مش هيتعمل من خلال روبوت إفتراضي، وانما شخص حقيقي فعلا هو اللي بيعمل العملية دي.
بالإضافة إلى ان ممكن يحصل عليك Brute Attack بمنتهى السهولة وعلى الرغم من إنك ممكن تمنع دا بطرق تانية، الا إن الـreCAPTCHA بتلعب دور في الموضوع دا وبسبب إنك مش عامل reCAPTCHA ممكن موقعك يخترق بشكل مباشر، وما أدراك ما هي أضرار الـBrute Attack.. دا ببساطة هجمة من هجمات الويب اللي شغالة بآلية التخمين.. بيخش موقعك يخمن بيانات تسجيل الدخول على الأدمن او على أي حساب آخر.. بيكشف اول حاجة على اليوزرات اللي موجودة ويختار اليوزرات الحساسة اللي في الموقع زي الـEditor والـAdmin وبعدها بيخمن الباسوورد عن طريق ملف جواه 10 او 20 مليون باسوورد مستخدمه وشائعة حول العالم، وهو وحظه بقى..
متخيل حجم المشكلة اللي ممكن يسببها عدم وجود reCAPTCHA في موقعك؟
آلية عمل الـreCAPTCHA وأنواعها
تعالى نتخيل سيناريو نقدر نشرح عليه، تخيل انت عندك صفحة وظائف في الموقع وحاطط في الصفحة دي استمارة بيانات المتقدمين وبتخليهم يرفعوا الـCV في الاستمارة وعايز تمنع البوتات عشان ميعملوش spam على الاستمارة..
عندك أنواع من الـreCAPTCHA كتير جدا، بس انا هتكلم عن الـ3 أنواع المتاحين في Google reCAPTCHA لأن دا اللي هنشرحه عملي..
الـreCAPTCHA v2
ببساطة دا عبارة عن زر بتسمح للزائر انه يضغط عليه عشان يتحقق انك مش روبوت، لو دوست على الزر دا يبقى انت انسان، لو مدوستش يبقى انت انسان برضو بس آلي. ودا اسهل نوع موجود في آلية العمل، مجرد صندوق تدوس عليه يقولك تم التحقق بس كدا.
الـreCAPTCHA v3
دي بقى هي النسخة اللي بعد reCAPTCHA v2 ودي فكرتها مختلفة شوية لأنها بتعتمد على الصور، ودي افضل بكتير جدا بس أحيانا بتبقى صعبة ومعقدة للزائر نفسه، دي ببساطة بتظهر مجموعة من الصور ويسألك سرال بناءا على الصور دي، ولو اختارت الصور المقصودة بشكل صحيح هيتم التحقق وهتاخد السماحية، لو مخترتش صح مش هيتم التحقق بنجاح. على سبيل المثال:
- اختر السيارات الموجودة في الصور.
- اختر الكباري اللي في الصورة.
- قم بتحديد اشارات المرور الموجودة في الصورة.
- قم بتحديد السلم الموجود في الصورة.
- اختر الباصات الموجودة في الصور.
وهاكذا.. دي شوية امثلة على الأسئلة الشائعة اللي بتظهرلك، بس الجدير بالذكر إن الصور دي عمرها ما هتتكرر معاك ابدا، دائما وابدا كل ما هتخش عملية التحقق دي هتلاقي صور مختلفة. ودا الجميل اللي في الموضوع.
الـreCAPTCHA invisible
دا بقى الحل السحري، دا الزر الخفي، بيتم التحقق بشكل خفي، بدون ما يطلب من الزائر أي نوع من أنواع التحقق، او مجرد ما الزائر بيخش بيقوم بالتحقق بنفسه بدون اى تدخل من الزائر.
طريقة انشاء الـreCAPTCHA
أول حاجة محتاج تروح تدور على مزود خدمة الـreCAPTCHA وحقيقي فيه شركات كتير بتعمل الموضوع دا أشهرهم CloudFlare وGoogle وفي المقال دا انا هشرح الطريقة بتاعت جوجل.
بعد ما تختار مزود الخدمة -جوجل- هتروح بعدها لموقع جوجل للمطورين وهتروح تختار خدمة الـreCAPTCHA او بكل بساطة هتروح على الخدمة على طول من خلال [سجل الدخول لترى الرابط]
اول ما يفتح معاك اتأكد انك مختار الحساب بتاعك الصح اللي عايز تنشيء عليه الـAPI وهتدوس على Get Started عشان تبدأ تنشيء أول reCAPTCHA ليك..
دلوقتي هيفتحلك الـDocumentation بتاع الـreCAPTCHA ولو مش عارف دا ايه فدا من اهم الحاجات اللي لازم تعرفها في عالم الويب وفي مجال البرمجة بشكل عام، بس دا مش موضوعنا دلوقتي لو حابب تعرف هو ايه انصحك تقرأ فقرة الـDocumentation اللي اتكلمت عنها في المقال دا ([سجل الدخول لترى الرابط])، هتدوس على كلمة [سجل الدخول لترى الرابط][سجل الدخول لترى الرابط][سجل الدخول لترى الرابط] اللي على الشمال وبعدين هتدوس على [سجل الدخول لترى الرابط][سجل الدخول لترى الرابط][سجل الدخول لترى الرابط][سجل الدخول لترى الرابط][سجل الدخول لترى الرابط].
هيوديك على صفحة يقولك دخل فيها بيانات الـreCAPTCHA ببساطة البيانات دي هي اسم الموقع بتاعك ودي خطوة ضرورية جدا عشان تمنع سرقة الكود بتاعك -مش هكلمك عن النقطة دي دلوقتي- من الـFront-End. وهتختار نوع الـreCAPTCHA اللي انت بتفضله انا هنا هختار reCAPTCHA v2 checkbox. وبعد كدا اضغط على زر Submit في الأسفل.
بعد ما دخلت إسم الموقع هيطلعلك كودين، الكود الأول Site Key والكود التاني Site Secret الكودين دول اسمهم API واحفظ المصطلح دا عشان هيتكرر معاك في اي حاجة في الدنيا وانصحك تقرأ اكتر عنه، المهم هيجيلك كمان انك تختار نسخة/نوع الـreCAPTCHA نفسها.. طبعا هيكون جواها الـ3 أنواع اللي اتكلمنا عنهم فوق.. الـreCAPTCHA v2 والـreCAPTCHA v3 والـreCAPTCHA invisible اختار اللي يناسبك وبعد كدا هتاخد الكودين اللي فوق اللي هما الـAPIs وتحفظهم في مكان أمين عشان هنحتاجهم قدام.
هتلاقي فيه خيار انك تختار مدى قوة الـBot Detection اللي هي مدى قوة التعرف على الروبوت اللي هي اسمها هنا في الصورة الـSecurity Preference بتاعت الـreCAPTCHA دي انا افضل انك تسيبها default متغيرهاش إلا في حالات فردية او لغرض معين انت محتاج تغيرها بسببه، زي مثلا انك عايز ترفع قوته عشان تمنع البوتات بشكل أكبر، او انك تقلل عشان تسمح بدخول بعض البوتات المفيدة لموقعك وهاكذا.. فانا انصحك تسيبها زي ما هي لحين إشعار آخر.
وخد بالك من الأيقونة اللي تحت على اليمين دي. دي شكل الـreCAPTCHA invisible اللي اتكلمنا عنها قبل كدا، مش بيطلب منك أي فعل تعمله عشان يتحقق منك هي بس بتكون ظاهره كدا على الشاشة عشان تقولك إن الموقع مفعل عليه الـreCAPTCHA invisible وزي ما احنا شايفين جوجل نفسها بتستخدمها في موقعها.
لو عملت كل الخطوات اللي فاتت دي بنجاح فمبروك يا صديقي انت كدا انشئت الـreCAPTCHA بنحاح، مش فاضل غير إنك تربطه بالموقع وتحطه في المواضع اللي انت محتاجها، تابع معايا.
كيفية إستخدام نفس الـreCAPTCHA في أكتر من موقع
لو انت عندك كذا موقع تحت موقعك باسماء مختلفة اللي هي sub-domains مختلفة يعني، مثلا عندك اتنين:
تسجيل الدخول لعرض الكود و تسجيل الدخول لعرض الكود
فانت كدا مش هتقدر تستخدم الـreCAPTCHA في الموقعين بشكل إفتراضي -احنا هنخليه ينفع بخطوة بسيطة- ودا ليه؟ لأنك كتبت في الاول اسم الموقع اللي الـAPI دا هيتقبل فيه، فبالتالي اما تيجي تحط الـAPI دا في موقعك عشان تشغل الـreCAPTCHA هتلاقي جوجل بيتحقق من الـAPI ومن اسم الموقع بتاعك لو كله تمام بيسمح إن الـreCAPTCHA يشتغل عادي، انما لو اسم الموقع مختلف مش هيسمحلك بدا نهائي، لهذا السبب انا قولتلك فوق ان خطوة انك تكتب الـDomain بتاعك مهمة عشان تمنع الكود او الـAPI من السرقة، الخطوة دي لو مش موجودة هتلاقي الناس كلها بتاخد الـAPI بتاعت مواقع تانية وتستخدمها لان الأكواد كلها متشافه للناس بما فيها الـAPI وبالتالي اي حد ممكن ياخده ويستخدمه ودا طبعا هيكون مضر، لذلك جوجل بيشترط انك تحدد اسم الموقع بتاعك.
طيب انا عندي اكتر من موقع اعمل ايه؟
ببساطة هتضيف الـDomain اللي انت عايزه مع الدومين الاول، هتلاقي فيه امكانية تضيف اكتر من موقع، طبعا يفضل لو عندك مواقع كتير بـDomains مختلفة اصلا يبقى تعمل لكل Domain واخد مخصص عشان ميحصلش تداخل في الـStatistics حتى لو عندك sub-domain يفضل تفصله، بس عادي مقبولة طالما نفس الـDomain، هتروح تضيف الـDomain بتاعك عادي او ممكن تضيف الـDomain دا:
تسجيل الدخول لعرض الكود
ودي معناها ان اي sub-domain موجود للدومين دا اسمحله عادي انه يستخدم الـAPI لان كلهم تبعي. انا انصحك تضيفها عشان تريح دماغك ويبقى اي حاجة تبع الاسم دا تقدر تستخدمه على طول منغير ما ترجع تغير في الاعدادات.
ستخدام الـreCAPTCHA في موقعك
تعالى بقى أقولك افضل المواضع اللي تحط فيها الـreCAPTCHA وبعد كدا هشرحلك ازاي تربطه بموقعك..
أهم المواضع لتفعيل الـreCAPTCHA
- فعل الـreCAPTCHA في صفحات تسجيل الدخول وإنشاء حساب.
- هتفعلها في اي إستمارة (Contact Form) موجودة في الموقع.
- تصفح الموقع بشكل عام فعل الـreCAPTCHA invisible.
كيفية ربط الـreCAPTCHA بالموقع
فيه إضافات كتير جدا بتدعم الـreCAPTCHA فلو انت بتستخدم إضافات معينة سواء إضافات Security او إضافات Form Builder او Page Builder او بتستخدم أي Elementor Addons بتدعم الـreCAPTCHA فببساطة تقدر تحط فيها الـAPI اللي معاك وهيشتغل في ثانية إلا ثانية..
طيب فرضا انا معنديش الكلام دا والإضافات اللي بستخدمها مش بتدعم الـreCAPTCHA، يبقى ببساطة هتحتاج تنزل إضافة تعملك الموضوع دا، لو بتستخدم Contact Form 7 يبقى هتروح تعمل سيرش في مكتبة إضافات الووردبريس وتكتب Contact Form 7 reCAPTCHA وتشوف الإضافات اللي هتظهرلك وتنزل أي واحدة وتحط فيها الـAPI بتاعك وتستخدم الـShortcode جوة الـForm بتاعتك، والله لو بتستخدم Gravity Forms او WPForms او Ninja Forms او ايا كان إسم إضافة الـContact Form اللي عندك ايه هتروح ببساطة تعمل نفس الموضوع هتكتب إسم الإضافة وبعدها reCAPTCHA وهتنزل الإضافة وتجرب وتحط الـAPI.
طيب الكلام دا لو انا بستخدمها في إستمارة Contact Form طيب لو عايز افعلها في تسجيل الدخول والتسجيل؟ ببساطة نفس الكلام لو بتستخدم إضافة Security هتلاقي فيها غالبا يعني الموضوع دا، هتحط الـAPI وشكرا، طيب لو لأ؟ هتروح تبحث عن Login Register reCAPTCHA وتحط الـAPI وشكرا.
شوفت ازاي الموضوع بسيط اوي؟
أفضل الإضافات اللي بتدعم الـreCAPTCHA
لو انت بقى مش عارف إضافة معينة بتعمل الموضوع دا ولسا الموضوع جديد عليك وأول مرة تعمله فانا هنا هحطلك قائمة من الإضافات اللي بتدعم الـreCAPTCHA عشان أسهل عليك عملية البحث، هظبطك متقلقش..
دي قائمة فيها 10 إضافات بتدعم الـreCAPTCHA بشكل مجاني 100% وكل إضافة بتفعل الـreCAPTCHA في مواضع مختلفة عشان أكون اتكلمت عن كل المواضع واغطي احتياجات اي قاريء، الجدول:
- Advanced Google reCAPTCHA
- ReCaptcha v2 for Contact Form 7
- Simple Google reCAPTCHA
- iTheme Security Pro
- WP Forms Pro
- Ninja Forms
- Login No Captcha reCAPTCHA
- reCaptcha by BestWebSoft
- CAPTCHA 4WP
- reCAPTCHA For WooCommerce
بس كدا، لو عجبك المقال تابعني وشوف باقي المقالات اللي في الموقع.
ممكن تقرأ المقال دا هيفيدك برضو بيتكلم في نفس الموضوع [سجل الدخول لترى الرابط]
