مقالات ذات وسم ’AJAX‘

كيفية استخدام reCAPTCHA في التطبيقات لمحاربة السخام

كلنا قد مر علينا أسلوب أو أكثر من أساليب الكابتشا CAPTCHA عند إبحارنا على الشبكة. فعند التسجيل في المواقع أو طرح التعليقات، تأتينا بعض صور الكلمات أو الأحرف المقطعة والملونة. وبعض الأحيان، يتم استخدام أساليب أخرى، كعرض بعض الصور واختيار أنسب صورة للسؤال المطروح. كل هذا يتم للتحقق ما إذا كان المستخدم بشراً وليس آلةً.

رﻱكابتشا أتت بمفهوم جديد، ونقلت الكابتشا نقلة نوعية. فمع حفاظها على السبب الرئيس وهو التفريق بين البشر والآلة، ومن ثم الحماية من السخام. فهي تقوم بعرض كلمات إنجليزية مفهومة، وليس بعض الأحرف والأرقام العشوائية. والسبب وراء ذلك هو محاولة الشركة رقمنة الكتب التي كتبت قبل اختراع الحاسوب. وتحوليها إلى كتب إلكترونية يسهل أرشفتها والبحث فيها، عبر المدخلات التي يكتبها المستخدمون بصورة كابتشا.

سأقوم في هذا المقال بشرح طريقة تطبيق رﻱكابتشا باستخدام 3 طرق مختلفة. أولاً باستخدام PHP، وبعدها بتطبيق شكل مخصص ليتلائم أكثر مع شكل الموقع المراد إدراج الخدمة فيه، وأخيراً باستخدام تقنية أجاكس AJAX.

ria-venn-diagram_small

Rich Internet Application – RIA - وتترجم تطبيقات الويب الغنية، هو الإسم الذي يطلق على تطبيقات الويب التي تحاكي تطبيقات سطح المكتب في سهولة الوصول، طرق إتصالات متقدمة، كبر وتعقيد النظام، إمكانية العمل بدون إنترنت “كلياً أو جزئياً”، الأمان، السرعة، واجهات المستخدم الغنية. قد يكون الجزء تشابه واجهات هذه التطبيقات مع تطبيقات سطح المكتب هو الأكثر أهمية لدى المستخدم النهائي، لكن مطور تطبيقات الإنترنت يجب أن يلم بالموضوع بشكل أكبر! عندما بدأت التفكير بعقد مقارنة بين التقنيات المختلفة التي تمكنك من إنشاء RIA apps كنت أفكر في Flex و Silverlight و javaFX. ولكن ما أن بدأت البحث والمقارنة حتى وجدت تقنيات أخرى جديرة بالذكر، وهو ما أجبرني على فصل هذا الموضوع كمقدمة بسيطة وسريعة لكتابة تعريف سريع عن كل تقنية، وفتح باب النقاش لمن لديه الخبرة في أي واحدة منها، لنصل معاً إلى مقارنة منطقية قائمة على أسس واضحة وسليمة. لنبدأ ؟

في هذا الدرس سنركز على تقنية أجاكس (AJAX)، ولن أقوم بإعادة اختراع العجلة أو أشرح من الصفر متى ظهرت هذه التقنية أو طريقة استخدامها مباشرة. ما سأشرحه فقط هو كيفية التعامل مع الأجاكس من خلال مكتبة jQuery.
ولنبدأ:

هناك ثلاث مستويات في المكتبة للتعامل مع الأجاكس:

  • أولاً : load
  • ثانياً : $.get و $.post
  • ثالثا : $.ajax

التعريف بالحدث أو الأحداث

الحدث هو وقوع شيء ما، أي عندما نمرر الفأرة على رابط أو نضغط عليه فهذا يسمى حدث Event .
المثال ينطبق على كل العناصر داخل الصفحة

المثال الذي وضعته في الدرس السابق هو حدث click أي عندما نضغط على شيء نطلب منه ان يفعل كذا وكذا بلغة javascript

الأحداث في لغة javascript

وهي كالتالي:

  • onClick
  • onMouseover
  • onMouseout
  • onKeypress

قبل ان نبدأ درسنا أود أن تعرف أنك بحاجة إلى معرفة مسبقة باستخدام أوامر جافاسكريبت لأن المكتبة مبنية عليها، وكذلك معرفة أوامر html/xhtml css ولو القليل.

إذا وجدت نفسك على دراية بما ذكرت فكمل معي هذه الدروس وإلا فمن الأفضل لك أن تأخذ فكرة عن هذه المكتبة حالياً، وبعد تعلمك المطلوب تقرأ موضوعي مجدداً حتى تحقق أفضل فائدة :) عذراً على هذا الكلام ولكن هذا لمصلحتك عزيزي.

مكتبة JQuery هي عبارة عن دوال وأوامر تختصر عليك الكثير من الوقت والجهد. كذلك فيها مميزات رائعة، فتستطيع إضافة تأثيرات جميلة على صفحتك ومعالجة أحداث الصفحة بالمتصفح بسهولة ودون معالجتها بالخادم لما يستغرق من وقت.

يمكنك تحميل المكتبة من موقعها الرسمي www.jQuery.com وقم بتحميل آخر إصدار من المكتبة (الإصدار الحالي عند وقت كتابة هذا الدرس هو 1.2.6).

2 أغسطس 2006

أغلب التقنيات لدينا لها إيجابيات وسلبيات، وفي العادة تغلب الإجابيات على السلبيات، والعكس صحيح في بعض الأحيان، ففي هذا المقال سوف أوضح إجابيات وسلبيات تقنية AJAX. ولأن أكثرنا يعرف إيجابيات هذه التقنية، فلم أركز عليها بقدر تركيزي على السلبيات، وسأذكر هنا 4 إيجابيات و 4 سلبيات، وأرجوا إن كانت هناك حلول لها حسب رأيكم أن نناقشها حتى نصل لنتيجة جيدة.

29 يوليو 2006

الأجاكس تقنية جديدة والتي أخذت الويب إلى مرحلة جديدة كليا والتي تسمى في الوقت الحالي بالويب 2.0، فما هي الأجاكس؟
الأجاكس AJAX وهي بالعادة تكتب كاملة بالحروف اللاتينية الكبيرة لأنها تعتبر اختصار لكلمة (Asynchronous Javascript And XML).

والأجاكس كانت موجودة منذ زمن، ولكن لم يعرف أحد أهميتها أو كيفية استخدامها بالشكل الصحيح حتى قامت شركة Google بتوظيفها في برامجها الجديدة مثل Gmail و Google maps، وتتيح الأجاكس لمطوري الويب بإضافة حيوية وديناميكية للموقع كإضافة معلومات حية كأسعار البورصة، من دون الحاجة لإعادة تحميل الصفحات كلما أراد المستخدم أن يطلب معلومة من Server-Side أوعن طريق الخادم، فلغات برمجة الويب تنقسم إلى قسمان Client-Side وهي كالجافاسكربت وVBScript. وقسم يسمى Server-Side وهي مثل php و asp، و تقنية الأجاكس في الأساس هي استخدام للغة الجافاسكربت وهي لغة Client-Side لطلب أي معلومة موجودة على Server-Side من دون الحاجة لطلب كامل الصفحة.