Топик создан для чайников VK API но для программистов которые понимают что такое php, javascript, jquery, css.
Если вы знаете всё выше перечисленное уделите несколько минут для прочтения этого топика и следуйте инструкции. У вас это не займет много времени! Вы сможете расширить свои возможности и выйти на новый рынок. Изюминка приложений в том, что ВК дает трафик и ваше приложение сразу после одобрения (1-2 дня) увидит тысяча людей. В данном уроке я расскажу как сделать приложение и вывести аватары друзей в столбец.
Мне лично было очень сложно понять что и где, по этому и появилась идея данного топика.
1. Заходим на страницу разработчиков: vk.com/developers.php
2. Создаем приложение нажав на синюю кнопку.
3. Вводим название, выбираем тип - iframe/Flash и любую категорию
4. Получаем смс от ВК, подтверждаем что мы - не бот. Мы - хабрамэн!
5. Ура - ура - ура! Вы создали ваше первое приложение (а может и не первое)! Далее заходим в «Настройки».
6.
Выбираем: Состояние - приложение включено и видно всем, Тип приложения: iframe. Установка приложения - требуется. Запрашивать доступ к - доступ к друзьям. Вводим адрес на скрипт (в моем случае скрипт будет размещен на локалке).
Внимание! Максимальная ширина приложения - 827 пикс.
7.
Теперь открываем наш index.php
и заполняем его:
8. Вроде ничего сложно в выше сказанном коде нету. Продолжим. теперь мы подключим скрипты Вконтакте API.
9. Теперь мы будем использовать скрипт для изменения высоты Iframe в зависимости от содержимого. Допустим у нас высота приложения в настройках - 500 пикс. А если у нас 200 друзей и будет 200 аватаров в столбец? Что делать? По этому создаем скрипт - vk_height.js
VK.init(function(){ }); function autosize(width) { //Проверяем элемент body на наличие. if (!document.getElementById("body")) { alert("error"); return; } // Успешно ли подключен ВК скрипт if (typeof VK.callMethod != "undefined") { /* Вызываем функцию vk js api для управления окном. VK.callMethod("функция", параметры) В данном случае у нас - VK.callMethod("изменение_размеров_окна", ширина, высота); Так же добавляем еще 60 пикселей что бы было небольшое расстояние. */ VK.callMethod("resizeWindow", 840, document.getElementById("body").clientHeight + 60); } else { alert("error #2"); } } $(document).ready(function(){ //Вызываем функцию регулировки высоты каждые пол секунды. setInterval("autosize(607)", 500); });
10.
Теперь подключим наш vk_height.js
к index.php
11.
Пропишем Hello, world! в index.php
Hello, world!
12. Настало время работы с самим VK JS API.
Api ВК очень напоминает мне jquery. Людям которые знают $.post, $.get, $.ajax сразу поймут что к чему. Внимание! По умолчанию данные от ВК приходят в json.
// Функция получения друзей и вывода их на экран function doIt(){ /* VK.api("метод", {параметр: "значение"}, callback функция{ // работаем с полученными данными }); */ VK.api("friends.get", {fields: "photo_medium"}, function(data) { // Действия с полученными данными for(c=0;c
