理论结合实践：用Umami构建网站分析系统

个人博客地址（欢迎大家访问）：理论结合实践：用Umami构建网站分析系统

1. 引言

网站统计分析是一种通过收集、处理和分析网站数据来评估网站性能、用户行为和流量来源的综合方法。通过分析用户访问模式、页面浏览量、访问时长、用户地理位置、设备类型、访问来源等方面的数据，可以获得网站运营状况的整体视图。深入开展网站统计分析涉及多个学科领域，如数据科学、统计学、信息技术、SEO等，使之成为一门跨领域的复杂学问。

通常，进行网站统计分析的主要目的是提升用户体验、优化网站性能、增加转化率以及调整内容策略。而对于我个人而言，主要需求是查看网站流量数据，因此目标相对简单、明确。

2. 基础知识概览

2.1 关键术语

1. 会话（Session）：指用户在一段时间内与网站的连续交互。例如，小明打开淘宝，浏览了多个商品页面并购买了一件衣服，随后关闭浏览器。从打开到关闭浏览器的全过程构成了一次会话。

2. 页面浏览量（Pageview）：每当用户访问一个页面便计为一次页面浏览。假如小明在一次会话中浏览了10个商品页面，这次会话便记录了10次页面浏览量。

3. 用户（User）：代表网站的独立访客个体，通常通过Cookie或登录信息识别。例如小明和小红各自访问了淘宝，系统会识别为两个独立用户。

4. 跳出率（Bounce Rate）：指仅访问了一个页面就离开网站的用户比例。如果小明仅浏览了一个商品页面就关闭淘宝，跳出率则为100%。

5. 留存率（Retention Rate）：表示在一段时间内继续使用某产品或服务的用户比例。例如，某App在第一周有100名新用户，其中80名在第二周继续使用，则留存率为80%。

这些指标的意义：

• 会话：了解用户的访问时长和互动深度。
• 页面浏览量：评估网站内容的受欢迎程度。
• 用户：掌握网站用户的规模及增长情况。
• 跳出率：分析网站内容的吸引力及用户体验质量。
• 留存率：衡量用户对产品的忠诚度及粘性。

2.2 流量分析

流量分析是网站分析的基础环节，通过深入挖掘流量数据，帮助我们了解网站访问情况、评估营销效果，并为后续优化提供数据支持。

• 总流量、唯一用户数（UU）、平均会话时长、页面浏览量

  • 总流量：在特定时间段内，网站被访问的总次数，反映网站总体活跃度。
  • 唯一用户数（UU）：特定时间段内的独立访客数量，体现受众规模。
  • 平均会话时长：用户在网站上的平均停留时间，展示了内容对用户的吸引力。
  • 页面浏览量：反映用户浏览网站内容的深度。

• 流量来源

  • 自然搜索：源自搜索引擎的自然搜索结果，表明网站在搜索引擎中的表现。
  • 社交媒体：来自社交媒体平台的流量，衡量社交推广效果。
  • 直接访问：用户通过直接输入网址访问网站的流量，可能来自书签等。
  • 推荐流量：由其他网站链接或广告引导而来的流量，反映推广合作成效。

通过分析流量来源，可以理解各渠道的引流效果，从而优化营销策略，提升流量质量。

2.3 用户行为分析

用户行为分析有助于了解用户在网站上的行为模式，找出用户的需求和痛点，并优化用户体验。

• 跳出率与退出率

  • 跳出率：指用户仅浏览一个页面便离开的比例。
  • 退出率：指用户在特定页面上离开的比例。
  • 区别：跳出率衡量页面的整体吸引力，而退出率则反映某一页面的具体问题。
  • 影响因素：页面加载速度、内容质量及用户体验等均会影响跳出和退出率。

• 平均停留时间与访问深度

  • 平均停留时间：用户在每个页面上平均停留的时间。
  • 访问深度：用户在一次访问中浏览的页面数量。
  • 意义：这两个指标反映了用户对网站内容的兴趣及浏览习惯。

