个人Plausible搭建记录

Plausible Analytics是一个开源、轻量级且注重隐私的网站分析工具，与谷歌分析相比有以下优势：

轻量级：仅2KB大小，比谷歌分析小45倍
无cookie：默认不使用cookie，无需烦人的cookie通知横幅
尊重隐私：不收集个人数据，完全符合GDPR、CCPA等法规
开源透明：代码完全开源，可自行审查
简洁界面：一页式仪表板，关键指标一目了然
自托管选项：完全控制自己的数据

Plausible Analytics界面

一、准备工作

一台云服务器（我使用的是腾讯云服务器，目前有活动(截止2025-04-30)，境外服务器99/年，系统镜像选Ubuntu Server 22.04 LTS）
一个域名（我是Spaceship上买的，随便挑了个，十几块钱一年）
基本的命令行操作知识

服务器配置

二、服务器部署Plausible

Plausible提供了Docker部署方式，非常便捷。下面是核心步骤：

安装Docker和Docker Compose

sudo apt update
sudo apt install docker.io docker-compose

创建Plausible配置目录

mkdir -p plausible
cd plausible

下载Docker配置文件

wget https://raw.githubusercontent.com/plausible/hosting/master/docker-compose.yml
wget https://raw.githubusercontent.com/plausible/hosting/master/plausible-conf.env

修改配置文件

在plausible-conf.env中设置基本参数，包括管理员邮箱、网站域名等。

启动Plausible服务

docker-compose up -d

这样，Plausible服务就会在服务器的8000端口上运行。

三、解决HTTPS访问问题

为了保证分析脚本能在HTTPS网站上正常加载，我们需要为Plausible配置安全访问，推荐Cloudflare：

注册Cloudflare账户

如果没有Cloudflare账号，需要先注册一个，然后添加域名

Cloudflare注册

设置DNS记录

添加A记录，将你的域名指向服务器IP
确保代理状态是"已代理"（橙色云图标）

DNS设置

配置SSL/TLS

在Cloudflare控制面板中设置SSL/TLS为"灵活"模式
这样，用户到Cloudflare是HTTPS，Cloudflare到服务器是HTTP

SSL配置

更改域名服务器

在域名注册商处，将DNS服务器指向Cloudflare提供的名称服务器(截图中的两个NS值)
等待DNS生效（官方说需要24小时，但实测下来基本都很快，通常几秒到几分钟）

域名服务器配置

四、配置Nginx反向代理

为了将域名请求正确转发到Plausible服务，需要配置Nginx：

创建Nginx配置文件

sudo nano /etc/nginx/sites-available/你的域名

添加以下配置

server {
    listen 80;
    server_name 你的域名;

    location / {
        proxy_pass http://localhost:8000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        # WebSocket支持
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
        proxy_read_timeout 86400;
    }
}

启用配置并重启Nginx

sudo ln -s /etc/nginx/sites-available/你的域名 /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

五、将Plausible集成到网站

最后一步是将分析脚本添加到您的网站。以Next.js为例：

创建Plausible.tsx组件

// src/components/analytics/Plausible.tsx
'use client'

import Script from 'next/script'

export function Plausible() {
  return (
    <>
      <Script
        defer
        data-domain="当前网站域名"
        src="https://你部署的Plausible域名.com/js/script.js"
        strategy="afterInteractive"
      />
      <Script id="plausible-setup" strategy="afterInteractive">
        {`
          window.plausible = window.plausible || function() {
            (window.plausible.q = window.plausible.q || []).push(arguments)
          }
        `}
      </Script>
    </>
  )
}

export default Plausible

在应用中引入组件

// src/app/layout.tsx
import { Plausible } from '@/components/analytics/Plausible'

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Plausible />
      </body>
    </html>
  )
}