告别命令行焦虑Docker Compose UI:cpolar内网穿透实验室第570号成功挑战

软件名称:Docker Comorse UI

操作系统支持:Windows/macOS/Linux(Web浏览器访问)

软件介绍:

Docker Compose UI 是 Docker Compose 的"可视化翻译器",把原本需要死记硬背的命令行操作,变成拖拽、点击的图形界面。无需敲复杂指令,就能管理服务启动/停止、查看实时日志、动态调整配置,特别适合刚接触容器化技术的新手或需要多人协作的团队。

Docker Comorse UI × 可视化:告别命令行的痛苦!

  • "小白友好"模式 :把 docker-compose up -d 换成点击按钮,连小学生都能启动服务。
  • 上帝视角监控:所有服务状态、依赖关系一目了然,再也不用靠脑子想象容器网络拓扑图。
  • 动态配置编辑:修改环境变量或端口映射直接拖拽,比改YAML文件快十倍。

Docker Comorse UI 的三大应用场景

  1. 新手开发者入门救星
    • 爽点:通过图形界面一步步配置服务,错误提示直接高亮显示,学习曲线平如高速公路!
  2. 团队协作的"说明书"
    • 爽点:UI界面直观展示所有服务依赖关系,像看乐高说明书一样快速上手。
  3. 远程调试神器
    • 爽点:通过浏览器实时查看日志、重启服务,甚至直接在UI里执行滚动更新。

cpolar × Docker Comorse UI = 远程管理自由!

-将Docker Comorse UI部署到本地服务器后,通过 Cpolar 一键映射公网地址。无论在家、咖啡厅还是跨时区会议,都能远程访问容器状态、一键操作服务启停,再也不用担心"必须在公司内网才能运维"的限制。

cpolar将内网穿透简单到只要三步! 1.下载安装 → 2. 输入要穿透的端口号 → 3. 立刻获得专属访问链接。

总结

Docker Comorse UI 把命令行的"黑魔法"变成了可视化操作,而 Cpolar 让这种便利突破局域网束缚。两者组合后,开发者可以像玩手机APP一样管理容器集群,从"命令恐惧症患者"变身"云原生高手"。

高手秘籍已经准备就绪,赶快去加buff吧!

本篇文章将dockercompose结合cpolar内网穿透软件实现公网访问docker compose web可视化界面,更直观的进行远程编写。

1. 安装Docker

本文演示环境:CentOS7,Xshell7远程ssh

没有安装Docker的小伙伴需安装Docker,已有Docker可跳过以下步骤。

如没有安装Docker,需先安装Docker:

  • 安装软件包(提供实用程序)并设置存储库

    ruby 复制代码
    $ sudo yum install -y yum-utils
    $ sudo yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo

    安装Docker引擎

    lua 复制代码
    sudo yum install docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin

    启动Docker

    sql 复制代码
    sudo systemctl start docker

    通过运行映像来验证 Docker 引擎安装是否成功

    arduino 复制代码
    sudo docker run hello-world

2. 检查本地docker环境

检查系统版本

bash 复制代码
cat /etc/os-release 

检查docker状态

lua 复制代码
systemctl status docker

下载Docker Compose UI镜像

bash 复制代码
docker pull francescou/docker-compose-ui:1.13.0

部署Docker Compose UI服务:

新建安装目录

bash 复制代码
 mkdir -p /data/compose-ui
 cd /data/compose-ui/

创建Docker Compose UI容器

arduino 复制代码
docker run -it -d --name docker-web -p 9000:9000 -v /var/run/docker.sock:/var/run/docker.sock docker.io/uifd/ui-for-docker

打开新的浏览器,输入本机IP:9000,进入到docker compose ui界面,启动了 DockerUI容器之后,就可以用它来执行启动、暂停、终止、删除以及DockerUI提供的其它操作Docker容器的命令。

可以更直观的查看docker容器

击Action,可以对已有的镜像镜像移除操作。点击Pull,可以拉取镜像。点击镜像ID进去后可以添加或移除镜像tag

我们就成功在本地搭建了docker compose ui可视化工具,但是如果有时候我们需要异地来远程访问docker容器来执行启动、暂停、终止、删除等,这个时候我们就需要使用cpolar内网穿透工具,实现在公网上无需公网ip就可以直接访问docker。

3. 安装cpolar内网穿透

下面是安装cpolar步骤:

cpolar官网地址: www.cpolar.com

  • 使用一键脚本安装命令
ruby 复制代码
curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash
  • 向系统添加服务
