輕量級谷歌分析開源替代品 - Umami
Umami 是一個簡單、易於使用、自我託管的網絡分析解決方案，目標是爲您提供一個更友好的、注重隱私的谷歌分析的替代品，以及一個免費的、開源的付費解決方案的替代品。Umami 只收集你關心的指標，所有東西都放在一個頁面上。
特性
簡單分析 Umami 只測量你關心的重要指標：網頁瀏覽量、使用的設備以及訪問者的來源。這些數據都在一個易於瀏覽的頁面上展示。
不限網站數量 Umami 通過一次安裝就可以跟蹤無限數量的網站，甚至還可以跟蹤子域名和單個的 URL。
繞過廣告攔截器 Umami 由你在自己進行託管部署，所以你可以有效地避免 Google Analytics 不同的廣告攔截器。
輕量級 追蹤腳本很小（只有 2KB），而且支持 IE 等舊版瀏覽器。
多賬戶 Umami 可用於爲朋友或客戶託管數據，只需創建一個單獨的賬號，他們就可以開始在自己的儀表板上跟蹤自己的網站。
共享數據 如果你想公開分享你的統計數據，那麼你可以使用一個唯一生成的 URL 進行共享。
移動端友好 Umami 界面已針對移動設備進行了優化，因此你可以從任何地方查看你的統計數據。
數據所有權 由於 Umami 是自託管的，因此你擁有所有數據。無需將你的數據交給第三方進行利用。
注重隱私 Umami 不收集任何個人身份信息，並對收集的所有數據進行匿名處理。
開源 Umami 是開源的，並採用 MIT 的開源協議。
安裝
從源碼構建
如果你想要從源碼進行構建安裝，需要滿足以下條件：
-
Node.js 版本在 12 及以上
-
一個 MySQL 或 Postgresql 數據庫
然後直接獲取源碼安裝依賴包：
git clone https://github.com/mikecao/umami.git
cd umami
npm install接下來創建數據庫表結構。Umami 支持 MySQL 和 Postgresql，首先需要爲你的 Umami 安裝創建一個數據庫，並使用包含的腳本安裝表。
對 MySQL：
mysql -u username -p databasename < sql/schema.mysql.sql對 Postgresql:
psql -h hostname -U username -d databasename -f sql/schema.postgresql.sql這也將創建一個用戶名爲 admin、密碼爲 umami 的登錄賬戶。
接着使用以下內容創建一個 .env 文件：
DATABASE_URL=連接地址
HASH_SALT=任意隨機字符串連接 url 格式如下：
postgresql://username:mypassword@localhost:5432/mydb
mysql://username:mypassword@localhost:3306/mydb其中 HASH_SALT 用於爲你的安裝生成一個唯一值。
配置完成後使用下面命令構建應用：
npm run build構建完成後就可以啓動應用程序了：
npm start默認情況下，這將在 http://localhost:3000 上啓動應用程序。
使用 Docker
更簡單的方式是使用 Docker 一鍵啓動，在源碼根目錄下面有 docker-compose 的配置，要構建 umami 容器並啓動 Postgres 數據庫，直接在項目根目錄下面執行如下命令即可：
docker-compose up或者，只獲取支持 PostgreSQL 的 Umami Docker 鏡像：
docker pull ghcr.io/mikecao/umami:postgresql-latest或者使用 MySQL 支持：
docker pull ghcr.io/mikecao/umami:mysql-latest使用
安裝完成後，Umami 將使用用戶名 admin 和密碼 umami 創建一個默認管理員賬戶。
登錄 Umami 後，單擊頂部的 Settings 導航到 Websites，點擊右側的 + Add website 按鈕就可以開始創建網站分析了。
填寫表單詳細信息，然後單擊 “Save” 按鈕保存即可。
其中 Name 字段可以是任何內容，通常它與域名相同。Domain 字段是你網站的實際域名。Enable share URL 表示你希望通過唯一 URL 共享你的網站統計信息。
添加網站後。單擊 Get tracking code 按鈕可以獲取跟蹤代碼。
從彈出的表單中，複製代碼並將其插入到你網站的 <head> 部分即可。
然後訪問你的網站後，數據正常就會在你的 Umami 儀表板中出現了。
除了網站瀏覽相關數據之外，Umami 還能夠跟蹤你網站上發生的事件，在 Umami 中記錄事件有兩種方法，使用 CSS classes 或使用 Javascript。
使用 CSS 類
要啓用事件跟蹤，只需向要跟蹤的元素添加一個特殊的 CSS 類即可。例如，你可能有一個帶有以下代碼的按鈕：
<button id="signup-button" class="button">Sign up</button>然後使用下面的格式添加一個 class 類：
umami--<event>--<event-name>你的這個按鈕元素代碼可能看起來是這樣的：
<button id="signup-button" class="button umami--click--signup-button">Sign up</button>當用戶點擊該按鈕時，Umami 會記錄一個名爲 signup-button 的事件，事件類型爲 click。該事件可以是任何可應用於元素的 Javascript 事件。
注意：不要附加到任何連續觸發的事件上去，如
scroll和drag。
使用 Javascript
我們還可以使用 window.umami 對象手動記錄事件，要完成與上述 CSS 方法相同的事情，可以執行以下操作：
const button = document.getElementById('signup-button');
button.onclick = () => umami('Signup button click');在這種情況下，Umami 將記錄一個名爲 Signup button click 的事件，事件類型爲 custom。
查看事件
記錄事件後，它們將在你的網站詳細信息頁面上看到。
此外 Umami 還有很多高級功能，比如跟蹤配置、跟蹤函數、環境變量、API 等等，更多高級用法可以參考官方文檔 https://umami.is/docs 以瞭解更多信息。
最後我們來看一張使用 Umami 的 Dashboard 示例圖：
Git 倉庫：https://github.com/mikecao/umami
Github 愛好者 我們是一羣 Github 愛好者，專注分享有價值、有趣的開源項目和學習資料，包括 Python、Golang、Java、Rust、AI、前端、運維、數據分析、大數據、雲計算、Kubernetes、Service Mesh 等領域資源。
本文由 Readfog 進行 AMP 轉碼，版權歸原作者所有。
來源：https://mp.weixin.qq.com/s/92lryAWSg28EXMGHKYxomw