قبل يومين، طلبت مني إحدى صديقاتي مساعدتها في إنشاء استطلاع عبر الإنترنت، لأنه لم تكن هناك وظائف كافية في فكونتاكتي (يمكنك إنشاء استطلاع هناك لـ 15 شخصًا فقط). تبين أن المشكلة مثيرة للاهتمام. لذلك، دعونا نبدأ العمل!

من قد يجد هذه المشاركة مفيدة:

نقوم بتثبيت Joomla - كل شيء هناك شفاف ومفهوم تمامًا.

المرحلة 3: JS API و"API in Contact"

ما لدينا في ترسانتنا: تطبيق VKontakte جديد وموقع ويب تم إنشاؤه حديثًا على بعض قوالب Joomla القياسية.

هنا أود أن ألفت انتباهكم على الفور إلى واجهة برمجة التطبيقات في جهة الاتصال!

هناك نوعان من واجهة برمجة التطبيقات:

جافا سكريبت API

واجهة برمجة التطبيقات في الاتصال

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

احتمالات الثاني أكبر بكثير! يمكن الوصول إلى البرنامج النصي www.vkontakte.ru/api.php بأي طريقة مناسبة، سواء كان ذلك طلب AJAX أو طلب HTTP مباشرة من الخادم. يوجد وصف لجميع أساليب API.

الآن دعونا نتعلم المزيد حول تهيئة واجهة برمجة التطبيقات والعمل معها. لنبدأ بالترتيب:

تتم تهيئة واجهة برمجة تطبيقات JS عن طريق إضافة JavaScript التالي إلى القالب الخاص بنا:

src=http://vkontakte.ru/js/api/xd_connection.js?2

VK.init(وظيفة() (

// الرمز الخاص بك هنا
});

أود أن أشير على الفور إلى أن "تهيئة واجهة برمجة التطبيقات (API) نجحت"، تمت كتابة هذا السطر هنا لسبب ما ويعني أنه سيتم تنفيذ وظيفة VK.init عندما تكون واجهة برمجة التطبيقات (API) جاهزة للعمل! ولكن ليس مورد الويب الخاص بك. للتحقق من جاهزية كود JS الخاص بك للتنفيذ، يمكنك استخدام مكتبة أو إطار عمل JS المفضل لديك. أنا شخصياً أفضّل Mootools - وهذا ما استخدمته.

يبدو رمز التهيئة الخاص بي كما يلي:

VK.init(وظيفة() (
// نجحت تهيئة واجهة برمجة التطبيقات
window.addEvent("domready", function())(
// دوم جاهز
})
});

ماذا نستطيع ان نفعل الآن؟ والآن يمكننا استخدام واجهة برمجة التطبيقات (API)، أي، على سبيل المثال، التحقق مما إذا كان المستخدم قد حدد المعلمات المطلوبة للتطبيق للوصول إلى بياناته. على سبيل المثال مثل هذا:

VK.api("getUserSettings"، الوظيفة(البيانات)(
إذا (البيانات.الاستجابة)(
إذا (!(256 & data.response))
VK.callMethod("showSettingsBox", 263);
}
إذا (خطأ في البيانات)(
تنبيه("رمز الخطأ:"+data.error.error);
}
});

للقيام بذلك، نقوم أولاً باستدعاء وظيفة getUserSettings، والتي ستعيد لنا قناعًا بتيًا لإعدادات المستخدم الحالي. يتم إجراء الاستدعاء باستخدام أسلوب VK.api، حيث تكون المعلمة الأولى هي اسم الوظيفة، والثانية هي وظيفة CallBack. متغير البيانات هو نتيجة وظيفة getUserSettings، والتي تحتاج إلى التحقق من الأخطاء؛ إذا تم إرجاع data.error، فهذا يعني وجود خطأ! يمكن أن يكون الخطأ لسببين (في رأيي): لم تتم الموافقة على التطبيق من قبل إدارة الموقع (قبل الموافقة، عملت معي فقط getProfiles، بالمناسبة، صادفت لاحقًا منشورات في المنتديات تفيد بأن كل شيء يعمل في وضع الاختبار ). إذا أعادت الوظيفة data.response، فإننا نواصل العمل، والتحقق من أقنعة البت للحقوق الحالية والحقوق المطلوبة واستدعاء وظيفة JS API showSettingsBox بمعلمة واحدة (قناع الحقوق المطلوبة، لدي 263 - هذا هو الوصول للصور والأصدقاء ورابط للتطبيق في قائمة المستخدم اليسرى)

