基于腾讯云轻量应用服务器和Umami部署网站流量统计后台

2022-03-01 16:54:14 浏览数 (1)
这年头，怎么能没头图(*☻-☻*)这年头，怎么能没头图(*☻-☻*)

网站流量统计

想知道自己网站，每天有多少人浏览？或者想更直观的查看自己网站的访客统计？很多人会使用Google Analytics等工具进行统计。一般统计的数据：

  • 一天中的网站访客数量
  • 访客平均页面停留时间
  • 访问来源（从什么网站跳转到自己的网站）
  • ……

但是，一些第三方工具，接入复杂，而且数据由不在自己手里，担心个人数据被第三方平台进行算法优化、用户建模等。

快来试试Umami，一个基于Nodejs开发的网站浏览统计系统，搭建自己的网站统计后台，甚至完胜。

官方Demo图官方Demo图

Umami

Umami基于Node.js开发，所有数据存储在自己的Mysql（当然，支持MariaDB）或Postgresql内。不用担心自己的数据被“白嫖”或是滥用。

挺好奇，单用MySQL数据库，Umami是怎么解决高并发情况下，“幻读”或者“脏读”问题的？有机会研究研究源码～～

Umami开源地址：https://github.com/mikecao/umami

Umami官方文档地址：https://umami.is/docs/about

轻量应用服务器

Unami需要一台自己的服务器，这里推荐使用腾讯云轻量应用服务器，同时如果你还没有域名备案，可以先使用腾讯云轻量应用服务器的香港、新加坡服务器，用极低的价格，快速构建。

相比传统的CVM，部署更轻快，对钱包更友好，而且使用轻量应用服务器，部署一个应用，再合适不过了，我自己就买了好多服务器，部署多个应用：

小巧玲珑，方便部署小巧玲珑，方便部署

准备工作

核心硬件方面，只需要一台服务器。但是如果你想提升体验，建议配备：

  • 域名：方便使用域名和HTTPS访问即将搭建的Umami后台，更安全和方便。
  • CDN：使用CDN（如腾讯云CDN）进行域名访问，加快网站访问，同时一定程度保护服务器IP。

其次是软件方面，需要：

  • MySQL/MariaDB：Umami数据存放。
  • Nginx：使用Nginx，对umami的默认3000端口进行反向代理。
  • Nodejs：如果你并没有安装Nodejs，可以看这篇文章=>https://www.mintimate.cn/2021/07/26/nvmNode/

本次教程，为了照顾小白；同时演示常规方法和宝塔方法；如果你之前并没有使用过任何服务器，可以使用宝塔方法搭建。

服务器购买

首先是购买腾讯云轻量应用服务器，个人建议购买基于宝塔镜像版本，或者是纯净的Debian版本：

宝塔镜像宝塔镜像
Debian系统镜像Debian系统镜像

使用宝塔镜像的小伙伴，可以在初始化服务器后，访问宝塔面板，安装：

安装Nginx和Mysql（版本随意）安装Nginx和Mysql（版本随意）

安装umami

之后，我们需要SSH远程连接我们的Linux服务器；

如果你是第一次使用Linux服务器，不知道怎么连接服务器，可以查看教程：

  • 详解如何SSH远程登录自己的Linux服务器

克隆umami仓库

远程连接上我们的服务器后，我们需要克隆umami的仓库：https://github.com/mikecao/umami

我们直接用git进行克隆即可：

代码语言：shell复制
git clone https://github.com/mikecao/umami

如果你的服务器无法连接GitHub，可以使用Github加速

克隆umami仓库克隆umami仓库

安装依赖

安装依赖，需要Nodejs的支持，如果你没有安装Nodejs，可以查看文章：

  • https://cloud.tencent.com/developer/article/1812323

之后进入刚刚克隆的仓库内，我们就可以安装依赖：

代码语言：shell复制
# 进入刚刚克隆的仓库内
cd umami
# 使用NPM进行依赖安装
npm install
umami安装依赖umami安装依赖

