分析是收集和分析有關訪客如何與您的網站互動的資料的過程。這些資訊至關重要，因為它可以讓您做出明智的決定來改進您的網站。
Google Analytics 是一個不錯的選擇，但可能存在資料隱私以及 GDPR 合規性問題。
選擇分析工具時，重要的是：
鮮味分析檢查所有這些框。
Umami Analytics 是一款簡單、快速且注重隱私的工具，可讓您在不損害使用者隱私的情況下追蹤網站使用情況。它是 Google Analytics 的開源替代品。一大優點是 Umami 分析符合 GDPR（一般資料保護規範）。
有兩種使用 UMAMI 分析的選項
在本文中，我們將探索自架選項。我們將使用 Supabase（免費套餐）作為資料庫（postgres），使用 Vercel（免費套餐/愛好計劃）來託管 Umami。
讓我們深入了解如何使用 Vercel + Supabase 免費自行託管 Umami 分析
編輯 db/postgresql/schema.prisma 檔案（新增 directUrl）
datasource db {
provider = "postgresql"
url = env("DATABASE_URL")
directUrl = env("DIRECT_DATABASE_URL") //add this line
relationMode = "prisma"
}
DATABASE_URL = postgres://[user]:[password]@aws-0-[aws-region].pooler.supabase.com:6543/postgres?**pgbouncer=true&connection_limit=1** DIRECT_DATABASE_URL = postgres://[user]:[password]@aws-0-[aws-region].pooler.supabase.com:**5432**/postgres
？ DATABASE_URL 與從 supabase 複製的連接 Url（在步驟 2 中）相同，但您必須在 Url 末尾添加 ?pgbouncer=true&connect_timeout=1
？ DATABASE_URL 與從 supabase 複製的連接 Url（在步驟 2 中）相同，但您必須將連接埠從 6543 替換為 5432
現在執行以下命令（安裝依賴項並設定資料庫連線）
yarn install yarn build-db
然後我們將按照以下步驟建立基線遷移
如果您有 prisma/migrations 資料夾，請刪除、移動、重新命名或存檔此資料夾。
Run the following command to create a migrations directory inside with your preferred name. This example will use 01_init for the migration name:
mkdir -p prisma/migrations/01_init
Generate a migration and save it to a file using prisma migrate diff
npx prisma migrate diff \ --from-empty \ --to-schema-datamodel prisma/schema.prisma \ --script > prisma/migrations/01_init/migration.sql
Run the prisma migrate resolve command for each migration that should be ignored:
npx prisma migrate resolve --applied 01_init
This command adds the target migration to the _prisma_migrations table and marks it as applied. When you run prisma migrate deploy to apply new migrations, Prisma Migrate:
username : admin password : umami
Name : provide any name of your choice Domain : your [website](https://www.invoizly.com) domain (eg. invoizly.com)
In Next.JS projects to load a third-party script for multiple routes, import next/script and include the script directly in your layout component:
import Script from 'next/script'
export default function Layout({
children,
}: {
children: React.ReactNode
}) {
return (
<html lang="en" className="dark">
<body className={cn(`${inter.className} antialiased`)}>
<Navbar />
{children}
<Footer />
</body>
<Script
defer
src="https://[your-analytics-app].vercel.app/script.js"
data-website-id="xxxx-xxx-xxxx-xxxx-xxxxx"
/>
</>
)
}
After adding the Sript in your root layout, deploy your app and visit your web page. you will be able to track the visits on your analytics dashboard page.
Hope with help of this article you will be able to set up analytics for your application quickly and easily, without relying on third-party services. Since Vercel and Supabase both provides generous free tier, you can run your analytics for free in the initial days while being GDPR compliant.
Invoizly is all about making invoicing easy and free. With Invoizly, you can quickly create high-quality, customizable invoices that look professional. It’s designed to be super user-friendly, so you can focus on your business instead of getting bogged down in paperwork.
Cover image by Marissa Grootes on Unsplash
以上是自託管 Umami Analytics：使用 Vercel 和 Supabase 免費部署的完整指南的詳細內容。更多資訊請關注PHP中文網其他相關文章！
