在kubernetes集群里创建homepage导航页服务

前言

大家在独立部署一个docker或者kubernetes集群之后，通常会乐于在互联网上搜索开源系统和工具，尝试在自己的服务器上部署，比如个人页面，管理Dashboard，FTP工具等等，在拥有的系统越来越多的时候，难免希望有一个Dashboard来当作自己的“2345”，将自己的个性信息和页面链接放在上面，分享展示给小伙伴。

要做到这一点的办法有很多，如果你需要更加酷炫的效果，动态页面的能力，你可以直接开发一个界面打包部署在自己的集群里，但是大部分情况下，足够漂亮简洁（也可能RGB），需要一个静态页面就足够了
这种情况下你也可以直接部署在github pages上

我这里就在kubernetes里拉起一个开源的homepage导航页服务，实现同样效果，正好再次测试ArgoCD-GitHub-kubernetes的架构，关于这套集群的搭建，可以参考我之前的文章
Kubernetes + ArgoCD+github搭建自动化个人站点服务部署-上（原创）
Kubernetes + ArgoCD+github搭建自动化个人站点服务部署-下（原创）

容器化部署过程比较简单，就不去列举目标了

准备部署文件

我选择的开源导航页面是homepage，在github上有不少的stars，用它的人不在少数，这个静态页面完全支持容器化部署和配置，而且它的所有配置采用config yaml文件实现更改，虽然不如其他的一些导航界面直接在页面上配置来得方便，但是更加好看和“专业”。
这里贴一下项目源码和文档的传送门

homepage(Github)
homepageDcoument

官方提供了服务的docker compose文件，支持docker一键拉起服务：

services:
  homepage:
    image: ghcr.io/gethomepage/homepage:latest
    container_name: homepage
    environment:
      PUID: 1000 # optional, your user id
      PGID: 1000 # optional, your group id
    ports:
      - 3000:3000
    volumes:
      - /path/to/config:/app/config # Make sure your local config directory exists
      - /var/run/docker.sock:/var/run/docker.sock:ro # optional, for docker integrations
    restart: unless-stopped

分析这个简单的compose文件，我们可以看到一些关键信息

• PUID 和 PGID 是可选的用户和组 ID，通常用于确保容器内的文件权限与主机一致，以避免权限问题
• 将主机的 /path/to/config 目录挂载到容器的 /app/config 目录，确保容器可以访问配置文件。
  这个文件夹下的各种config文件是homepage的核心配置文件，所有的内容配置都在这里实现
• 将 Docker 的套接字挂载为只读（ro），这通常用于需要与 Docker API 交互的服务。

现在我们需要将这个服务更改为kubernetes的方式去部署出来，我们需要继承docker部署方式中的镜像，环境变量，和数据卷：
我这里做一个示范，部署方式因人而异，注意用kubernetes不熟的话，dokcer套接字部分就不需要了

这里为了方便演示，而且导航页面的数据量较小，使用本地hostpath方式存储数据，如果有迁移的需求可以创建PV、PVC资源挂载数据

ArgoCD会将指定目录下的yaml全部拉起，所以你的资源配置文件或放在一个文件中，或至少要在同一路径下

apiVersion: apps/v1
kind: Deployment
metadata:
  name: homepage
  labels:
    app: homepage
spec:
  replicas: 1
  selector:
    matchLabels:
      app: homepage
  template:
    metadata:
      labels:
        app: homepage
    spec:
      containers:
      - name: homepage
        image: ghcr.io/gethomepage/homepage:latest
        ports:
        - containerPort: 3000
        env:
        - name: PUID
          value: "1000"  # optional, your user id
        - name: PGID
          value: "1000"  # optional, your group id
        volumeMounts:
        - name: config-volume
          mountPath: /app/config
      volumes:
      - name: config-volume
        hostPath:
          path: /path/to/config  # 确保此路径在主机上存在

服务部署好我们还需要将它暴露出来，依旧是采用简单的nodeport方式：

apiVersion: v1
kind: Service
metadata:
  name: homepage
spec:
  type: NodePort
  selector:
    app: homepage
  ports:
    - port: 3000
      targetPort: 3000
      nodePort: 30001  # 自定义nodeport暴露端口，范围是30000-32767

准备好两个文件后放在自己的git仓库中，我们来配置argocd应用
在ArgoCD中新起Project如果你新规划了project，别忘了这步，并且在Settings->Repositories中建立链接到配置文件仓库，注意私有仓库使用Accesskey作为https链接的密码

不同的project需要重新创建仓库链接，如果嫌每次配置麻烦，而且你的配置文件都在一个仓库下，可以点击"SAVE AS CREDENTIALS TAMEPLATE“按钮，通配这一配置

配置流水线

现在我们可以在ArgoCD中建立新的application


添加完成后由于我默认是手动同步，可以看到application还未启动，需要手动发起一次sync

服务很简单，点击之后看到已经拉起了

同样可以在kubernetes dashboard中查看服务状态

还记得我们服务的暴露方式吗，没错，就是ip+端口的nodeport，我们手动指定了30001端口

至此，我们的导航界面就部署完成啦，访问https://{ip}:端口，可以看到刚刚部署的页面

后续配置

之前提到过，位于/path/to/config路径下的config文件都是homepage的核心配置文件，我们可以修改一个尝试一下

这里以bookmarks.yaml文件为例，这是所有书签页的配置地址，你只需要按格式添加自己需要的内容即可

比如我这里添加一个百度的书签页

# For configuration options and examples, please see:


# https://gethomepage.dev/configs/bookmarks  

- Developer:  
    - Github:  
        - abbr: GH  
          href: https://github.com/  
- Social:  
    - Reddit:  
        - abbr: RE  
          href: https://reddit.com/  
- Entertainment:  
    - YouTube:  
        - abbr: YT  
          href: https://youtube.com/  
    - Baidu:  
        - abbr: BD  
          href: https://baidu.com/  

Hostpath挂载的目录，任何的本地修改都会反映到容器里，在修改完保存好之后，我们会到页面，点击右下角的刷新按钮，就会发现修改已经生效

ok，至此剩下的homepage的配置交给大家自行探索，你可以直接拿大神的配置文件来修修改改，也可以阅读官网文档理解配置的细节，homepage是一个配置十分自由的服务，背景图片，服务链接，等等等等都可以魔改

如果有更进一步服务不通过ip+端口访问的需求，可以关注作者的后续其他博客

have a good time