• 转化率与漏斗分析

  • 转化率：完成特定目标（如购买或注册）的访客比例。
  • 漏斗分析：将转化过程分解为多个步骤，分析每一步的转化情况，找出瓶颈所在。

2.4 设备和技术分析

设备和技术分析帮助我们了解不同设备和浏览器用户的行为，进而优化网站的适配性和兼容性。

• 设备类型、操作系统、浏览器

  • 分析：通过对不同设备和浏览器的用户数据分析，可以发现不同用户群体的特点和需求，从而有针对性地优化网站。

• 移动设备与桌面设备的用户行为差异

  • 差异：移动设备用户通常更关注页面加载速度和易用性，而桌面用户则更重视内容深度。
  • 分析：对比移动设备与桌面设备用户的数据，能够帮助我们识别行为差异，进一步优化设计和内容。

3. 常见的统计工具

3.1 常见的统计平台

1. CNZZ：国内成熟的网站统计工具，功能全面，适合中小型网站，支持基础的流量统计、访客来源及用户行为分析。

2. 51la：界面简洁，操作易用，适合个人博客及小型企业网站，提供基础的流量统计和用户行为分析。

3. 百度统计：百度推出，紧密结合搜索引擎，支持关键词分析及SEO建议，适合提升百度排名的网站。

4. 51yes：实时数据统计工具，适合电商及新闻网站等需要实时监控的站点。

5. SiteFlow：专注用户行为分析，提供用户路径可视化，帮助深入了解用户行为以优化用户体验。

6. Google Analytics：全球领先的网站分析工具，功能强大，适合中大型网站，可提供全面的数据报告及自定义分析。

3.2. 开源统计工具推荐

当然，搭建一个自主可控的工具才是本文的目标，所以主要还是来介绍一下这些个开源的工具；

这些工具并不是完全统计，可能有些理解会有些许个人意见，最好是大家自己去搭建体验一下；

点击卡片即可跳转至仓库；

3.2.1. Matomo

https://github.com/matomo-org/matomo

• 功能：Matomo是一个全面的开源分析平台，提供用户行为跟踪、实时报告、热图、表单分析、A/B测试等高级功能。它还支持电子商务分析、目标转化跟踪、事件跟踪等。

• 隐私：Matomo强调用户隐私保护，提供IP匿名化、不存储IP地址的选项，以及DoNotTrack支持，符合GDPR等隐私法规。

• 部署：Matomo支持自托管，可以在自己的服务器上安装和运行，确保数据控制和隐私。

• 社区支持：Matomo拥有活跃的社区论坛，提供多语言支持。

• 演示地址：https://demo.matomo.cloud/index.php

• demo截图：

  

3.2.2. Shynet

https://github.com/milesmcc/shynet

• 功能：Shynet是一个轻量级的网络分析工具，提供基本的网站访问统计和用户行为分析。

• 隐私：Shynet不使用Cookies跟踪用户，尊重用户隐私。

• 部署：Shynet支持Docker部署，易于安装和维护。

• 社区支持：Shynet的社区相对较小，但提供基本的支持和文档。

• 截图:

  

  

3.2.3. Fathom

https://github.com/usefathom/fathom

• 功能：Fathom提供了简洁的设计和用户体验，包括事件跟踪、自定义新闻通讯注册事件、按钮点击等。

• 隐私：Fathom不使用Cookies，符合GDPR等隐私法规。

• 部署：Fathom提供自托管选项，允许用户完全控制数据。

• 社区支持：Fathom的社区支持较为有限，但提供官方文档和教程。

• 付费情况：Fathom 提供了免费和付费版，也就是Fathom Lite 与 Fathom Analytics；与 Fathom Lite 相比，Fathom Analytics 更加详细、功能更加丰富，甚至更加注重隐私法合规性。免费版本会维护，但是也不会新增功能了，很多功能不能用，还是多少有点难受的。

