准备工作

获取 Github/Jihulab 的 Client ID 和密钥:

哪吒监控接入 Github、Gitlab、Jihulab、Gitee 作为后台管理员账号

  • 首先我们需要新建一个验证应用,以 Github 为例,登录 Github 后,打开 https://github.com/settings/developers ,依次选择“OAuth Apps” - “New OAuth App”

    Application name - 随意填写

    Homepage URL - 填写面板的访问域名,如:"http://cdn.example.com"

    Authorization callback URL - 填写回调地址,如:"http://cdn.example.com/oauth2/callback"

  • 点击“Register application”

  • 保存页面中的 Client ID,然后点击“Generate a new client secret“,创建一个新的 Client Secret,新建的密钥仅会显示一次,请妥善保存

  • JihuLab 的应用创建入口为:https://jihulab.com/-/profile/applications

  • Redirect URL 中应填入回调地址

  • 在下方范围中勾选 read_userread_api

  • 创建完成后,保存好应用程序 ID 和密码

安装面板

  • 在面板服务器中,运行安装脚本:
curl -L https://raw.githubusercontent.com/naiba/nezha/master/script/install.sh  -o nezha.sh && chmod +x nezha.sh && sudo ./nezha.sh

如果你的面板服务器位于中国大陆,可以使用镜像:

curl -L https://jihulab.com/nezha/nezha/-/raw/master/script/install.sh -o nezha.sh && chmod +x nezha.sh && sudo CN=true ./nezha.sh
  • 等待 Docker 安装完毕后,分别输入以下值:

OAuth提供商 - Github,Gitlab,Jihulab,Gitee 中选择一个

Client ID - 之前保存的 Client ID

Client Secret - 之前保存的密钥

用户名 - OAuth 提供商中的用户名

站点标题 - 自定义站点标题

访问端口 - 公开访问端口,可自定义,默认 8008

Agent的通信端口 - Agent 与 Dashboard 的通信端口,默认 5555

  • 输入完成后,等待拉取镜像

安装结束后,如果一切正常,此时你可以访问域名 + 端口号,如“http://cdn.example.com:8008”来查看面板

配置反代

  • 在宝塔面板中新建一个站点,域名填写公开访问域名,如“http://cdn.example.com“ ,然后点击“设置”进入站点设置选项,选择“反向代理” - “新建反向代理”
  • 自定义一个代理名称,在下方“目标 URL”中填入 http://127.0.0.1 然后点击“保存”
  • 打开刚刚新建的反向代理右边的“配置文件”,将配置文件替换为以下内容:
#PROXY-START/
location / {
    proxy_pass http://127.0.0.1:8008;
    proxy_set_header Host $http_host;
    proxy_set_header      Upgrade $http_upgrade;
}
location ~ ^/(ws|terminal/.+)$  {
    proxy_pass http://127.0.0.1:8008;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "Upgrade";
    proxy_set_header Host $http_host;
}
#PROXY-END/
  • 点击“保存”

现在,你应该可以直接使用域名,如:“http://cdn.example.com“来访问面板了

自定义页面

<script>
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
        alert("请勿使用微信打开);
        var opened = window.open("about:blank", "_self");
        opened.opener = null;
        opened.close();
    }
</script>

<style>
    .right.menu>a {
        visibility: hidden;
    }

    .footer .is-size-7 {
        visibility: hidden;
    }

    .item img {
        visibility: hidden;
    }
</style>

<script>
    window.onload = function () {
        var avatar = document.querySelector(".item img")
        var footer = document.querySelector("div.is-size-7")
        footer.innerHTML = "Powered by Nezha"
        footer.style.visibility = "visible"
        avatar.src = "https://raw.githubusercontent.com/naiba/nezha/master/resource/static/brand.svg"
        avatar.style.visibility = "visible"
    }
</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-**********"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'UA-**********');
</script>

<script type="text/javascript">window.$crisp=[];window.CRISP_WEBSITE_ID="103e95b6-3b0c-4f8a-9185-349951c14825";(function(){d=document;s=d.createElement("script");s.src="https://client.crisp.chat/l.js";s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();</script>

参考文献

https://nezha.wiki/