ВКонтакте API 3.0. Пример простого приложения

Только готовые уроки по использованию ВКонтакте API. Flash + PHP + API. НЕ IFrame!
Аватара пользователя
Александр
Создатель сайта
Создатель сайта
Сообщения: 4574
Зарегистрирован: 27 сен 2009, 16:45

ВКонтакте API 3.0. Пример простого приложения

Сообщение Александр »

ВКонтакте API 3.0. Пример простого приложения
ActionScript 3.0

Приложение показывает имя, фамилию, дату рождения и аватар пользователя просматривающего приложение.

Этот урок показывает как можно обратиться к api.vkontakte.ru/api.php или api.vk.com/api.php используя версию ВКонтакте API 3.0.
Пример подобного приложения, но с использование ВКонтакте API 2.0 здесь https://flapps.ru/forum/topic3.html

Этот урок для общего понимания как формируется сигнатура и как приложение взаимодействует с сервером api. Для взаимодействия с другими методами api проще будет использовать готовую официальную библиотеку APIConnection. Урок Использование APIConnection (getProfiles).

1. В Adobe Flash создаём Новый документ.
Добавляем на сцену UILoader с вкладки COMPONENTS (Window -> Components).
Изображение
Этот компонент можно разместить за пределами сцены или вообще удалить со сцены. В библиотеке нужно оставить.
Это необходимо сделать, чтобы Flash подключил нужные пакеты.

2. Создаём Main.as и пишем код:

Код: Выделить всё