• 截图：

  

3.2.4. Ackee

https://github.com/electerious/Ackee

• 功能：Ackee提供了必要的统计信息，事件跟踪功能，监控按钮点击、订阅等行为，包括一个完整的GraphQL API。

• 隐私：Ackee不需要cookies，不进行独特的用户追踪，因此无需弹出烦人的cookie提示，尊重并保护用户隐私。

• 部署：Ackee支持多种部署方式，包括Docker、Helm，甚至无需Docker，易于部署。

• 社区支持：Ackee的社区支持较为活跃，提供文档和论坛支持。

• 演示截图：https://demo.ackee.electerious.com/

• 截图：

  

3.2.5. Umami

https://github.com/umami-software/umami

• 功能：Umami是一个简单、易于使用、自托管的网络分析解决方案，提供更友好、注重隐私的Google Analytics替代方案。

• 隐私：Umami注重隐私，不依赖第三方服务，所有内容都放在一个页面上。

• 部署：Umami支持从源码安装、Docker Compose和Docker镜像等多种安装方式。

• 社区支持：Umami的社区支持较为活跃，提供文档和论坛支持。

• 截图：

  

3.2.6. GoatCounter

https://github.com/arp242/goatcounter

• 功能：GoatCounter提供了基本的网站统计功能，包括页面访问量和用户行为分析。

• 隐私：GoatCounter注重隐私，不使用Cookies跟踪用户。

• 部署：GoatCounter提供简单的部署方案，包括单二进制文件和SQLite数据库单文件架构，易于部署。

• 社区支持：GoatCounter的社区支持较为有限，但提供官方文档和教程。

• 演示地址：https://stats.arp242.net/

• 截图：

  

3.2.7. Plausible

https://github.com/plausible/analytics

• 功能：Plausible提供了轻量级的网站分析，包括独立访客数量、页面浏览量、跳出率和访问时间。它还支持实时仪表盘、UTM参数跟踪转换目标、收入和营销活动的效果，以及自定义事件和维度。

• 隐私：Plausible不存储个人数据或IP地址，不使用cookies，确保用户隐私安全。

• 部署：Plausible支持自托管Community Edition或由Plausible团队管理的云端服务。

• 社区支持：Plausible CE是社区支持的项目，不保证从Plausible创建者那里获得支持来解决自托管问题。有一个社区支持论坛，可以在那里寻求帮助。

• 演示地址：https://plausible.io/plausible.io

• 截图：

  

3.2.8. *GoAccess

https://github.com/allinurl/goaccess

• 功能：GoAccess专注于日志文件分析，提供实时解析和过滤功能。

• 隐私：GoAccess不涉及用户个人信息的收集。

• 部署：作为一个命令行工具，GoAccess可以在多种环境下运行，包括实时日志监控。

• 社区支持：GoAccess拥有活跃的社区和文档支持。

• 演示地址：https://rt.goaccess.io/?20240910143653

• 截图：

  

3.2.9. *PostHog

https://github.com/PostHog/posthog

• 功能：PostHog是一个全合一的开源平台，用于构建更好的产品，提供事件手动指定或自动捕获、数据分析、会话回放、热图、特征标志、A/B测试等功能。

• 隐私：PostHog允许用户在不失去数据控制的情况下理解用户行为，不将用户数据发送给第三方。

• 部署：PostHog可以自托管，并且提供了开源部署的指导和限制（建议 4GB 内存）。

• 社区支持：PostHog的社区支持较为活跃，提供文档和论坛支持。

• 截图：

  

3.2.10. 不同场景和需求怎么选

• 简单总结一下

  这些开源的工具都有不同的特点，上面推荐的工具，GoAccess 和 PostHog 要单独拿出来说，因为他俩和其他的网站统计分析工具有区别，下面会详细说一下；其他的基本上就是比较火的一些工具了；

