Verwendung von Umami für lokale Analysen (Deutsch (German))

Einleitung

Eines der Dinge, die mich über mein aktuelles Setup verärgerte war, Google Analytics verwenden zu müssen, um Besucherdaten zu erhalten, was wenig es davon gibt.??).. Also wollte ich etwas finden, das ich selbst finden konnte.-.host, das Daten an Google oder andere Dritte weitergegeben hat. Umami das ist eine einfache self-- hosted web analytics Lösung , die ,. , es ist eine große Alternative zu Google Analytics und ist , ( ,relativ , ) , einfach einzurichten

Installation

Installation ist PRETTY einfach, aber nahm ein faires Stück von Fiddling, um wirklich los zu bekommen

Docker-Komposition

Da ich Umami zu meinem aktuellen Docker hinzufügen wollte, musste ich einen neuen Service zu meinem docker-compose.yml Ich habe das Folgende zum unteren Teil der Datei hinzugefügt.

  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

Diese Docker-Datei enthält die folgende Setup-Datei:

Ein neuer Dienst namens umami die die ghcr.io/umami-software/umami:postgresql-latest picture-Service Dieser Dienst wird verwendet, um den Umami Analytics Service zu betreiben.
Ein neuer Dienst namens db die die postgres:16-alpine image-.. Dieser Dienst wird verwendet, um die Postgres Datenbank auszuführen, mit der Umami seine Daten speichert... Hinweis für diesen Dienst I'-m hat ihn in ein Verzeichnis auf meinem Server gemappt, so dass die Daten zwischen den Neustarts bestehen bleiben.

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

Sie brauchen diesen Direktor zu existieren und durch den Docker Benutzer auf Ihrem Server beschreibbar sein....mehr als ein Linux-Experte, also ist 777... wahrscheinlich hier Overkill

chmod 777 /mnt/umami/postgres

Ein neuer Dienst namens cloudflaredumami die die cloudflare/cloudflared:latest Bild: . Dieser Dienst wird verwendet, um den Umami-Dienst durch Cloudflare zu tunneln, damit er aus dem Internet abgerufen werden kann.

Env-Datei

Um dies zu unterstützen, habe ich auch meine .env Datei zum Einschließen der folgenden:

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}

Dadurch wird die Konfiguration für den Docker erstellt. <> elemets müssen offensichtlich durch Ihre eigenen Werte ersetzt werden cloudflaredumami Service wird verwendet, um den Umami-Dienst durch Cloudflare zu tunneln, damit er vom Internet aus zugänglich gemacht werden kann... It...'.s POSSIBLE zur Verwendung eines BASIS-_.PATHs, aber für Umami braucht es lästigerweise einen Wiederaufbau, um die Basispfade zu ändern, so dass IM'.ve ihn als Root-Pfad für jetzt verlassen hat.

Cloudflare Tunnel

Um den Cloudflare-Tunnel für diese Einstellung einzurichten, die als Pfad für die js-Datei dient, die für Analysen verwendet wird.

Cloudflare Tunnel

Dies stellt den Tunnel zum Umami-Service auf und erlaubt es, aus dem Internet zuzugreifen. umami Service in der Docker-- compose Datei, wie es ' auf dem gleichen Netzwerk wie die cloudflared Tunnel it' ist ein gültiger Name

Umami Setup auf der Seite

Um den Pfad für das Skript zu aktivieren getinfo in meinem Setup oben.). IM.SK1.ve hat einen Config-Eintrag zu meinen Appsettings hinzugefügt.

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

Sie können diese auch zu Ihrer Datei hinzufügen und sie als Umgebungsvariablen an die Docker-Datei übergeben.

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

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

Sie richten die WebsiteId im Dashboard von Umami ein, wenn Sie die Site einrichten..Beachten Sie den Standardnamen und das Passwort für den Umami-Dienst ist admin und umamiSie müssen diese nach dem Setup ändern. Umami Dashboard

Mit den zugehörigen Einstellungen cs-Datei

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

Auch dies verwendet meine POCO-Konfig-SacheHierherUm die Einstellungen einzurichten, müssen Sie die Einstellungen einstellen. Stellen Sie es in meinem Programm ein

builder.Configure<AnalyticsSettings>();

Und schließlich in meinem BaseController.cs OnGet Methode I'®ve hinzugefügt, um den Pfad für das Analyse-Skript zu setzen

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

Dies setzt den Pfad für das Analyse-Skript, das in der Layoutdatei verwendet werden soll.

Layout-Datei

Schließlich wurde meiner Layout-Datei das folgende hinzugefügt, um das Analyse-Skript einzufügen.

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

Dies schließt das Skript in der Seite ein und setzt die Website-ID für den Analysedienst.

Sich von der Analytik ausschließen

Um Ihre eigenen Besuche von den Analysedaten auszuschließen, können Sie die folgende lokale Speicherung in Ihrem Browser hinzufügen.

In Chrome-dev-Tools (.Ctrl.+.Shift.+.I auf Windows-) können Sie die folgenden hinzufügen, um die Konsole

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

Schlußfolgerung

Dies war ein bisschen von einem faff, um einzurichten, aber I'-m glücklich mit dem Ergebnis - .- Ich habe jetzt einen self---hosted Analytics-Dienst, der nicht übergibt Daten an Google oder eine andere dritte Partei -.- es ist ein wenig von einem Schmerz zu richten, aber sobald es getan hat '-s ziemlich einfach zu bedienen .-I'-m zufrieden mit dem Resultat und würde es jedem empfehlen, für eine selbst suchen --hostete Analyse-Lösung -.-