Виджет комментариев вконтакте и хранение количества комментариев на сервере

Двигаясь в ногу со временем, я решил разместить на своем сайте виджет комментариев вконтакте. Немного терпения, гугла и документации вполне достаточно для того чтобы достичь результата. Разместить сам виджет не составляет никакого труда, вконтакте предоставляет интерфейс генерирующий код для сайта, копируем, меняем под себя и вроде всё ок. Мне хотелось в некоторых местах отображать количество комментариев. Тут и возникли сложности, как обычно это бывает, дьявол кроется в мелочах. Я попробую разложить по полочкам то, о чём умалчивает документация.

1.Регистрация приложения

Чтобы разместить сам виджет, сначала сайт следует зарегистрировать как приложение Вконтакте >>здесь. Заполняем форму, получаем СМС, еще раз заполняем форму, в результате регистрации приложения мы должны получить два ключа:

api_id — идентификатор нашего сайт как приложения в вконтакте

api_secret — секретный ключ, который знает только владелец приложения. По нему шифруются данные, которые иначе могут быть подменены/испорчены/искажены злоумышленником, т.е. используется как закрытый ключ для генерации электронной подписи на стороне вконтакте, нам он нужен, для того чтобы проверять на достоверность. И да, он нам тоже понадобится в дальнейшем.

P.S:Вконтакте предоставляем упрощенный способ регистрации приложения для виджета «Комментарии», но в этом случае невозможно получить ключ api_secret(по крайней мере я битый час искал способ его получить и… не нашёл), который необходим в случае хранения количества комментариев(подробнее дальше). Поэтому не ленимся и создаём приложение.

2.Создание виджета

Создаём сам виджет комментариев вконтакте, не имею желания дублировать документацию к виджету, скажу что в итоге должно получиться что-то вроде этого:

[html]
<script type="text/javascript">// <![CDATA[
VK.init({apiId: %ВАШ_api_id%, onlyWidgets: true});
VK.Widgets.Comments("vk_comments", {limit: 10, width: "1000", attach: "*", onChange: addCommentCallback}, "post_<?php echo $post[‘id’]?>");
// ]]></script>
[/html]

что такое onChange, читайте дальше; Третий параметр — это ID данного виджета(блока) комментариев, если его не указывать в качестве id используется md5-хэш от location.href(ссылки на эту страницу). Мне это не подошло, так как на один элемент у меня указывало несколько разных ссылок. На этой стадии виджет уже работает, теперь нужно сообразить отображение кол-ва комментариев.

3.Передача данных о количестве комментариев на сервер

Очевидно, что самым удачным вариантом является хранение количества комментариев в базе данных, даже если мы не храним сами комментарии, так как получение количества комментариев через API вконтакте будет слишком сильно тормозить работу сайта. Я храню количество коммеентариев в отдельном столбце таблицы с данными. Проблема только в том, как держать значение в базе данные количество в обновленном состоянии и избежать рассинхронизации.
API виджета комментария имеет параметр onChange. Функция, которую содержит параметр onChange, вызывается каждый раз при событии удаления/создания комментария. Колбек-функция onChange вызывается с четырьмя параметрами

num — количество комментариев
last_comment — последний комментарий
date — дата
sign — ключ

Это нам и нужно. Теперь пишем саму функцию addCommentCallback, она будет делать ajax запрос, передавая все 4 параметра выше, а также id записи на сервер. Вот что получилось у меня(используется jquery):

[javascript]
function addCommentCallback(num, last_comment, date, sign){
$.post("%ССЫЛКА_НА_СТРАНИЦУ_ОБРАБОТКИ_КОММЕНТАРИЯ%",
{
type: ‘vkontakte’,
num: num,
last_comment: last_comment,
date: date,
sign: sign,
id: "<!—?php echo $this—>post[‘id’]?>"
});
}
[/javascript]

Сомневаюсь, что вы хотите превращать свой сайт в забор на котором можно писать все что угодно, и в один прекрасный день вместо количества комментариев обнаружить слово из трех букв или нелестное мнение о вас и вашем сайте. Поэтому перед тем, как сохранить количество комментариев, мы проверяем, что данные, которые пришли от пользователя достоверны.

4.Валидация данных с помощью параметра sign

Теперь-то нам понадобится ключ api_secret, полученный нами при регистрации приложения. Повторюсь, лично я не нашел способа получить этот код, если регистрировать сайт через упрощенку.

php-код, обрабатывающий запрос, и пишущий в базу количество комментариев:

[php]
$post = $_POST;
if (!isset($post[‘num’])){
$error = ‘не указано количество’;
}
else {
$apiSecret = %ВАШ_API_SECRET%;//(да, за этим мы и прошли эту подлую регистрацию)
$hash = md5($apiSecret.$post[‘date’].$post[‘num’].$post[‘last_comment’]);// до того, как обновить количество комментариев, мы получаем md5 — хэш от параметров api_secret, date, num, last_comment:
if ($hash == $post[‘sign’]){//проверяем что хэши совпадают
//тут код сохранения в базу
}
else{
$error = ‘не совпадает хэш’;
}
}
[/php]

Вот и всё! При желании, можно в базу сохранять не только количество комментариев, но и сами комментарии. Цель достигнута, получаем полноценный виджет от соотечественников в одной руке и количество комментариев в другой. Надеюсь что статья оказалась полезной и я не потратил зря время.

Оставить комментарий