YJK

独立世界

Independent World
twitter
telegram

Self-hosted Umami | An open-source website analytics tool

Umami is an open-source website analytics tool designed to provide users with a privacy-focused alternative to Google Analytics. With Umami, website administrators can track visitor behavior and gain insights into website performance without compromising user privacy. Umami offers features such as real-time tracking, customizable dashboards, and detailed reports. Since it is self-hosted, users have full control over their data and ensure it is not shared with third-party companies.

Here is a brief introduction to deploying Umami on Vercel:

0/ Preparation#

  1. A Github account
  2. A Vercel account (can be logged in with Github)
  3. A Supabase account (can be logged in with Github)

1/ Fork Umami#

Log in to Github, visit the following Umami repository, and Fork it to your Github account

Go to your Forked Umami repository, click Add file - Create new file

image

Fill in the name as vercel.json and the content as:

{
  "rewrites": [
    {
      "source": "/index.js",
      "destination": "/umami.js"
    }
  ]
}

image

2/ Create a Database#

Log in to Supabase, click New project to create a project, enter the project name, database password (very important, keep a record), recommend selecting East US as the region, and click create and wait for a moment.

image

Go to the project, click on settings - Database - Connection string - URI, copy the database connection information and save it for later use (replace [YOUR-PASSWORD] with the password set when creating the project).

image

3/ Build Umami on Vercel#

Log in to Vercel using Github, click Add New... - Project, select your Forked Umami repository, and click Import

image

Expand Environment Variables and enter the following content:

  • name HASH_SALT - value random string
  • name DATABASE_URL - value database connection information recorded in the previous step

Special reminder: You need to add ?pgbouncer=true after the database connection information, for example:

postgresql://postgres:[email protected]:5432/postgres?pgbouncer=true

image

Click Deploy and wait for a while to see the successful deployment. Since the default domain vercel.app has been blocked by Vercel, it is recommended to go to settings - Domains and bind your own domain.

First, point your subdomain CNAME to cname-china.vercel-dns.com, then click Add.

Visit your domain and log in with the username admin and password umami. Remember to change the password after logging in.

4/ Reference to Your Website#

In the Umami backend, go to the settings page, create a new website, copy the reference code, and paste it before </body> on your website.

image

In particular, due to the default links in Umami being blocked by Adblock plugins, making it unable to collect website information, according to the settings in the first step, you can replace umami.js in the code with index.js so that it will not be blocked by Adblock. For example:

Original code:

<script async defer data-website-id="xxxxxx" src="https://tongji.domain.com/umami.js"></script>

Modified code:

<script async defer data-website-id="xxxxxx" src="https://tongji.domain.com/index.js"></script>
Loading...
Ownership of this post data is guaranteed by blockchain and smart contracts to the creator alone.