一、域名解析

面板域名以nezha.a.com为例，Cloudflare中添加A记录nezha.a.com指向Dashboard 服务器 IP，开启小黄云。a.com域名设置页面——网络，选择开启WebSockets 和 gRPC ；SSL/TLS模式选择完全（严格）。

二、哪吒面板搭建

ssh连接vps，输入代码

sudo mkdir -p /opt/nezha && cd /opt/nezha
nano docker-compose.yml
docker compose up -d

docker-compose.yml文件：

services:
  dashboard:
    container_name: nezha-dashboard
    image: ghcr.io/nezhahq/nezha:latest
    restart: unless-stopped
    volumes:
      - ./dashboard/data:/dashboard/data
    ports:
      - 8008:8008

三、反代设置

1.1panel面板中新建反向代理网站，网站 —— 创建网站 —— 反向代理，主域名填写nezha.a.com，代理地址填写127.0.0.1:8008

证书页面自行设置Acme账户、DNS账户为nezha.a.com申请证书。

网站页面点击nezha.a.com进入网站设置，开启https。

点击配置文件，最下方添加以下代码，保存并重载。

# upstream 配置
upstream dashboard {
    keepalive 512; 
    server 127.0.0.1:8008; 
}

1panel

2.打开网站 —— 反向代理 —— 源文，使用以下代码替换原内容，点击确认。至此，反向代理设置完成。

location ^~ / {
    proxy_pass http://127.0.0.1:8008; 
    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 REMOTE-HOST $remote_addr; 
    proxy_set_header Upgrade $http_upgrade; 
    proxy_set_header nz-realip $http_cf_connecting_ip;
    proxy_set_header Connection "upgrade";
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_http_version 1.1; 
    proxy_read_timeout 3600s;
    proxy_send_timeout 3600s;
    proxy_buffer_size 128k;
    proxy_buffers 4 128k; 
    proxy_busy_buffers_size 256k;
    proxy_max_temp_file_size 0;
    add_header X-Cache $upstream_cache_status; 
    add_header Cache-Control no-cache; 
    proxy_ssl_server_name off; 
    proxy_ssl_name $proxy_host; 
    add_header Strict-Transport-Security "max-age=31536000"; 
}

underscores_in_headers on;
set_real_ip_from 0.0.0.0/0; # CDN 回源 IP 地址段
real_ip_header CF-Connecting-IP; # CDN 私有 header，此处为 CloudFlare 默认

# gRPC 服务
location ^~ /proto.NezhaService/ {
    grpc_set_header Host $host;
    grpc_set_header nz-realip $http_CF_Connecting_IP; 
    grpc_read_timeout 600s;
    grpc_send_timeout 600s;
    grpc_socket_keepalive on;
    client_max_body_size 10m;
    grpc_buffer_size 4m;
    grpc_pass grpc://dashboard;
}

# WebSocket 服务
location ~* ^/api/v1/ws/(server|terminal|file)(.*)$ {
    proxy_set_header Host $host;
    proxy_set_header nz-realip $http_cf_connecting_ip; 
    proxy_set_header Origin https://$host;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_read_timeout 3600s;
    proxy_send_timeout 3600s;
    proxy_pass http://127.0.0.1:8008;
}

1panel

四、哪吒面板设置

1.登录到 Dashboard 配置界面https://nezha.a.com/dashboard，初始用户名、密码均为admin，登录后立即进入管理页面点击头像 —— 个人信息 —— 更新个人资料修改用户名和密码。

2.点击头像 —— 系统设置，填写站点名称、设置语言，Agent对接地址【域名/IP:端口】填写nezha.a.com:443，勾选Agent 使用 TLS 连接，点击确认即可。

3.添加telegram通知：

通知页面点击“+”，创建通知，名称自定，URL填写https://api.telegram.org/bot<你的机器人Token>/sendMessage?chat_id=<你的用户ID>&text=#NEZHA#，将 <你的机器人Token> 和 <你的用户ID> 替换为实际值。

获取 URL 参数 获取机器人 Token：与 @BotFather 对话，发送/newbot创建新机器人，获取 Token。 获取用户 ID：与 @userinfobot 对话，获取你的用户 ID。 与机器人对话：先与新创建的机器人发送一条消息，确保机器人可以发送消息给你。

分组——通知，页面点击“+”，编辑通知分组，名称自定，通知勾选提前创建的telegram通知，确认即可。

