Сегодня речь пойдет о создании своего первого приложения для сайта «Вконтакте». Ну и как исторически сложившееся традиция, это будет программа «Hello World!».
Речь пойдет об IFrame приложении. Для тех кто не знает, эта технология позволяет создать приложение, используя ресурсы своего сайта. Другими словами, приложение — это фрейм с Вашим Интернет адресом.
Пусть наш сайт находится по адресу: http://mysite.ru. Для того, что бы не засорять директорию основного сайта, создадим папку в корне сайта и назовем ее «vk».
Создадим в нашей новой папке файл «index.php» с содержанием пустого HTML документа.
<html>
<head>
<title>Hello World!</title>
</head>
<body>
</body>
</html>
Добавим поле в котором будет выводится имя и фамилия человека, открывшего прложение.
<html>
<head>
<title>Hello World!</title>
</head>
<body>
Hello World, <b id="who">?</b>!
</body>
</html>
Теперь, перейдем непосредствнно к сути вопроса. Первое что необходимо сделать — это подключить методы для работы с API контакта. Для этого добавим в тег HEAD следующую строку:
<script src="http://vkontakte.ru/js/api/xd_connection.js?2" type="text/javascript"></script>
Ну и далее собственно сам код нашего первого приложения…
<html>
<head>
<title>Hello World!</title>
<script src="http://vkontakte.ru/js/api/xd_connection.js?2"
type="text/javascript"></script>
</head>
<body onload="F()">
<script type="text/javascript">
d = document;
function F() {
VK.init(function() {
VK.api("getProfiles",
{uids: <?php echo "\"".$_GET["viewer_id"]."\""?>},
function(data){
if (data.error)
alert(data.error.error_msg);
else
if (data.response) {
d.getElementById("who").innerHTML =
data.response[0].last_name + " " +
data.response[0].first_name;
}});
});
}
</script>
Hello World, <b id="who">?</b>!
</body>
</html>
Несколько комментариев по коду выше. Параметры для приложения передаются GET запросом, все параметры можно посмотреть на сайте ВКонтакте или вызовом функции alert(location.href);
VK.init — Обязательная функция, которая инициализирует глобальный объект VK, необходимый для работы приложения.
VK.api — Функция вызова процедуры VK API, первым параметром передается функция для вызова, второй параметр — параметры вызываемой функции, третий параметр — callBack функция, т.е. функция которая вызовится после выполнения указанного метода. В нашем случае функция «getProfiles» возвращает информацию о пользователе, она имеет один обязательный параметр — id пользователя на сайте ВКонтакте.
Важно: На стринцу приложения передается два параметра отвечающих за идентификацию пользователя — это viewer_id и user_id. viewer_id — id пользователя, просматривающего приложение, user_id — id пользователя пригласившего данного пользователя в приложение. Например, при переходе по ссылке http://vkontakte.ru/app2270785 переменная user_id будет равна нулю, а при переходе по ссылке http://vkontakte.ru/app2270785_3596080 эта переменная будет равна 3596080.
data — в нашем случае возвращемый объект функции API. Может иметь поле error или response, в первоем случае это говорит о том что выполнить запрос не удалось, во втором случае мы имеем массив результатов работы функции. В нашем случае запросили инфомрацию одного пользователя, а значит получили одноэлементный массив.
Для ознакомления с методами и возвращаемыми значениями можно перейти по этой ссылке: http://vkontakte.ru/developers.php#devstep2