في رأيي، استدعاء أساليب "API in Contact" باستخدام JS API ليس جيدًا إلى حد ما. وهذا مناسب للمهام البسيطة. يعد تطبيق Iframe المبني على JS كثيف العمالة للغاية. وهكذا ننتقل إلى دراسة طلبات HTTP إلى واجهة برمجة التطبيقات (API).

المرحلة 4: PHP و"API in Contact"

لهذا لدينا جملة وفئة نأخذها من الرابط

للعمل مع واجهة برمجة التطبيقات عبر PHP، ستحتاج إلى إنشاء ثوابتين؛ سيتضمن كل طلب api_id الخاص بتطبيقك (يمكن رؤيته مباشرة في شريط العناوين عند اتباع الرابط إلى التطبيق) والمفتاح السري - هو. يصدر عند إنشاء التطبيق (وهو طويل ويمكن تغييره في إعدادات التطبيق)

يبدو استدعاء API باستخدام PHP كما يلي:

foreach ($this->العناصر كـ $item)(
$uids = $item->item;
}
$api = جديد vkapi();
$ans = $api->api("getProfiles"، array("uids" => Iplode("،,$uids), "fields" => "photo, photo_big"));

يأخذ البحث الأول جميع المستخدمين المسجلين من تطبيقي (ولكن ليس أكثر من 1000)، ثم يتم تقديم طلب إلى "API in Contact" لتحميل بيانات حول هؤلاء المستخدمين. الإخراج عبارة عن مصفوفة من القيم مثل: $ans["response"][$i]["field"]، حيث الاستجابة عبارة عن مصفوفة من البيانات حول المستخدمين، ثم عنصر $i وأخيرًا حقل خاصية المستخدم المطلوبة، على سبيل المثال الاسم الأول (الاسم) أو الصورة.

مزايا هذا النهج:

1. أصبحت طرق API الآمنة متاحة، وهو أمر مهم إذا كنت بحاجة إلى معرفة الرصيد أو إضافة/سحب الأصوات.
2. لا حاجة لكتابة "آلاف" من أسطر كود JS للعمل مع واجهة برمجة التطبيقات
3. نحصل على موقع وتطبيق يسهل إدارتهما في نفس الوقت.

سيستغرق الأمر وقتًا طويلاً جدًا لمعرفة ما فعلته بالضبط في Joomla وليست هناك حاجة لذلك، سأقدم فقط منطقًا تقريبيًا لكيفية عمل تطبيقي.

ليس سراً أن جميع مكونات Joomla تعتمد على نمط MVC. الذي يضع كل شيء على الرفوف!

تقبل وحدة التحكم في المكون جميع أوامر/طلبات المستخدم (حتى بالنسبة لإجراءات المستخدم عند اتباع الروابط، أو استخدام طلبات AJAX باستخدام JS)

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

يتحكم العرض في إخراج التخطيطات المختلفة ونقل البيانات من النموذج إليها.

بالنسبة لأولئك الذين قاموا بتطوير مكونات Joomla، كل شيء واضح للغاية.

لا أحد يمنعنا من استخدام فئة vkapi.class.php في أي مكان في التطبيق شخصيًا، لقد استخدمتها فقط في العرض لإعداد البيانات للإخراج (على سبيل المثال، باستخدام معرف المستخدم الخاص بالمستخدمين في جهة الاتصال التي قامت بتثبيت تطبيقي، حملت عناوين الصور)

المرحلة 5: الحاجيات

لقد اعتاد الجميع بالفعل على عدد كبير من الأشكال والأزرار المختلفة من الشبكات الاجتماعية. أردت أيضًا واحدًا في تطبيق Iframe الخاص بي. كيفية ربط القطعة التعليقات:

لا ينبغي بأي حال من الأحوال إضافة الكود التالي إلى صفحتك:

هذا مناسب لمواقع الويب، ولكنه غير مناسب لتطبيقات Iframe!

كل ما عليك فعله هو القيام بهذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"));

تحتوي واجهة برمجة تطبيقات JS بالفعل على وظائف لإضافة عناصر واجهة المستخدم.

أما بالنسبة للتعليقات نفسها، فأنت تعلم أنه عندما يترك المستخدم تعليقًا على الصفحة التي بها التطبيق، يتم نشره أيضًا على حائطه، ولكن مع رابط لموقع الويب الخاص بك، وليس للتطبيق! لتجنب ذلك، تحتاج إلى استخدام معلمة pageURL، والتي ستشير إلى عنوان التطبيق بالتنسيق www.vkontakte.ru/app (app_id)

في النهاية حصلت على هذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"، pageURL: "http://vkontakte.ru/app2176209"));

المرحلة 6: الاستنتاج

والنتيجة ليست معقدة، ولكن التطبيق العملي في الاتصال. والتي يمكن توسيعها وتطويرها بسهولة عن طريق إضافة ميزات ومكونات جديدة وجديدة باستخدام نظام إدارة المحتوى (CMS) المفضل لديك مع VKontakte API وJS API.

شكرا لاهتمامكم، مع أطيب التحيات دانيلا.

ملاحظة. وافقت الإدارة على الطلب في اليوم التالي، وطلبت 10 أصوات كوديعة.
P.P.S بعد ساعة ونصف من ذلك، تم تلقي العديد من عروض الشراء بالفعل! سأقول على الفور أنه ليس للبيع، لا أرى المعنى، خاصة الآن!

مساء الخير. في هذا المنشور أود تحليل خدمة عرض الأصدقاء المشتركين وأعضاء المجموعة المشتركة في vk.com. أريد أيضًا أن أخبرك بما واجهته عند مراجعة الإشراف في دليل التطبيق.

ولذلك، لإضافة تطبيقك إلى vk.com، فأنت بحاجة إليه أولاً يخلق.

1. إعداد المشروع والقليل عن الطلب الأول لواجهة برمجة التطبيقات (API).

بعد نحن تم إنشاء تطبيق iframe، يجب علينا تكوينه. دعنا نذهب إلى إعدادات التطبيق.

أرسل الطلب الأول حتى أنه عند بدء التطبيق، يعود VK.COM إليّ على الفور، باستخدام معلمة GET api_result، بيانات مفصلة حول المستخدم الذي دخل التطبيق.

طلب واجهة برمجة التطبيقات الأول:

method=users.get&user_ids=(viewer_id)&fields=photo_50&format=json&v=5.28

ثانيا. النقاط الرئيسية للتنفيذ في JS

قد تنشأ صعوبات في التنفيذ في وقت استلام أعضاء المجموعة؛ لا يُرجع VK API أكثر من 1000 مشارك في طلب واحد. إذا قمت بتقديم طلب من هذا القبيل، فستكون عملية الحصول على قائمة المشاركين طويلة جدًا. لقد قمت بحل هذه المشكلة باستخدام الكود الموضح في مقالتي السابقة، والذي يمكنك من خلاله الحصول على 25000 مشارك في المرة الواحدة.

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

تعمل جميع الطرق في إحصائيات طلب واجهة برمجة التطبيقات (API) بدون أخطاء، باستثناء الطريقة utils.resolveScreenNameويرجع ذلك إلى قيام المستخدمين بإدخال روابط غير صحيحة في حقل الإدخال.

ثالثا. نحن نخضع للإعتدال في كتالوج التطبيق

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

نقوم بتثبيت Joomla - كل شيء هناك شفاف ومفهوم تمامًا.

المرحلة 3: JS API و"API in Contact"

ما لدينا في ترسانتنا: تطبيق VKontakte جديد وموقع ويب تم إنشاؤه حديثًا على بعض قوالب Joomla القياسية.

هنا أود أن ألفت انتباهكم على الفور إلى واجهة برمجة التطبيقات في جهة الاتصال!

هناك نوعان من واجهة برمجة التطبيقات:

جافا سكريبت API

واجهة برمجة التطبيقات في الاتصال

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

احتمالات الثاني أكبر بكثير! يمكن الوصول إلى البرنامج النصي www.vkontakte.ru/api.php بأي طريقة مناسبة، سواء كان ذلك طلب AJAX أو طلب HTTP مباشرة من الخادم. يوجد وصف لجميع أساليب API.

الآن دعونا نتعلم المزيد حول تهيئة واجهة برمجة التطبيقات والعمل معها. لنبدأ بالترتيب:

تتم تهيئة واجهة برمجة تطبيقات JS عن طريق إضافة JavaScript التالي إلى القالب الخاص بنا:

Src=http://vkontakte.ru/js/api/xd_connection.js?2

VK.init(وظيفة() (

// الرمز الخاص بك هنا
});

أود أن أشير على الفور إلى أن "تهيئة واجهة برمجة التطبيقات (API) نجحت"، تمت كتابة هذا السطر هنا لسبب ما ويعني أنه سيتم تنفيذ وظيفة VK.init عندما تكون واجهة برمجة التطبيقات (API) جاهزة للعمل! ولكن ليس مورد الويب الخاص بك. للتحقق من جاهزية كود JS الخاص بك للتنفيذ، يمكنك استخدام مكتبة أو إطار عمل JS المفضل لديك. أنا شخصياً أفضّل Mootools - وهذا ما استخدمته.

يبدو رمز التهيئة الخاص بي كما يلي:

VK.init(وظيفة() (
// نجحت تهيئة واجهة برمجة التطبيقات
window.addEvent("domready", function())(
// دوم جاهز
})
});

ماذا نستطيع ان نفعل الآن؟ والآن يمكننا استخدام واجهة برمجة التطبيقات (API)، أي، على سبيل المثال، التحقق مما إذا كان المستخدم قد حدد المعلمات المطلوبة للتطبيق للوصول إلى بياناته. على سبيل المثال مثل هذا:

VK.api("getUserSettings"، الوظيفة(البيانات)(
إذا (البيانات.الاستجابة)(
إذا (!(256 & data.response))
VK.callMethod("showSettingsBox", 263);
}
إذا (خطأ في البيانات)(
تنبيه("رمز الخطأ:"+data.error.error);
}
});

للقيام بذلك، نقوم أولاً باستدعاء وظيفة getUserSettings، والتي ستعيد لنا قناعًا بتيًا لإعدادات المستخدم الحالي. يتم إجراء الاستدعاء باستخدام أسلوب VK.api، حيث تكون المعلمة الأولى هي اسم الوظيفة، والثانية هي وظيفة CallBack. متغير البيانات هو نتيجة وظيفة getUserSettings، والتي تحتاج إلى التحقق من الأخطاء؛ إذا تم إرجاع data.error، فهذا يعني وجود خطأ! يمكن أن يكون الخطأ لسببين (في رأيي): لم تتم الموافقة على التطبيق من قبل إدارة الموقع (قبل الموافقة، عملت معي فقط getProfiles، بالمناسبة، صادفت لاحقًا منشورات في المنتديات تفيد بأن كل شيء يعمل في وضع الاختبار ). إذا أعادت الوظيفة data.response، فإننا نواصل العمل، والتحقق من أقنعة البت للحقوق الحالية والحقوق المطلوبة واستدعاء وظيفة JS API showSettingsBox بمعلمة واحدة (قناع الحقوق المطلوبة، لدي 263 - هذا هو الوصول للصور والأصدقاء ورابط للتطبيق في قائمة المستخدم اليسرى)

في رأيي، استدعاء أساليب "API in Contact" باستخدام JS API ليس جيدًا إلى حد ما. وهذا مناسب للمهام البسيطة. يعد تطبيق Iframe المبني على JS كثيف العمالة للغاية. وهكذا ننتقل إلى دراسة طلبات HTTP إلى واجهة برمجة التطبيقات (API).

المرحلة 4: PHP و"API in Contact"

لهذا لدينا جملة وفئة نأخذها من الرابط

للعمل مع واجهة برمجة التطبيقات عبر PHP، ستحتاج إلى إنشاء ثوابتين؛ سيتضمن كل طلب api_id الخاص بتطبيقك (يمكن رؤيته مباشرة في شريط العناوين عند اتباع الرابط إلى التطبيق) والمفتاح السري - هو. يصدر عند إنشاء التطبيق (وهو طويل ويمكن تغييره في إعدادات التطبيق)

يبدو استدعاء واجهة برمجة التطبيقات (API) باستخدام PHP كما يلي:

Foreach ($this->العناصر كـ $item)(
$uids = $item->item;
}
$api = جديد vkapi();
$ans = $api->api("getProfiles"، array("uids" => Iplode("،,$uids), "fields" => "photo, photo_big"));

يأخذ البحث الأول جميع المستخدمين المسجلين من تطبيقي (ولكن ليس أكثر من 1000)، ثم يتم تقديم طلب إلى "API in Contact" لتحميل بيانات حول هؤلاء المستخدمين. الإخراج عبارة عن مصفوفة من القيم مثل: $ans["response"][$i]["field"]، حيث الاستجابة عبارة عن مصفوفة من البيانات حول المستخدمين، ثم عنصر $i وأخيرًا حقل خاصية المستخدم المطلوبة، على سبيل المثال الاسم الأول (الاسم) أو الصورة.

مزايا هذا النهج:

1. أصبحت طرق API الآمنة متاحة، وهو أمر مهم إذا كنت بحاجة إلى معرفة الرصيد أو إضافة/سحب الأصوات.
2. لا حاجة لكتابة "آلاف" من أسطر كود JS للعمل مع واجهة برمجة التطبيقات
3. نحصل على موقع وتطبيق يسهل إدارتهما في نفس الوقت.

سيستغرق الأمر وقتًا طويلاً جدًا لمعرفة ما فعلته بالضبط في Joomla وليست هناك حاجة لذلك، سأقدم فقط منطقًا تقريبيًا لكيفية عمل تطبيقي.

ليس سراً أن جميع مكونات Joomla تعتمد على نمط MVC. الذي يضع كل شيء على الرفوف!

تقبل وحدة التحكم في المكون جميع أوامر/طلبات المستخدم (حتى بالنسبة لإجراءات المستخدم عند اتباع الروابط، أو استخدام طلبات AJAX باستخدام JS)

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

يتحكم العرض في إخراج التخطيطات المختلفة ونقل البيانات من النموذج إليها.

بالنسبة لأولئك الذين قاموا بتطوير مكونات Joomla، كل شيء واضح للغاية.

لا أحد يمنعنا من استخدام فئة vkapi.class.php في أي مكان في التطبيق شخصيًا، لقد استخدمتها فقط في العرض لإعداد البيانات للإخراج (على سبيل المثال، باستخدام معرف المستخدم الخاص بالمستخدمين في جهة الاتصال التي قامت بتثبيت تطبيقي، حملت عناوين الصور)

المرحلة 5: الحاجيات

لقد اعتاد الجميع بالفعل على عدد كبير من الأشكال والأزرار المختلفة من الشبكات الاجتماعية. أردت أيضًا واحدًا في تطبيق Iframe الخاص بي. كيفية ربط القطعة التعليقات:

لا ينبغي بأي حال من الأحوال إضافة الكود التالي إلى صفحتك:

هذا مناسب لمواقع الويب، ولكنه غير مناسب لتطبيقات Iframe!

كل ما عليك فعله هو القيام بهذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"));

تنفذ JS API بالفعل وظائف لإضافة عناصر واجهة المستخدم.

أما بالنسبة للتعليقات نفسها، فأنت تعلم أنه عندما يترك المستخدم تعليقًا على الصفحة التي بها التطبيق، يتم نشره أيضًا على حائطه، ولكن مع رابط لموقع الويب الخاص بك، وليس للتطبيق! لتجنب ذلك، تحتاج إلى استخدام معلمة pageURL، والتي ستشير إلى عنوان التطبيق بالتنسيق www.vkontakte.ru/app (app_id)

في النهاية حصلت على هذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"، pageURL: "http://vkontakte.ru/app2176209"));

المرحلة 6: الاستنتاج

والنتيجة ليست معقدة، ولكن التطبيق العملي في الاتصال. والتي يمكن توسيعها وتطويرها بسهولة عن طريق إضافة ميزات ومكونات جديدة وجديدة باستخدام نظام إدارة المحتوى (CMS) المفضل لديك مع VKontakte API وJS API.

وهنا ما حصلت عليه.

6 مارس 2011 الساعة 02:13 مساءً تطوير تطبيق IFrame في جهة الاتصال باستخدام Vkontakte API

• تطوير الموقع

نقوم بتثبيت Joomla - كل شيء هناك شفاف ومفهوم تمامًا.

المرحلة 3: JS API و"API in Contact"

ما لدينا في ترسانتنا: تطبيق VKontakte جديد وموقع ويب تم إنشاؤه حديثًا على بعض قوالب Joomla القياسية.

هنا أود أن ألفت انتباهكم على الفور إلى واجهة برمجة التطبيقات في جهة الاتصال!

هناك نوعان من واجهة برمجة التطبيقات:

جافا سكريبت API

واجهة برمجة التطبيقات في الاتصال

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

احتمالات الثاني أكبر بكثير! يمكن الوصول إلى البرنامج النصي www.vkontakte.ru/api.php بأي طريقة مناسبة، سواء كان ذلك طلب AJAX أو طلب HTTP مباشرة من الخادم. يوجد وصف لجميع أساليب API.

الآن دعونا نتعلم المزيد حول تهيئة واجهة برمجة التطبيقات والعمل معها. لنبدأ بالترتيب:

تتم تهيئة واجهة برمجة تطبيقات JS عن طريق إضافة JavaScript التالي إلى القالب الخاص بنا:

Src=http://vkontakte.ru/js/api/xd_connection.js?2

VK.init(وظيفة() (

// الرمز الخاص بك هنا
});

أود أن أشير على الفور إلى أن "تهيئة واجهة برمجة التطبيقات (API) نجحت"، تمت كتابة هذا السطر هنا لسبب ما ويعني أنه سيتم تنفيذ وظيفة VK.init عندما تكون واجهة برمجة التطبيقات (API) جاهزة للعمل! ولكن ليس مورد الويب الخاص بك. للتحقق من جاهزية كود JS الخاص بك للتنفيذ، يمكنك استخدام مكتبة أو إطار عمل JS المفضل لديك. أنا شخصياً أفضّل Mootools - وهذا ما استخدمته.

يبدو رمز التهيئة الخاص بي كما يلي:

VK.init(وظيفة() (
// نجحت تهيئة واجهة برمجة التطبيقات
window.addEvent("domready", function())(
// دوم جاهز
})
});

ماذا نستطيع ان نفعل الآن؟ والآن يمكننا استخدام واجهة برمجة التطبيقات (API)، أي، على سبيل المثال، التحقق مما إذا كان المستخدم قد حدد المعلمات المطلوبة للتطبيق للوصول إلى بياناته. على سبيل المثال مثل هذا:

VK.api("getUserSettings"، الوظيفة(البيانات)(
إذا (البيانات.الاستجابة)(
إذا (!(256 & data.response))
VK.callMethod("showSettingsBox", 263);
}
إذا (خطأ في البيانات)(
تنبيه("رمز الخطأ:"+data.error.error);
}
});

للقيام بذلك، نقوم أولاً باستدعاء وظيفة getUserSettings، والتي ستعيد لنا قناعًا بتيًا لإعدادات المستخدم الحالي. يتم إجراء الاستدعاء باستخدام أسلوب VK.api، حيث تكون المعلمة الأولى هي اسم الوظيفة، والثانية هي وظيفة CallBack. متغير البيانات هو نتيجة وظيفة getUserSettings، والتي تحتاج إلى التحقق من الأخطاء؛ إذا تم إرجاع data.error، فهذا يعني وجود خطأ! يمكن أن يكون الخطأ لسببين (في رأيي): لم تتم الموافقة على التطبيق من قبل إدارة الموقع (قبل الموافقة، عملت معي فقط getProfiles، بالمناسبة، صادفت لاحقًا منشورات في المنتديات تفيد بأن كل شيء يعمل في وضع الاختبار ). إذا أعادت الوظيفة data.response، فإننا نواصل العمل، والتحقق من أقنعة البت للحقوق الحالية والحقوق المطلوبة واستدعاء وظيفة JS API showSettingsBox بمعلمة واحدة (قناع الحقوق المطلوبة، لدي 263 - هذا هو الوصول للصور والأصدقاء ورابط للتطبيق في قائمة المستخدم اليسرى)

في رأيي، استدعاء أساليب "API in Contact" باستخدام JS API ليس جيدًا إلى حد ما. وهذا مناسب للمهام البسيطة. يعد تطبيق Iframe المبني على JS كثيف العمالة للغاية. وهكذا ننتقل إلى دراسة طلبات HTTP إلى واجهة برمجة التطبيقات (API).

المرحلة 4: PHP و"API in Contact"

لهذا لدينا جملة وفئة نأخذها من الرابط

للعمل مع واجهة برمجة التطبيقات عبر PHP، ستحتاج إلى إنشاء ثوابتين؛ سيتضمن كل طلب api_id الخاص بتطبيقك (يمكن رؤيته مباشرة في شريط العناوين عند اتباع الرابط إلى التطبيق) والمفتاح السري - هو. يصدر عند إنشاء التطبيق (وهو طويل ويمكن تغييره في إعدادات التطبيق)

يبدو استدعاء واجهة برمجة التطبيقات (API) باستخدام PHP كما يلي:

Foreach ($this->العناصر كـ $item)(
$uids = $item->item;
}
$api = جديد vkapi();
$ans = $api->api("getProfiles"، array("uids" => Iplode("،,$uids), "fields" => "photo, photo_big"));

يأخذ البحث الأول جميع المستخدمين المسجلين من تطبيقي (ولكن ليس أكثر من 1000)، ثم يتم تقديم طلب إلى "API in Contact" لتحميل بيانات حول هؤلاء المستخدمين. الإخراج عبارة عن مصفوفة من القيم مثل: $ans["response"][$i]["field"]، حيث الاستجابة عبارة عن مصفوفة من البيانات حول المستخدمين، ثم عنصر $i وأخيرًا حقل خاصية المستخدم المطلوبة، على سبيل المثال الاسم الأول (الاسم) أو الصورة.

مزايا هذا النهج:

1. أصبحت طرق API الآمنة متاحة، وهو أمر مهم إذا كنت بحاجة إلى معرفة الرصيد أو إضافة/سحب الأصوات.
2. لا حاجة لكتابة "آلاف" من أسطر كود JS للعمل مع واجهة برمجة التطبيقات
3. نحصل على موقع وتطبيق يسهل إدارتهما في نفس الوقت.

سيستغرق الأمر وقتًا طويلاً جدًا لمعرفة ما فعلته بالضبط في Joomla وليست هناك حاجة لذلك، سأقدم فقط منطقًا تقريبيًا لكيفية عمل تطبيقي.

ليس سراً أن جميع مكونات Joomla تعتمد على نمط MVC. الذي يضع كل شيء على الرفوف!

تقبل وحدة التحكم في المكون جميع أوامر/طلبات المستخدم (حتى بالنسبة لإجراءات المستخدم عند اتباع الروابط، أو استخدام طلبات AJAX باستخدام JS)

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

يتحكم العرض في إخراج التخطيطات المختلفة ونقل البيانات من النموذج إليها.

بالنسبة لأولئك الذين قاموا بتطوير مكونات Joomla، كل شيء واضح للغاية.

لا أحد يمنعنا من استخدام فئة vkapi.class.php في أي مكان في التطبيق شخصيًا، لقد استخدمتها فقط في العرض لإعداد البيانات للإخراج (على سبيل المثال، باستخدام معرف المستخدم الخاص بالمستخدمين في جهة الاتصال التي قامت بتثبيت تطبيقي، حملت عناوين الصور)

المرحلة 5: الحاجيات

لقد اعتاد الجميع بالفعل على عدد كبير من الأشكال والأزرار المختلفة من الشبكات الاجتماعية. أردت أيضًا واحدًا في تطبيق Iframe الخاص بي. كيفية ربط القطعة التعليقات:

لا ينبغي بأي حال من الأحوال إضافة الكود التالي إلى صفحتك:

هذا مناسب لمواقع الويب، ولكنه غير مناسب لتطبيقات Iframe!

كل ما عليك فعله هو القيام بهذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"));

تنفذ JS API بالفعل وظائف لإضافة عناصر واجهة المستخدم.

أما بالنسبة للتعليقات نفسها، فأنت تعلم أنه عندما يترك المستخدم تعليقًا على الصفحة التي بها التطبيق، يتم نشره أيضًا على حائطه، ولكن مع رابط لموقع الويب الخاص بك، وليس للتطبيق! لتجنب ذلك، تحتاج إلى استخدام معلمة pageURL، والتي ستشير إلى عنوان التطبيق بالتنسيق www.vkontakte.ru/app (app_id)

في النهاية حصلت على هذا:

VK.Widgets.Comments("vk_comments"، (الحد: 10، العرض: "578"، إرفاق: "*"، pageURL: "http://vkontakte.ru/app2176209"));

المرحلة 6: الاستنتاج

والنتيجة ليست معقدة، ولكن التطبيق العملي في الاتصال. والتي يمكن توسيعها وتطويرها بسهولة عن طريق إضافة ميزات ومكونات جديدة وجديدة باستخدام نظام إدارة المحتوى (CMS) المفضل لديك مع VKontakte API وJS API.

وهنا ما حصلت عليه.

بالقرب من رئيس الجامعة 28 أبريل 2012 الساعة 11:46 مساءً VK API + Iframe للدمى. الدرس 1. عرض الصور الرمزية للأصدقاء

تم إنشاء الموضوع لنماذج VK API ولكن للمبرمجين الذين يفهمون ماهية php وjavascript وjquery وcss.

إذا كنت تعرف كل ما سبق، خذ بضع دقائق لقراءة هذا الموضوع واتبع التعليمات. لن يأخذك وقتا طويلا! ستتمكن من توسيع قدراتك ودخول سوق جديدة. أهم ما يميز التطبيقات هو أن VK يوفر حركة مرور وسيشاهد تطبيقك ألف شخص فور الموافقة عليه (1-2 يوم). سأخبرك في هذا البرنامج التعليمي بكيفية إنشاء تطبيق وعرض الصور الرمزية للأصدقاء في عمود.

شخصيا، كان من الصعب جدا بالنسبة لي أن أفهم ماذا وأين، ولهذا السبب جاءت فكرة هذا الموضوع.

1. انتقل إلى صفحة المطورين: vk.com/developers.php

2. قم بإنشاء تطبيق بالضغط على الزر الأزرق.

3. أدخل الاسم، وحدد النوع - iframe/Flash وأي فئة

4. نتلقى رسالة نصية قصيرة من VK تؤكد أننا لسنا روبوتًا. نحن هابرامان!

5. مرحا - مرحا - مرحا! لقد قمت بإنشاء تطبيقك الأول (أو ربما ليس تطبيقك الأول)! بعد ذلك، انتقل إلى "الإعدادات".

6. حدد: الحالة - التطبيق ممكّن ومرئي للجميع، نوع التطبيق: iframe. مطلوب تثبيت التطبيق. طلب الوصول إلى - الوصول إلى الأصدقاء. أدخل عنوان البرنامج النصي (في حالتي، سيتم استضافة البرنامج النصي في المنطقة المحلية).
انتباه! الحد الأقصى لعرض التطبيق هو 827 بكسل.

7. الآن افتح ملف Index.php الخاص بنا واملأه:

8. يبدو أنه لا يوجد شيء معقد في الكود أعلاه. فلنكمل. سنقوم الآن بتوصيل البرامج النصية لـ VKontakte API.

9. الآن سوف نستخدم برنامجًا نصيًا لتغيير ارتفاع Iframe اعتمادًا على المحتوى. لنفترض أن ارتفاع التطبيق في الإعدادات هو 500 بكسل. ماذا لو كان لدينا 200 صديق وكان هناك 200 صورة رمزية في العمود؟ ما يجب القيام به؟ لهذا نقوم بإنشاء برنامج نصي - vk_height.js

VK.init(function())( )); وظيفة autosize(width) ( // التحقق من وجود عنصر الجسم. if (!document.getElementById("body")) ( تنبيه ("خطأ"); return; ) // هل تم توصيل البرنامج النصي VK بنجاح if (typeof VK) .callMethod != "unified") ( /* اتصل بوظيفة vk js api للتحكم في النافذة. VK.callMethod("function"، بارامترات) في هذه الحالة لدينا - VK.callMethod("window_resizing"، width, height) نضيف أيضًا 60 بكسل أخرى لجعل مسافة صغيرة */ VK.callMethod("resizeWindow", 840, document.getElementById("body").clientHeight + 60 ) else ( تنبيه("error #2"); ) ) $ (document).ready(function())( // اتصل بوظيفة تعديل الارتفاع كل نصف ثانية.setInterval("autosize(607)", 500); ));

10. الآن دعونا نربط vk_height.js الخاص بنا بـ Index.php

11. دعونا نكتب مرحباً بالعالم! في ملف Index.php
مرحبا بالعالم!

12. حان الوقت للعمل مع VK JS API نفسها.

تذكرني VK API بالكثير من jquery. الأشخاص الذين يعرفون $.post، $.get، $.ajax سوف يفهمون على الفور ما هو. انتباه! بشكل افتراضي، تأتي البيانات من VK بتنسيق json.

// وظيفة استقبال الأصدقاء وعرضهم على الشاشة function doIt())( /* VK.api("method"، (المعلمة: "value")، وظيفة رد الاتصال( // العمل مع البيانات المستلمة )); * / VK.api ("friends.get"، (الحقول: "photo_medium")، function(data) ( // الإجراءات مع البيانات المستلمة for(c=0;c