Задача: сбор статистики о том, что делает пользователь
В первом варианте будем собирать данные о том, как, сколько и где в окне браузера пользователь водил мышкой. На сайте используется JQuery поэтому на его основе пишем следующий простой код
var mouse_pos = []
var current_pos = ''
setInterval(function(){ mouse_pos.push(current_pos) }, 2000 )
jQuery(document).ready(function(){
$(document).mousemove(function(e){
current_pos = e.pageX +','+ e.pageY;
});
$(window).unload(function(){
saveLog()
})
setInterval(function(){
saveLog()
},10000)
})
function saveLog(){
$.get('/stats/', {l: JSON.stringify(mouse_pos)}, function(){
mouse_pos = [];
}
)
}
Код выполняет сбор координат мыши каждые две секунды и раз в 10 секунд посылает их на сервер. что бы не потерять данные между интервалами в момент закрытия окна или перехода по ссылки вешаем сброс данных на событие unload для для объекта $(window).
Запросы с данными координат мы скидываем на адрес домeна /stats/.
В качестве фронтенда мы используем nginx как быстрый и легкий сервер умеющий проксировать запросы.
Что бы меньше грузить сервер запросами решено запросы логировать, а уже потом обрабатывать периодически скриптом.
Для этого настраиваем обработку всех урлов начинающихся с /stats/ nginx
добавляем в конфиг nginx
location /stats/ {
set $id 'nocookie';
if ($http_cookie ~* "agentid=([^;]+)(?:;|$)" ) {
set $id $1;
}
log_format stats '$host $id [$time_local] "$request" "$http_referer"';
access_log logs/stats.log stats;
return 200;
}
В результате все запросы попадают в лог по заданному формату и в ответ получают статус 200 < /p>
ЗЫ Вот таким не хитрым и кустарным способом мы начали сбор статистики о движение мыши пользователя. Следующая задача отобразить визуально собранные данные. Попробуем решить ее в следующей заметке