到此，依赖安装结束，我们要初始化数据库。

初始化数据库

初始化数据库，这里给大家演示两个方法：

  • 常规方法：自己配置和安装MySQL数据库情况。
  • 宝塔方法：使用宝塔安装数据库的情况。

如果你并不想使用宝塔面板，但是不知道怎么手动配置MySQL/MariaDB，参考文章：

  • 一篇文章，四种方法教你在Linux上安装MariaDB
  • 一篇文章、三种方法在Debian上轻松安装Nginx

常规方法（推荐非小白）

常规方法，确保你已经安装了MySQL或者MariaDB，我出于个人习惯，安装的是MariaDB：

安装的MariaDB版本安装的MariaDB版本

很简单，我初始化数据库的步骤：登录数据库-创建新数据库-创建新用户-绑定数据库-用umami自带的SQL初始化。

如果你有什么其他需求，可以自行更改（比如：如果不需要安全，可以直接用root用户初始化数据库）。

登录数据库太简单了，我设置数据库是本地登录不需要密码，所以：

代码语言：shell复制
# 登录数据库
mariadb
登录MariaDB登录MariaDB

数据库与用户

相信看常规方法的小伙伴，肯定对SQL语句有所了解，我就粗略说一下：

代码语言：SQL复制
# 创建一个用户，并智允许本机访问
CREATE USER 'umami'@'localhost' IDENTIFIED BY 'E51H1c1c';
# 创建一个数据库
CREATE DATABASE umami;
创建数据库与用户创建数据库与用户

其中：

  • E51H1c1c：我设置的数据库密码。
  • 数据库和用户吗我都取名为umami，方便分类。
  • 我只允许本地登录，方便进行安全管理。

用户权限赋予

之后，我们把新建的数据库，交给新建的用户去管理：

代码语言：SQL复制
GRANT ALL ON umami.* TO 'umami'@'localhost';

之后退出MariaDB的交互：

退出交互退出交互

SQL初始化

umami自带SQL文件，让我们来初始化数据库：

自带的SQL文件自带的SQL文件

所以，我们提取运行即可：

代码语言：sql复制
mariadb -u umami -p umami < sql/schema.mysql.sql

其中：

  • -u umami：使用umami账户；
  • -p umami：理论上-p代表使用密码，但是这里代表使用密码访问，umami代表访问的数据库。
SQL初始化SQL初始化

到此，SQL的初始化就完成了，可以登录MariaDB里看看：

SQL初始化SQL初始化

宝塔方法（推荐小白）

宝塔方法就很简单了，在宝塔内，新建数据库即可：

宝塔面板内新建数据库宝塔面板内新建数据库
获取的数据获取的数据

之后，回到Terminal内，用使用umami自带的SQL文件进行数据库初始化：

代码语言：sql复制
mysql -u umami -p umami < sql/schema.mysql.sql
SQL初始化SQL初始化

其中，密码会自动隐藏哦，直接宝塔后台复制后，到这里进行粘贴即可。

到此，SQL的初始化就完成了。

配置环境

umami需要我们配置一个.env的环境在umami根目录，之后umami会读取这个文件进行数据库的连接和“Hash加盐”。

代码语言：shell复制
vim .env

我们直接用vim进行创建，并写入：

代码语言：shell复制
DATABASE_URL=mysql://umami:E51H1c1c@localhost:3306/umami
HASH_SALT=Mintimate
配置环境配置环境

其中：

  • 第一个umami为用户名
  • E51H1c1c为用户密码
  • 第二个umami为数据库
  • HASH_SALT为Hash加盐字符，任意字符串即可。

配置好以后，保存并推出即可。如果你并不知道vim的操作，可以使用宝塔面板操作，或者查看文章：

  • 终端文本编辑神器--Vim命令详解。如何配置Vim以及Vim插件？

或者直接使用宝塔面板进行操作：