/* https://flapps.ru/forum/ - форум о создании флеш приложений на основе ВКонтакте API */package {    import flash.net.URLLoader;    import flash.net.URLRequest;    import flash.net.URLVariables;    import flash.net.URLRequestMethod;    import flash.display.*;    import flash.events.*;    import flash.text.TextField;    import fl.containers.UILoader;     public class Main extends Sprite    {        private var api_id:Number = 1728947;// ID приложения        private var url_loader:URLLoader;        private var url_request:URLRequest;        private var viewer_id;        private var secret:String;        private var sid:String;        private var api_url:String;         private var bdate_tf:TextField = new TextField();        private var name_tf:TextField = new TextField();        private var avatar:UILoader = new UILoader  ;         public function Main():void        {            // получаем данные из flashVars            // id просматривающего приложение            viewer_id = LoaderInfo(root.loaderInfo).parameters.viewer_id;            // secret для генерации сигнатуры            secret = LoaderInfo(root.loaderInfo).parameters.secret;            // id сессии            sid = LoaderInfo(root.loaderInfo).parameters.sid;            // адрес API-сервиса            api_url = LoaderInfo(root.loaderInfo).parameters.api_url;             // для тестирования локально, можно прописать их здесь (брать в исходном коде страницы с приложением)            /*            viewer_id = '1';            secret = 'abcd123456';            sid = 'abcd123456abcd123456abcd123456abcd123456abcd123456abcd1234';            api_url = 'http://api.vkontakte.ru/api.php';            */            // вызываем функцию получения профиля пользователя, просматривающего приложение            getProfile(viewer_id);        }         private function getProfile(uid):void        {            // параметры которые будем передавать в запросе и которые нужны для формирования сигнатуры            // параметры для формирования сигнатуры            var request_params: Object = new Object();            request_params.api_id = api_id;            request_params.method = 'getProfiles';            request_params.format = 'XML';            request_params.v = '3.0';            request_params.fields = 'bdate,photo_big';            request_params.uids = uid;             // параметры для отправки запроса            var variables:URLVariables = new URLVariables();            // часть параметров берем из request_params            for (var j:String in request_params)            {                variables[j] = request_params[j];            }            variables['sid'] = sid;// параметр sid нужно передавать в запросе, но он не используются при создании сигнатуры            variables['sig'] = generate_signature(request_params);// генерируем сигнатуру. Функция generate_signature описана ниже.             // подготавливаем запрос            url_request = new URLRequest(api_url);            // данные будем отправлять POST запросом            url_request.method = URLRequestMethod.POST;            // добавляем параметры в запрос            url_request.data = variables;            // отправляем запрос            url_loader = new URLLoader  ;            url_loader.addEventListener(Event.COMPLETE,onComplete);            url_loader.load(url_request);        }                // запрос выполнен        private function onComplete(event:Event):void        {            var response:XML = new XML(url_loader.data);             // выводим дату рождения пользователя            var bdate = response..bdate;            bdate_tf.text = bdate;            bdate_tf.x = 490;            bdate_tf.y = 380;            addChild(bdate_tf);             // выводим имя и фамилию пользователя            name_tf.text = response..first_name + ' ' + response..last_name;            name_tf.x = 410;            name_tf.y = 360;            addChild(name_tf);             // выводим аватарку пользователя            avatar.autoLoad = true;            avatar.scaleContent = false;            avatar.source = response..photo_big;            avatar.move(175,10);            addChild(avatar);        }         // функция генерации сигнатуры        private function generate_signature(request_params):String        {            var signature = '';            // сортируем параметры в алфавитном порядке            var sorted_array: Array = new Array();            for (var key in request_params)            {                sorted_array.push(key + "=" + request_params[key]);            }            sorted_array.sort();             // создаем строку параметров;            for (key in sorted_array)            {                signature +=  sorted_array[key];            }            signature = viewer_id + signature + secret;            return MD5.encrypt(signature);        }        // https://flapps.ru/forum    }}
Заменяем app_id на id вашего приложения.
Скачиваем файл MD5.as. Копируем его в папку с Main.as.

3. Подключаем Main.as к fla
Если не знаете как, то посмотрите как это было сделано в этом уроке https://flapps.ru/forum/topic3.html

4. Загружаем приложение в контакт
Редактирование -> Настройки -> Обновление SWF-приложения -> Обзор -> Начать загрузку.

- Если включен контейнер, то выключаем
Редактирование -> Настройки -> Flash-контейнер -> Без использования контейнера.

5. Всё готово!


Локальное тестирование приложения

Для локального тестирования, нужно указать в приложении нужные параметры. В функции Main() меняем эти значения на свои. Узнать их можно в исходном коде страницы с приложением.

Код: Выделить всё

            // для тестирования локально, можно прописать их здесь (брать в исходном коде страницы с приложением)            viewer_id = '1';            secret = 'abcd123456';            sid = 'abcd123456abcd123456abcd123456abcd123456abcd123456abcd1234';            api_url = 'http://api.vkontakte.ru/api.php';


Исходник https://flapps.ru/example/vkontakte_api_3.0_example.rar
m1cky
Сообщения: 18
Зарегистрирован: 04 авг 2010, 17:56

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение m1cky »

А где про сам API 3.0 почитать можно?
Аватара пользователя
Влад
Модератор
Модератор
Сообщения: 654
Зарегистрирован: 29 апр 2010, 22:24

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение Влад »

Супер!
Аватара пользователя
FireStorm3000
Сообщения: 80
Зарегистрирован: 03 янв 2010, 18:17

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение FireStorm3000 »

интересует

Код: Выделить всё

  // id сессии     sid = LoaderInfo(root.loaderInfo).parameters.sid; 
его можно как нибудь использовать от 2 захода пользователем в приложение?
Noise Gate
Сообщения: 691
Зарегистрирован: 28 апр 2010, 12:34

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение Noise Gate »

А меня вот интересует, как взять параметры для локального тестирования автоматически, без залезания в код страницы?
Аватара пользователя
paduchin
FL Team
FL Team
Сообщения: 318
Зарегистрирован: 01 мар 2010, 14:20

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение paduchin »

Спасибо ! :)
Аватара пользователя
Александр
Создатель сайта
Создатель сайта
Сообщения: 4574
Зарегистрирован: 27 сен 2009, 16:45

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение Александр »

FireStorm3000
Для автора приложения sid действует месяц, для других пользователей сутки.
Или что тебя интересует?

Noise Gate
Можно один раз создать простое приложение, которое будет выводить эти данные. Но его придется загружать в контакт.
Ещё можно написать простой яваскрипт, вставить его в адресную строку и вывести нужные параметры.
Noise Gate
Сообщения: 691
Зарегистрирован: 28 апр 2010, 12:34

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение Noise Gate »

Александр писал(а):Можно один раз создать простое приложение, которое будет выводить эти данные. Но его придется загружать в контакт.
Ещё можно написать простой яваскрипт, вставить его в адресную строку и вывести нужные параметры.
Это я понимаю, но хотелось полной автономности... Надо порыться в теме, кажется, кто-то там упоминал про десктоп авторизацию или что-то подобное...
m1cky
Сообщения: 18
Зарегистрирован: 04 авг 2010, 17:56

Re: ВКонтакте API 3.0. Пример простого приложения

Сообщение m1cky »

А для контейнера используемые методы работать не будут как я понимаю?Вопрос,можно ли как-нибудь получить имя со страницы пользователя (пол),используя контейнер?
Ответить