• GoAccess和PostHog

  你会发现上面这俩标星的工具，这俩工具和其他的网站统计分析工具是不一样的；因为它俩本质上不算是一个常规的网站访客统计分析或者流量分析的工具；下面是一些介绍：

  原理上的差异

  • GoAccess:GoAcess是一款基于Web服务器日志的分析工具，通过直接解析Nginx、Apache等服务器生成的日志文件来获取访问数据，不需要在客户端嵌入代码。因其分析的是服务器端日志文件，不依赖客户端跟踪，适合注重隐私的数据统计需求。GoAccess支持实时终端呈现和HTML报告导出。GoAccess聚焦基础访问数据分析，如IP地址、访问量、页面浏览量、访问来源等，适合快速的流量监控和性能评估。

  • PostHog:PostHog是一款产品分析平台，主要通过在前端和后端埋点收集用户行为数据，支持嵌入JavaScript或SDK以追踪用户操作。PostHog可以实时追踪用户行为并支持A/B测试、漏斗分析、用户画像等深入分析功能。PostHog支持深度的用户行为分析，包括会话重放、事件追踪等，且支持自定义事件及API扩展，适合产品团队优化用户体验。其自托管选项帮助企业控制数据隐私。

  • 普通网站统计工具:通常通过在网站上嵌入JavaScript代码收集用户数据，适合快速集成。主要提供丰富的统计功能，如用户行为路径、转化追踪、受众特征分析、社交媒体分析等，但因依赖第三方服务器存储数据，可能存在隐私风险。

  主要功能的差异

  • GoAccess:
    • 提供基础的访问日志分析，包括IP地址、HTTP状态码、访问页面、来源等。
    • 支持虚拟主机流量统计、页面访问分析和来源分析，生成实时数据报告，适合终端输出和静态报告需求。
    • 主要分析网站流量和服务器性能：
      • 页面访问量：包括每个URL的访问次数、独立访客数等。
      • 流量来源：显示访客的来源，如直接访问、搜索引擎等。
      • 响应状态：记录HTTP状态码，如200（成功）、404（未找到）、500（服务器错误）等，用于监控服务器状态。
      • 用户代理：包括访客使用的浏览器、操作系统、设备类型等信息。
      • 带宽使用情况：帮助监测各资源的带宽占用，适合优化服务器资源配置。
  • PostHog:
    • 提供定制化事件追踪、漏斗分析、用户留存分析和A/B测试等功能。
    • 支持路径分析、用户画像分组、会话重放等多维度用户行为分析，帮助深入理解用户行为，优化产品体验。
    • 主要分析用户行为和产品使用数据：
      • 事件追踪：分析用户的特定行为（如点击、滑动、播放视频等），这些事件可以自定义，满足产品的具体需求。
      • 漏斗分析：用来追踪用户在关键步骤上的转化情况，识别流失节点，特别适合注册流程、电商下单等多步操作的场景。
      • 路径分析：展示用户访问路径，帮助理解用户在网站或应用中的导航习惯。
      • 用户细分与分组：根据行为特征、设备、地域等将用户分组，有助于更精准的用户画像分析。
      • 会话重放：可以回放用户在页面上的交互，帮助产品团队优化用户体验。
  • 普通网站统计工具:
    • 提供PV、UV、跳出率、平均停留时间等基础流量统计，支持电子商务分析、目标追踪等功能。
    • 集成第三方数据分析平台（如Google Ads、Facebook Ads）以支持营销效果评估，适合营销导向的网站。
    • 主要分析网站流量、用户特征和转化情况：
      • 流量统计：包括页面浏览量（PV）、独立访客数（UV）、会话数、跳出率等，用于评估网站受欢迎程度。
      • 流量来源：分析访客的来源渠道（搜索引擎、直接流量、社交媒体、推荐网站等），帮助调整推广策略。
      • 受众特征：包含用户的地域分布、语言、设备、操作系统、浏览器等，有助于了解访客属性。
      • 转化追踪：追踪用户完成特定目标的路径，例如购买、表单提交、注册等，通过设定目标转化路径来评估营销效果。
      • 用户行为：分析访问页面的路径、页面停留时间、退出率等用户在网站上的基本行为，便于优化内容和结构。

  适用场景的差异

  • GoAccess:

    • 适合中小型网站、博客、内容型网站，帮助快速了解底层访问情况，优化性能。
    • 适用于希望轻量级日志分析和简单流量监控，但对用户行为分析和转化数据需求不高的网站。
    • 注重隐私保护的应用场景也适用，不依赖客户端数据跟踪。

  • PostHog:

    • 适合产品团队用作用户行为分析、产品优化的数据工具，适用于交互复杂的SaaS应用和B2B平台。
    • 对企业隐私要求高的场景，如金融、医疗行业尤为适合，提供数据严格控制的自托管方案。
    • 适合需要深度用户行为分析、用户留存及用户路径跟踪的应用场景。

  • 普通网站统计工具:

    • 适合大多数网站，特别是需要基础流量分析、受众群体分析和广告效果评估的场景。
    • 适合内容导向或电商平台，通过数据分析调整市场策略。
    • 对深入用户行为数据要求不高但需常规统计的团队可选用。

  所以，如果你要只做一些网站访客分析的话，肯定不会选择 GoAccess 和 PostAccess,但是你应该也明白了我为什么要提这两个工具；

