Uptime-kuma 网站状态监控面板-Docker部署教程

Uptime-kuma 是一个免费开源的网站状态监控工具，支持监控HTTP(s)/TCP/HTTP(s)关键字/Ping/DNS记录/推送/Steam Game Server等功能的正常运行。同时，它还支持多种通知渠道，如电子邮件 (SMTP) 和钉钉机器人等70多种通知服务报警。

部署教程

1. 安装uptime-kuma
   运行uptime docker代码部署即可，数据默认挂载在/www/wwwroot目录下（我的docker是直接在宝塔面板傻瓜式安装的，不详写了，记得先在vps上安装配置docker）

docker pull louislam/uptime-kuma:1
docker stop uptime-kuma
docker rm uptime-kuma
# Default
docker run -d --restart=always -p 3001:3001 -v uptime-kuma:/app/data --name uptime-kuma louislam/uptime-kuma:1

2. 放行端口
   防火墙放行端口3001，该端口可自行修改映射
3. 配置后台及反代
   ip :端口（3001或其他自定义）访问配置后台账号，也通过nginx反向代理和ssl证书实现https访问。

4. 配置监控及自定义 CSS美化状态页
   添加监控项、通知项和状态页，在常规设置将入口页面改为状态页，进入状态页添加监控及美化页面!

/* 美化代码*/@font-face{font-family:'1666963922';src:url('https://jsd.cdn.zzko.cn/gh/54ayao/ACG@main/static/fonts/1666963922.woff')format('woff');font-weight:normal;font-style:normal;}/* 全局样式 */body{font-family:'1666963922',sans-serif;/* 使用自定义字体 */color:#333;margin:0;padding:0;background-image:url('https://t.mwm.moe/pc');/* 自适应背景图片API */background-attachment:fixed;background-size:cover;background-position:center center;background-repeat:no-repeat;}/* 导航栏链接悬停样式 */.navbar a:hover{text-decoration:underline;}/* 卡片样式 */.card{background-color:#fff;border-radius:5px;box-shadow:0 2px 5pxrgba(0,0,0,0.1);margin-bottom:20px;padding:20px;}/* 卡片标题样式 */.card-title{font-size:18px;font-weight:bold;margin-bottom:10px;}/* 在明亮主题下，应用不同的背景色及75%透明度 */.shadow-box{background-color:rgba(255,255,255,0.75);padding:10px;margin:5px;border-radius:10px;box-shadow:0 2px 5pxrgba(0,0,0,0.1);text-decoration:none;}/* 在暗色主题下，应用不同的背景色及65%透明度 */.dark .shadow-box:not(.alert){background-color:rgba(0,0,0,0.65);padding:20px;margin:10px;border-radius:5px;box-shadow:0 2px 5pxrgba(0,0,0,0.1);}/* 侧边栏样式 */.sidebar{background-color:rgba(255,255,255,0.9);padding:20px;margin:10px;border-radius:5px;box-shadow:0 2px 5pxrgba(0,0,0,0.1);}/* 特定元素和类的样式 */span[data-v-7d4a7f28], .item-name, div.description[data-v-7d4a7f28][data-v-b8247e57][contenteditable="true"], div[data-v-7d4a7f28][data-v-b8247e57].alert-heading.p-2, .refresh-info > div, .alert-heading.p-2 > div, .alert-heading.p-2 > p, .alert-heading.p-2 > h1{background-image:linear-gradient(90deg,#07c160,#fb6bea 25%,#3aedff 50%,#fb6bea 75%,#28d079);font-family:'1666963922',sans-serif;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-size:400% 100%;animation:wzw 10s linear infinite;}/* 动画关键帧定义 */@keyframeswzw{0%{background-position:0% 50%;}50%{background-position:100% 50%;}100%{background-position:0% 50%;}}#app{font-family:'1666963922',BlinkMacSystemFont,'segoe ui',Roboto,'helvetica neue',Arial,'noto sans',sans-serif,'apple color emoji','segoe ui emoji','segoe ui symbol','noto color emoji'!important;}

5.最好在状态页自定义底部文本添加 <a href="https://域名/dashboard">后台管理</a> ，防止遗忘后台页面。

演示地址:https://tz.wuzuhua.cn