4.记住一定要禁用被控端网页SSH

sed -i 's/disable_command_execute: false/disable_command_execute: true/' /opt/nezha/agent/config.yml && systemctl restart nezha-agent

五、哪吒v1美化

[hide]

<script>
window.CustomBackgroundImage="图片URL"; /* 页面背景图 */
</script>

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/aixin.js"></script>/* 点击爱心特效 */

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/yinghua.js"></script>/* 页面樱花效果 */

<span class="js-cursor-container"></span>
<script src="https://fastly.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/autoload.js"></script>
<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/xiaoxingxing.js"></script>
/* 以上鼠标特效 */

<script>
var observer = new MutationObserver(function(mutationsList, observer) {
    var xpath = "/html/body/div/div/main/div[2]/section[1]/div[4]/div";
    var container = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

    if (container) {
        observer.disconnect();
        var existingImg = container.querySelector("img");
        if (existingImg) {
            container.removeChild(existingImg);
        }
        var imgElement = document.createElement("img");
        imgElement.src = "图片URL";
        imgElement.style.position = "absolute";
        imgElement.style.right = "8px";
        imgElement.style.top = "-80px";
        imgElement.style.zIndex = "10";
        imgElement.style.width = "90px";
        container.appendChild(imgElement);
    }
});
var config = { childList: true, subtree: true };
observer.observe(document.body, config);
</script>

以上是换卡通小人

<script>
    window.CustomLogo = "图片URL"; /* 自定义Logo */
    window.ShowNetTransfer  = "true"; /* 卡片显示上下行流量 */
    window.DisableAnimatedMan  = "true"; /* 关掉动画人物插图 */
    window.CustomDesc ="MJJ：白嫖至上，技术先行"; /* 自定义描述 */
</script>


<style> 
  .dark .bg-card {
   font-family: "Roboto", "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #ffffff; /* 白色，高对比度 */
    position: relative; /* 设置元素为相对定位 */
    background-color: rgba(0, 0, 0, 0.3); /* 设置背景颜色为半透明的黑色 */
    backdrop-filter: blur(5px); /* 应用毛玻璃效果，模糊度为5像素 */
    border-radius: 15px; /* 设置边框圆角为15像素 */
    //box-shadow: 0 6px 8px rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
    //overflow: hidden;  /* 确保内容不会溢出容器 */
    }
  .dark .bg-card h1, .dark .bg-card h2, .dark .bg-card h3 {
    color: #ffffff; /* 保持标题的高对比度 */
  }
  .dark .bg-card p {
    color: #eeeeee; /* 段落文本稍微柔和一些 */
  }
</style>

以上是调整毛玻璃效果"//"是不喜欢的所以注释掉

{
   "billingDataMod": {
       "startDate": "2024-11-05T00:00:00+08:00",
       "endDate": "2025-05-05T00:00:00+08:00",
       "autoRenewal": "1",
       "cycle": "半年",
       "amount": "$10.5"
   },
   "planDataMod": {
       "bandwidth": "1000Mbps",
       "trafficVol": "500GB/月",
       "trafficType": "1",
       "IPv4": "1",
       "IPv6": "0",
       "networkRoute": "电信163,移动CMI,联通4837",
       "extra": "传家宝"
   }
}


<meta name="referrer" content="no-referrer">
<div class="video-box">
  <video id="myVideo" muted
    src="https://img.028029.xyz/1734966841908.mp4"
    autoplay playsinline loop>
  </video>