• 怎么选？

  我只说我的看法，如果说小型网站或者个人博客的话，Umami、GoatCounter或Plausible，这些工具易于部署，界面友好。这里面我推荐 Umami ,不说别的，看 GitHub 上的星星数就能看出来更多人的选择；我选择它的其他理由下个章节细说；

  如果你的需求比较复杂，对隐私保护的要求高，需要应用到复杂分析和高度定制的场景，Matomo 、 Fathom都是比较好的选择，这里面我推荐 Matomo，全面的数据分析功能、高度的定制性、强大的数据隐私保护都是优势；

4. Umami 安装配置

先说一句就是这个工具已经可以在 Vercel 上部署了，我这里主要记录的是在自己服务器上部署；

4.1. 为什么选 Umami

我主要图它特别轻量，基本不会对页面加载速度产生负面影响；界面设计的很优美、简洁；隐私方面支持无Cookie跟踪，不会收集用户的个人数据；Umami 的部署过程相对简单，不管是有没有技术经验，支持使用Docker一键部署就，非常适合自托管的需求。另外，虽然 Umami 提供的功能相对简化，但对于小型网站和个人博客来说，它提供的基本流量统计、页面浏览、来源分析、以及事件跟踪功能已经足够满足需求。

4.2. 安装 Umami

4.2.1. 1Panel 一键部署

这个就不多说了，很简单；

4.2.2. 使用预构建的镜像

这个方式并不推荐啊，比较麻烦；

umami 提供了两个镜像，分别是 PostgreSQL 和 MySQL:

支持 PostgreSQL 的镜像：

docker pull docker.umami.is/umami-software/umami:postgresql-latest

或者支持 MySQL 的镜像：

docker pull docker.umami.is/umami-software/umami:mysql-latest

安装命令如下，然后你还要修改对应的数据库配置，保证连接数据库，上面说了，这里支持的是 PostgreSQL 和 MySQL：

docker run -d \
  --name umami \
  -p 3000:3000 \
  --env DATABASE_URL="db_type://db_user:db_password@db_host:db_port/db_name" \
  --env DATABASE_TYPE=db_type \
  --env APP_SECRET=replace-me-with-a-random-string \
  --restart always \
  ghcr.io/umami-software/umami:postgresql-latest

4.2.3. 使用docker compose安装

如果你不想用运维管理面板，这个就是推荐做法；

