Question

是否可以在网页上跟踪用户的每个操作并创建日志？我们的想法是通过AJAX将用户操作的日志传输到服务器并保存。在每个元素的每个事件上，我可以编写代码/逻辑来编写一些登录控制台，但我想知道是否有任何库/快捷方式可以记录客户端网页上的所有操作，包括事件和操作，如复制，粘贴，点击，双击，选择等及其元素参考。

Answer 1

您可以使用现成的解决方案：

您可以使用Google Analytics及其事件跟踪器做出惊人的事情：

如果您正在寻找定制解决方案，可以使用PHP和JavaScript尝试以下方案：

http://css-tricks.com/tracking-clicks-building-a-clickmap-with-php-and-jquery/

请注意，使用第三方解决方案的性能更佳。实时编写数据库中鼠标移动的坐标需要大量资源。

Answer 2

我不认为这种javascript库存在，您可以轻松地使用jquery构建一个，只需听取所有事件（blur focus focusin focusout load resize scroll unload click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup error）

并使用web sockets

将它们发送到服务器端

Answer 3

你看看Google Analytic Event Tracking吗？

您需要在javascript中嵌入跟踪功能，但使用起来非常方便。

// Google API
_trackEvent(category, action, opt_label, opt_value, opt_noninteraction)

// Example
_trackEvent('checkout' 'remove-item' 'poodle skirt')

更新：2017 New Analytics Api

// Api
ga('send', 'event', [eventCategory], [eventAction], [eventLabel], [eventValue], [fieldsObject]);

// Example remove product id#27
ga('send', 'event', 'ecart', 'remove-item', 'poodle skirt', 27);
   // OR
ga('send', {
      hitType: 'event',
      eventCategory: 'ecart',
      eventAction: 'remove-item',
      eventLabel: 'poodle skirt'
   });

Answer 4

我个人会讨厌第三方，例如 google analytics 和类似的公司。因为我不想与他们共享我的网络分析。无论如何，都有一个非常非常轻量（最小约5KB）和易于扩展的JavaScript库。

这里是git 回购：https://github.com/greenstick/interactor 并且您可以看到它的预览：http://greenstick.github.io/interactor/

提供了什么数据？

常规数据：

哪个页面已加载
用户加载页面时
用户离开页面时
已加载页面的网址
上一页位置
页面标题
用户的语言设置
用户平台
用于访问Web服务器的端口
网络浏览器的内部和外部宽度和高度

互动/转化数据：

互动类型（即一般互动或转化）
互动时间
触发互动的事件
目标HTML元素标签
目标HTML元素类
目标HTML元素的内容（即文本等）
相对于客户端的光标位置
相对于屏幕的光标位置

示例：

var elementsToTrack = [
{
    element: "element1",
    events : ["mouseup", "touchend"]
}, 
{
    element: "element2",
    events : ["mouseup"]
},
{ 
    element: "element3",
    events : ["mouseup"]
}
];

for (var i = 0; i < elementsToTrack.length; i++) {
var e = elementsToTrack[i];
new Interactor({
    interactionElement  : e.element,
    interactionEvents   : e.events
});
}

我希望这些信息会有所帮助。

用户活动跟踪或使用javascript记录

4 个答案: