侧边栏壁纸

Uptime-kuma 网站监控面板 docker部署教程

2024年05月21日 1.1k阅读 1评论 0点赞

功能介绍

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 run -itd --restart=always --name uptime-kuma
-p 801:3001
-v /www/wwwroot/uptime-kuma:/app/data
louislam/uptime-kuma:latest
  1. 放行端口
    防火墙放行端口801,该端口可自行修改映射
  2. 配置后台及反代
    ip :端口(801或其他自定义)访问配置后台账号,也通过nginx反向代理和ssl证书实现https访问。

Uptime-kuma后台

  1. 配置监控及美化状态页
    添加监控项、通知项和状态页,在常规设置将入口页面改为状态页,进入状态页添加监控及美化页面
/* 美化代码*/@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://api.icnal.com/img/');/* 自适应背景图片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;}

温馨提示

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

演示站点: up.icnal.com

0

—— 评论区 ——

昵称
邮箱
网址
取消
  1. 头像
    回复

    这篇文章写得深入浅出,让我这个小白也看懂了!

博主栏壁纸
37 文章数
49 标签数
116 评论量