bash 复制代码
sudo systemctl enable cpolar
  • 启动cpolar服务
sql 复制代码
sudo systemctl start cpolar

cpolar安装成功后,在外部浏览器上访问Linux 的9200端口即:【http://服务器的局域网ip:9200】,使用cpolar账号登录,登录后即可看到cpolar web 配置界面,结下来在web 管理界面配置即可。

接下来配置一下docker compose ui的公网地址,

登录后,点击左侧仪表盘的隧道管理------创建隧道,创建一个公网http地址隧道

  • 隧道名称:可自定义命名,注意不要与已有的隧道名称重复

  • 协议:选择http

  • 本地地址:9000 (本地访问的地址)

  • 域名类型:免费选择随机域名

  • 地区:选择China Top

创建成功后,打开左侧在线隧道列表,查看刚刚创建隧道后生成两个公网地址,接下来就可以在其他电脑(异地)上,使用任意一个地址复制到浏览器访问即可。

可以看到,能够正常公网远程访问。

小结

为了方便演示,我们在上边的操作过程中使用了cpolar生成的http公网地址隧道,其公网地址是随机生成的。

这种随机地址的优势在于建立速度快,可以立即使用。然而,它的缺点是网址是随机生成,这个地址在24小时内会发生随机变化,更适合于临时使用。

如果有长期远程访问docker compose ui的需求,但又不想每天重新配置公网地址,还想地址好看又好记,那我推荐大家选择使用固定二级子域名地址的方式来远程访问。

4. 使用固定二级子域名地址远程访问

接下来保留一个固定http地址,登录cpolar官网,点击左侧的预留,找到保留二级子域名,为远程服务器连接保留一个固定二级子域名地址:

  • 地区:选择China VIP
  • 描述:即备注,可自定义,本例使用

点击保留

地址保留成功后,复制生成的公网地址,打开cpolar web ui管理界面,点击左侧仪表盘的隧道管理------隧道列表,找到我们刚才创建的随机公网地址隧道 compose ,点击编辑

修改隧道信息,将刚才保留成功的固定http地址:compose配置到隧道中

  • 域名类型:选择二级子域名
  • 预留的http地址:复制粘贴官网保留成功的地址,本例中为:compose
  • 地区选择:China VIP

点击更新

隧道更新成功后,点击左侧仪表盘的状态------在线隧道列表,可以看到公网地址已经更新为了两个固定二级子域名地址。

接下来与之前的操作一样,可以在其他电脑(异地)上,使用任意一个固定二级子域名地址复制到浏览器访问即可。

如上图所示,即为配置成功。我们现在就能在公网使用cpolar内网穿透工具生成的永久不变的固定二级子域名,使用任意浏览器远程访问docker compose ui了,无需购买域名服务器,也不用设置路由器那么麻烦,轻松实现大家远程访问本地服务的需求!

从命令行到可视化界面,Docker Compose UI用极简交互证明:技术工具的价值在于让人更专注于业务本身。

本篇文章知识点来源cpolar官网

  1. cpolar博客:配置二级子域名: www.cpolar.com/blog/config...
  2. cpolar博客:配置自定义域名: www.cpolar.com/blog/config...
  3. cpolar博客:配置固定TCP端口地址: www.cpolar.com/blog/config...
  4. cpolar博客:配置固定FTP地址: www.cpolar.com/blog/config...
相关推荐
枫叶是圆的几秒前
纯CSS+JS制作抽奖大转盘
前端·javascript·css·html·css3
四岁爱上了她4 分钟前
vue3使用插槽写一个自定义瀑布列表
前端·javascript·vue.js
Darling02zjh5 分钟前
_CSS3
前端·css·css3
har01d6 分钟前
【CSS3】录音中。。。
前端·css·vue.js·vue·vue3·css3
艾小码9 分钟前
现代 JavaScript 基础精要:ES6+ 核心特性完全解析
前端·javascript·ecmascript 6
Cache技术分享9 分钟前
158. Java Lambda 表达式 - 构造函数方法引用的使用与实践
前端·后端
遂心_11 分钟前
用 Tailwind CSS + React 打造精美商品卡片组件
前端·javascript·css
默默地离开12 分钟前
ES6 中 `Array.map()` 方法详解与 `parseInt` 的经典陷阱
前端·javascript
wycode15 分钟前
Vue2源码笔记(4)运行时-创建一个vue实例之initState数据劫持
前端·vue.js
言兴15 分钟前
面试题深度解析:let、const 与 var 的区别
前端·javascript·面试