</div>
<style>
  :root {
    --custom-border-color: rgba(13, 11, 9, 0.1);
    --custom-background-color: rgba(13, 11, 9, 0.4);
    --custom-background-image: unset;
  }

  .dark #root {
    background-color: unset !important;
  }

  .dark .bg-card {
    background-color: var(--custom-background-color);
    backdrop-filter: blur(4px);
    border: 1px solid rgba(13, 11, 9, 0.1);
    box-shadow: 0 4px 6px rgba(13, 11, 9, 0.2);
    /* 阴影效果 */
  }

  .focus\:text-accent-foreground:focus {
    background-color: rgba(13, 11, 9, 0.5);
  }

  .dark .text-muted-foreground {
    color: #fff;
  }

  .dark\:bg-stone-700:is(.dark *) {
    --tw-bg-opacity: 0.5;
  }

  html.dark * {
    border-color: var(--custom-border-color);
  }

  html.dark body {
    color: #f4f5f6;
    background: unset;
    position: relative;
  }

  img {
    border: none;
  }

  .dark\:border-neutral-800:is(.dark *) {
    border-color: var(--custom-border-color);
  }

  .dark\:bg-stone-800:is(.dark *) {
    --tw-bg-opacity: 0.5;
    background-color: rgb(41 37 36 / var(--tw-bg-opacity, 1));
  }

  .dark\:text-stone-500:is(.dark *) {
    color: #f4f5f6;
  }

  .dark .bg-secondary {
    background-color: unset;
  }

  .dark .bg-popover {
    background-color: unset;
  }

  .dark .bg-muted {
    background-color: var(--custom-border-color);
  }

  .dark\:bg-black:is(.dark *) {
    background-color: rgba(13, 11, 9, 0.1);
  }

  .dark .bg-border {
    background-color: var(--custom-border-color);
  }

  .dark .border-input {
    border-color: var(--custom-border-color);
  }

  .dark\:text-neutral-300\/50:is(.dark *) {
    color: #999;
  }

  .dark\:text-stone-400:is(.dark *) {
    color: #fff;
  }

  div#radix-\:r4\: {
    background: rgba(0, 0, 0, 0.7);
  }

  .dark .bg-stone-800 {
    background: var(--custom-background-color);
  }

  .text-green-600 {
    color: rgb(34, 197, 94);
  }

  .bg-green-600 {
    background-color: rgb(34, 197, 94);
  }

  .dark .vps-info {
    border-radius: 12px;
    padding: 12px;
  }

  .dark .font-medium.opacity-40 {
    opacity: unset;
  }

  .dark .font-medium.opacity-50 {
    opacity: unset;
  }

  .dark .max-w-5xl.gap-4>div:first-child {
    background-color: var(--custom-background-color);
    backdrop-filter: blur(2px);
    border: 1px solid rgba(13, 11, 9, 0.2);
    box-shadow: 0 4px 6px rgba(13, 11, 9, 0.2);
    border-radius: 12px;
    padding: 12px;
  }

  img[alt="BackIcon"] {
    /* 样式规则 */
    margin-right: 12px;
  }

  .flex.items-center.gap-1.rounded-\[50px\].bg-stone-100.p-\[3px\].dark\:bg-stone-800 {
    backdrop-filter: blur(2px);
  }

  .\[\&_\.recharts-cartesian-axis-tick_text\]\:fill-muted-foreground .recharts-cartesian-axis-tick text {
    fill: #fff;
  }

  .dark\:fill-neutral-800:is(.dark *) {
    fill: #fff;
  }

  .data-\[state\=unchecked\]\:bg-input[data-state=unchecked] {
    background-color: unset;
  }

  .data-\[state\=checked\]\:bg-primary[data-state=checked] {
    background-color: var(--custom-background-color);
  }



  .video-box {
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
  }

  .video-box video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
</style>

<script>
    
    window.CustomMobileBackgroundImage="https://img.028029.xyz/1734664417905.png";
    window.CustomLogo = "https://img.028029.xyz/1734533172211.png";
    window.ShowNetTransfer  = "true";
    window.CustomDesc ="MJJ：白嫖至上，技术先行"; 
    
    window.CustomIllustration = "https://img.028029.xyz/1734664224123.png";
    window.ForceTheme = "dark";

    var observer = new MutationObserver(function(mutationsList, observer) {
    var xpath = "/html/body/div/div/main/div[2]/section[1]/div[4]/div";
    var container = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;

    if (container) {
        observer.disconnect();
        var existingImg = container.querySelector("img");
        if (existingImg) {
            container.removeChild(existingImg);
        }
        var imgElement = document.createElement("img");
        imgElement.src = "https://img.028029.xyz/1734664224123.png";
        imgElement.style.position = "absolute";
        imgElement.style.right = "0px";
        imgElement.style.top = "-60px";
        imgElement.style.zIndex = "10";
        imgElement.style.width = "90px";
        container.appendChild(imgElement);
    }
});
var config = { childList: true, subtree: true };
observer.observe(document.body, config);
</script>

<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/aixin.js"></script>
<span class="js-cursor-container"></span>
<script src="https://cdn.jsdelivr.net/gh/mocchen/cssmeihua/js/xiaoxingxing.js"></script>

[/hide]