# 使用 Umami 进行局部分析

<!--category-- ASP.NET, Umami -->
<datetime class="hidden">2024-08-08T15:53</datetime>

## 一. 导言导言 导言 导言 导言

其中一件让我对目前设置感到不快的事情是, 不得不使用谷歌分析工具来获取访问者数据@( @有什么微小的吗? @??).}所以我想找到一些我能自我发现的东西。 [木美](https://umami.is/) 它是一个简单的“,” 自我“MS K1” 托管的网络分析解决方案 “.” It'}是谷歌分析工具的一个绝佳替代方案,并且是“(” 相对地“MSSK5” 很容易设置“MSC6” 。

[TOC]

## 安装装置

安装很简单,但花了相当的一小段时间才真正开始运行。

### docker 合成器

我想把乌玛美加进我现在的Docker -组合中 我需要为我的事业增加一个新的服务 `docker-compose.yml` {.}我添加了以下内容到文件底部\:}

```yaml
  umami:
    image: ghcr.io/umami-software/umami:postgresql-latest
    env_file: .env
    environment:
      DATABASE_URL: ${DATABASE_URL}
      DATABASE_TYPE: ${DATABASE_TYPE}
      HASH_SALT: ${HASH_SALT}
      APP_SECRET: ${APP_SECRET}
      TRACKER_SCRIPT_NAME: getinfo
      API_COLLECT_ENDPOINT: all
    ports:
      - "3000:3000"
    depends_on:
      - db
    networks:
      - app_network
    restart: always
  db:
    image: postgres:16-alpine
    env_file:
      - .env
    networks:
      - app_network
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U ${POSTGRES_USER}"]
      interval: 5s
      timeout: 5s
      retries: 5
    volumes:
      - /mnt/umami/postgres:/var/lib/postgresql/data
    restart: always
  cloudflaredumami:
    image: cloudflare/cloudflared:latest
    command: tunnel --no-autoupdate run --token ${CLOUDFLARED_UMAMI_TOKEN}
    env_file:
      - .env
    restart: always
    networks:
      - app_network


```

此 docker-composeMS K1yml 文件包含以下设置@ :

1. 名为新服务 `umami` 使用 `ghcr.io/umami-software/umami:postgresql-latest` 此服务用于运行 Umami 分析服务@. @%
2. 名为新服务 `db` 使用 `postgres:16-alpine` 此服务用于运行Umami用来存储其数据的 Postgres 数据库@.}
   此服务的注释 I'm 将它映射到我服务器上的目录上, 这样数据会在重新启动@ . {之间持续保存

```yaml
    volumes:
      - /mnt/umami/postgres:/var/lib/postgresql/data
```

您需要这名导演才能存在 并且可以被您的服务器“ @ (” 上的 docker 用户写入。 “% 1 ” 不是 Linux 专家, 所以“ MS K2 ” 可能在这里超杀@ !). {

```shell
chmod 777 /mnt/umami/postgres
```

3. 名为新服务 `cloudflaredumami` 使用 `cloudflare/cloudflared:latest` @._% 此服务用于透过云雾, 通过互联网访问Umami服务@.}

### 信封文件

为支持这一支持,我还更新了 `.env` 要包含以下文件@ : @%

```shell
CLOUDFLARED_UMAMI_TOKEN=<cloudflaretoken>
DATABASE_TYPE=postgresql
HASH_SALT=<salt>

POSTGRES_DB=postgres
POSTGRES_USER=<postgresuser>
POSTGRES_PASSWORD=<postgrespassword>
UMAMI_SECRET=<umamisecret>

APP_SECRET=${UMAMI_SECRET}
UMAMI_USER=${POSTGRES_USER}
UMAMI_PASS=${POSTGRES_PASSWORD}
DATABASE_URL=postgresql://${UMAMI_USER}:${UMAMI_PASS}@db:5432/${POSTGRES_DB}
```

这将设置 docker 曲组的配置@ ( @ the `<>` 明显需要用您自己的值来替换 Elemetes @ ). @ `cloudflaredumami` 服务用于通过云雾隧道连接 Umami 服务, 使得它能够从 Internet@. @ It'_%s POSIBLE使用 BASE}_PATH, 但对于Umami来说, 它讨厌地需要重建来改变基础路径, 所以 I've 将之留作现在的根路 @.}

