使用 Javascript 進行實時基本網絡分析

Question

我需要開發一個內部實時分析解決方案（例如類似於 GA 或 mixpanel）來收集：

• 來自網站本身的信息 (URL)
• 來自用戶瀏覽器的信息（語言、設備、操作系統等）
• 來自參考來源的信息等。

.. 並通過單像素圖像請求將此數據發送到服務器。 類似於 GA 和其他解決方案的工作方式：

Google Analytics 的工作原理是在您網站的頁面上包含一段 JavaScript 代碼。 當您網站的用戶查看頁面時，此 JavaScript 代碼會引用一個JavaScript 文件，然后該文件會執行Analytics的跟蹤操作。 跟蹤操作通過各種方式檢索有關頁面請求的數據，並通過附加到單像素圖像請求的參數列表將此信息發送到分析服務器。

我想知道是否有任何可用的開源項目可以完成這部分，我可以將其用作進一步構建的基礎。 有Piwik但它的功能太豐富了，而且對於我的要求來說太重了。

編輯添加：我正在對數據做一些特定的事情，否則我只會使用現有的解決方案。

Answer 1

嘗試

var img = new Image;
img.width = img.height = "1px";
var res = window.navigator;
var data = {};
var _plugins = {};
Array.prototype.slice.call(navigator.plugins).forEach(function(v, k) {
  _plugins[v.name.toLowerCase().replace(/\s/, "-")] = {
    "name": v.name,
    "description": v.description,
    "filename": v.filename
  }
});
delete res.plugins && delete res.mimeTypes;
data.url = window.location.href;
data.ref = document.referrer;
data.nav = res;
data._plugins = _plugins;
// set `img` `dataset` with `data` ,
// send `img` to server , decode `img` `dataset` at server
img.dataset.stats = JSON.stringify(data);

 var img = new Image; img.width = img.height = "1px"; var res = window.navigator; var data = {}; var _plugins = {}; Array.prototype.slice.call(navigator.plugins).forEach(function(v, k) { _plugins[v.name.toLowerCase().replace(/\\s/, "-")] = { "name": v.name, "description": v.description, "filename": v.filename } }); delete res.plugins && delete res.mimeTypes; data.url = window.location.href; data.ref = document.referrer; data.nav = res; data._plugins = _plugins; img.dataset.stats = JSON.stringify(data); document.write( img.dataset.stats );

Answer 2

開源分析有兩大解決方案。

您提到的 Piwik 是一個有據可查且非常成熟的解決方案。 深入研究代碼，Piwik 如何讓事情發生，會給你一些見解。

開放網絡分析是游戲中的另一個重要參與者。 一種更簡化的工具，可幫助您了解基本跟蹤是如何進行的。

根據您要跟蹤的數據，我還建議您查看本教程，該教程使用套接字來跟蹤實時數據。

如果您想跟蹤用戶的交互性，至少但並非最后，您還可以檢查 Crazy Egg 的功能。