如果你需要部署两个服务，也就是 Umami 和数据库编排管理，就可以用下面这个方案；

官方提供的docker-compose.yml

version: '3'
services:
  umami:
    image: ghcr.io/umami-software/umami:postgresql-latest
    ports:
      - "3000:3000"
    environment:
      DATABASE_URL: postgresql://umami:umami@db:5432/umami
      DATABASE_TYPE: postgresql
      APP_SECRET: replace-me-with-a-random-string
    depends_on:
      db:
        condition: service_healthy
    restart: always
    healthcheck:
      test: ["CMD-SHELL", "curl http://localhost:3000/api/heartbeat"]
      interval: 5s
      timeout: 5s
      retries: 5
  db:
    image: postgres:15-alpine
    environment:
      POSTGRES_DB: umami
      POSTGRES_USER: umami
      POSTGRES_PASSWORD: umami
    volumes:
      - umami-db-data:/var/lib/postgresql/data
    restart: always
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U $${POSTGRES_USER} -d $${POSTGRES_DB}"]
      interval: 5s
      timeout: 5s
      retries: 5
volumes:
  umami-db-data:

参数说明：

version: 指定 Docker Compose 的配置文件版本，这里是版本 3。

services: 定义要部署的服务，这里包含两个服务：

• umami: 使用 ghcr.io/umami-software/umami:postgresql-latest 镜像运行 Umami 服务。
  • ports: 将容器的 3000 端口映射到主机的 3000 端口，这样就可以通过主机端口访问 Umami 服务。
  • environment:设置 Umami 服务的环境变量：
    • DATABASE_URL: 指定连接 PostgreSQL 数据库的 URL 信息。
    • DATABASE_TYPE: 指定数据库类型为 PostgreSQL。
    • APP_SECRET: 用于加密数据，需要替换为一个随机字符串。
  • depends_on: 指定 Umami 服务依赖于 db 服务，确保数据库启动后再启动 Umami 服务。
  • restart: 设置容器异常退出后自动重启。
  • healthcheck: 配置容器的健康检查
    • test: 指定了健康检查的命令。这里使用 curl 命令发送一个 HTTP GET 请求到容器内部的 http://localhost:3000/api/heartbeat 端口，以检查服务是否正常运行。
    • interval: 设置健康检查的间隔时间，这里是 5 秒。
    • timeout: 设置健康检查的超时时间，这里是 5 秒。
    • retries: 设置健康检查的重试次数，这里是 5 次。
• db: 使用 postgres:15-alpine 镜像运行 PostgreSQL 数据库。
  • environment: 设置数据库的环境变量：
    • POSTGRES_DB: 指定数据库名称为 umami。
    • POSTGRES_USER: 指定数据库用户名为 umami。
    • POSTGRES_PASSWORD: 指定数据库密码为 umami。
  • volumes: 定义持久化存储卷：
    • umami-db-data: 将容器的 /var/lib/postgresql/data 目录映射到主机的 umami-db-data 卷，用于存储数据库数据，即使容器重启，数据也不会丢失。
  • restart: 设置容器异常退出后自动重启。
  • healthcheck: 配置容器的健康检查，同上，该检查使用 pg_isready 命令检查数据库是否已启动并可用。检查间隔为 5 秒，超时时间为 5 秒，重试 5 次。

volumes: 定义持久化存储卷：

• umami-db-data: 上面已经提到，用于存储数据库数据。

然后 docker compose up -d 即可；

但是，如果你不想再起一个数据库服务占硬件资源，你就修改一下 docker-compose.yml 即可：

version: '3'
services:
  umami:
    image: ghcr.io/umami-software/umami:postgresql-latest
    ports:
      - "3000:3000"
    environment:
      DATABASE_URL: postgresql://external_user:external_password@external_db_host:external_db_port/external_db_name
      DATABASE_TYPE: postgresql
      APP_SECRET: replace-me-with-a-random-string
    restart: always
    healthcheck:
      test: ["CMD-SHELL", "curl http://localhost:3000/api/heartbeat"]
      interval: 5s
      timeout: 5s
      retries: 5