### 云花隧道

设置用于此“ (” 的云层隧道。 该通道是 Js 文件路径, 可用于分析@ MS K1 @ getinfo.js)}我使用网站<:> 。

![云花隧道](umamisetup.png)

设置通向 Umami 服务的隧道, 并允许从 Internet 上访问@. @ notte @,_I 指出这一点 `umami` 在 docker\ -\ composting file 文件 *\ MPK1 as it'\ {在与云点隧道相同的网络上 <\ MASK3}\ 有效名称@).}

### Umami 页面中设置

要启用脚本的路径@ (_ 被调用 `getinfo` @ ) @ I'# 已添加一个配置条目到应用程序中

```json
 "Analytics":{
   "UmamiPath" : "https://umamilocal.mostlylucid.net/getinfo",
   "WebsiteId" : "32c2aa31-b1ac-44c0-b8f3-ff1f50403bee"
 },
```

您也可以将这些添加到您的“ . @ env” 文件, 并将其作为环境变量传递给 docker@ MS K1} compost file @ .}

```shell
ANALYTICS__UMAMIPATH="https://umamilocal.mostlylucid.net/getinfo"
ANALYTICS_WEBSITEID="32c2aa31-b1ac-44c0-b8f3-ff1f50403bee"
```

```yaml
  mostlylucid:
    image: scottgal/mostlylucid:latest
    ports:
      - 8080:8080
    restart: always
    environment:
    ...
      - Analytics__UmamiPath=${ANALYTICS_UMAMIPATH}
      - Analytics__WebsiteId=${ANALYTICS_WEBSITEID}
```

当您在 Umami 仪表板上设置网站时, 您设置了网站 Id 。 @ . @ {% MS K1} 注意 Umami 服务的默认用户名和密码是 `admin` 和 `umami`“,”您需要修改这些设置后@). @%
![Umami 仪表板](umamiaddwebsite.png)

相关设置 cs 文件 :\ {

```csharp
public class AnalyticsSettings : IConfigSection
{
    public static string Section => "Analytics";
    public string? UmamiPath { get; set; }
}
```

这里再次使用我的 POCO 配置工具@ ( @[在这里](/blog/addingidentityfreegoogleauth#configuring-google-auth-with-poco)@) 设置设置@.
把它设置在我的程序\".}{cs}♪:}

```csharp
builder.Configure<AnalyticsSettings>();
```

终于在我的 `BaseController.cs` `OnGet` 方法 I' @ ve 添加了以下内容来设置分析脚本的路径@ :\ {

```csharp
   public override void OnActionExecuting(ActionExecutingContext filterContext)
    {
        if (!Request.IsHtmx())
        {
            ViewBag.UmamiPath = _analyticsSettings.UmamiPath;
            ViewBag.UmamiWebsiteId = _analyticsSettings.WebsiteId;
        }
        base.OnActionExecuting(filterContext);
    }
    
```

这将设置布局文件中使用的分析脚本的路径@ .

### 布局文件

最后 , I'@ve 在布局文件中添加了以下内容, 以包含分析脚本@ MS K2

```html
<script defer src="@ViewBag.UmamiPath" data-website-id="@ViewBag.UmamiWebsiteId"></script>
```

这包括页面中的脚本, 并为分析服务设置网站 ID@. @%

## 将自己排除在分析之外

为了将您自己的访问从分析数据中排除, 您可以在浏览器中添加以下本地存储@ :

在 Chrome dev 工具中, @(Ctrl+}ShiftMS K2I 在窗口@)}您可以在控制台\ :}添加以下内容

```javascript
localStorage.setItem("umami.disabled", 1)
```

## 结论结论

这有点难以建立,但是I' 很高兴看到这个结果: “.”我现在拥有一个自我的“-”托管分析服务,它能将数据传递给Google或其他任何第三方 ”." It'}这有点令人费解,但一旦它完成后 “MS K6” “'”就很容易使用“MS K8” IMS K9'm 乐于此结果,并且会推荐给任何人来寻找“自--”托管的分析解决方案 ‘.’