腾讯云轻量应用服务器宝塔镜像腾讯云轻量应用服务器宝塔镜像

因为我同时买了两台轻量应用服务器进行演示（一台宝塔镜像，一台Debian），所以Umami的安装地址有时候不一样；大家要记住自己的Umami安装地址哦。

构建umami

最后，我们可以更具自己的配置（数据库），进行umami的构建，很简单，使用命令：

代码语言：javascript复制
npm run build

注意，这里需要下载依赖包，而依赖包下载地址并没有中国大陆节点；所以，大陆服务器可能会构建比较慢，甚至构建失败。（腾讯云轻量应用服务器的香港、新加坡地区会比较快）

构建失败，就重新运行一次npm run build

构建中……构建中……
构建成功……构建成功……

运行umami

之后，我们可以使用：

代码语言：javascript复制
npm run start

启动umami：

启动成功……启动成功……

这个时候，用浏览器就可以访问了。但是为了使用更方便，我们使用Nginx进行反向代理。

后台运行

另外，推荐后台运行umami，可以使用screen：https://cloud.tencent.com/developer/article/1844735

当然，你也可以注册为systemctl服务，注册内容参考：

代码语言：shell复制
[Unit]
Description=NodeServer

[Service]
ExecStart=/……/npm start
Restart=always
Environment=PATH=/usr/bin:/usr/local/bin:/……node/bin
Environment=NODE_ENV=production
WorkingDirectory=/YourWorkPath/umami/

[Install]
WantedBy=multi-user.target

最后效果：

使用systemctl使用systemctl

这个……有机会本篇文章视频化，给大家演示一下；或者另外出一篇Systemctl教程给大家。

Nginx反向代理

为了能使用Https访问，或者说用443、80端口访问，而不是奇怪的IP 3000端口，这样的奇怪方式访问umami。我们使用Nginx进行反向代理：

常规操作

常规操作，就是我们自己编译安装的Nginx，我们编译Nginx配置，添加反向代理配置：

代码语言：text复制
location /{
    proxy_pass http://127.0.0.1:3000/;
}
Nginx配置Nginx配置

宝塔操作

当然，你也可以使用宝塔进行操作：

首先是宝塔添加域名：

宝塔添加域名宝塔添加域名

之后是反向代理：

Nginx配置Nginx配置

如果你并不知道域名解析，可以参考腾讯云的DNS文档：https://cloud.tencent.com/document/product/302/2589

如何使用

首先，我们到后台，创建一个网站：

添加网站添加网站

之后，我们复制跟踪代码，到自己网站的<head>内粘贴即可：

添加网站添加网站
添加网站追踪代码添加网站追踪代码

我是Vue项目，放到根目录的index.html即可；重新部署：

网站head网站head

即可跟踪网站数据：

网站数据开始追踪网站数据开始追踪

最终效果

最终效果最终效果

当然，还可以看看用户来源：

最终效果2最终效果2

方便我们根据用户喜好，去写一些用户喜欢的内容，或者调整自己的网站发展方向、SEO优化等。比如图中，大部分用户是bing搜索引擎过来的，为什么百度搜索引擎没有呢？可能是SEO优化问题，或者是百度文章内容，百度爬虫不喜欢等等。

唯一有点不足的是，IP库不是很全（有能力的小伙伴，可以魔改一下(*≧ω≦)）：

最终效果3最终效果3

END

到此，Umami就安装和部署网站了。是不是还有小伙伴想知道如何进行OTA升级呢？

其实官方也提供了方法，只需要在Umami没有运行情况下，重新pull并进行依赖安装和构建即可：

代码语言：shell复制
# 此时Umami没有运行，Terminal处于Umami地址内
git pull
# 依赖重新安装
npm install
# 重新构建项目
npm run build
# 重新启动项目（如果有配置Systemctl，可以使用）
npm run start
轻量应用服务器 linux node.js

0 人点赞