如果你想连接自己的 MySQL 服务，你就修改下面对应参数就行：

DATABASE_URL: mysql://external_user:external_password@external_db_host:external_db_port/external_db_name
      DATABASE_TYPE: mysql

4.2.4. 源代码安装

这个我没有实践，就是记录一下，所有内容来源于：https://github.com/umami-software/umami/blob/master/README.md

• 服务器，需要安装 Node.js 16.13 或更高版本

• 数据库。Umami 支持 MariaDB (最低版本 v10.5)、MySQL (最低版本 v8.0) 和 PostgreSQL (最低版本 v12.14) 数据库。

• 安装 Yarn

npm install -g yarn

• 获取源代码并安装依赖包

git clone https://github.com/umami-software/umami.git  
cd umami
yarn install

• 配置 Umami

创建一个名为 .env 的文件，并添加以下内容：

DATABASE_URL=连接字符串

连接字符串格式：

postgresql://用户名:密码@主机地址:端口/数据库名
mysql://用户名:密码@主机地址:端口/数据库名

• 构建应用程序

yarn build

• 首次安装时，构建步骤会在您的数据库中创建表。它还将创建一个登录用户，用户名为 admin，密码为 umami。

• 启动应用程序

yarn start

默认情况下，这将在 http://localhost:3000 上启动应用程序。您需要将请求从您的 Web 服务器 代理 过来，或者更改 端口 以直接提供应用程序服务。

4.3. 配置反向代理

要给 Umami 配置一个方向代理，套上https，不然会有一些奇奇怪怪的问题；

首先要去你的域名解析服务上加条记录：

配置反向代理我这里就是用 1Panel 直接搞的，很方便；其实直接配置 Nginx 或者用宝塔都很简单；

我这里就放了个图，如果你熟悉的话不用看，如果你不熟悉的话，建议结合 1panel 的文档操作；

4.4. 配置 Umami

这个除了官网，可以参考一下这个中文文档：简中文档

详细的步骤我就不说了，主要记录一些关键点；

• 登录

输入你的地址，进去之后登录，默认用户名 admin 密码 umami；

进去之后要修改密码；

• 设置中文

• 添加网站

• 安装脚本到网站

点击新建网站的编辑；

选择跟踪代码，然后复制；

如果是halo，直接全局注入：

• 测试一下

回到你自己的网站，刷新几下，然后回到Umami看一眼，如下，大功告成

• 如何排除我的访问

您想访问自己的网站，但不希望您的访问出现在统计数据中。为此，您需要在浏览器中添加一个设置。
打开浏览器中的开发者控制台：设置 -> 更多工具 -> 开发者工具
在控制台中，输入以下代码并按 Enter：

localStorage.setItem('umami.disabled', 1);

直接 F12 打开，粘贴即可：

可以查看一下是否安装成功，在开发者工具的 Application 或者 应用里面查看：

此设置适用于 每个网站，因此您需要为每个希望排除的网站执行此操作。
要移除该设置，请输入以下代码并按 Enter：

localStorage.removeItem('umami.disabled');

5. 总结

本文其实主要的目的不是玩 Umami,本文主要还是分享网站分析知识和工具，希望大家看完这篇博客，对相关内容有一个大范围的了解，进一步能有一些自己的选择或者说判断。最后搭建了 Umami 主要也是实践一下，把路给走通。希望你能有所收获；

Umami 能玩的东西还有很多，要折腾的东西也很多；后面有机会再继续捣腾吧，先让它帮我分析着；再就是 Umami 的 UI 真的设计的很不错，用起来很丝滑；

如果你对我的内容有不同的看法，或者好的建议，欢迎在评论区留言，非常期待与大家进行交流。