如何在Docker本地搭建流程图绘制神器draw.io并实现公网远程访问

推荐

前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家。点击跳转到网站

前言

提到流程图,大家第一时间可能会想到Visio,不可否认,VIsio确实是功能强大,但是软件为收费,并且因为其功能强大,导致安装需要很多的系统内存,并且是不可跨平台使用。所以,今天给大家推荐一款更实用的流程图软件—— Draw.io在线绘图工具。

其实,除了写代码,画图也是每个程序员必备的技能之一,我们经常接触有流程图、架构图等等。而且Draw.io结合cpolar内网穿透工具还可以增加共享和协作功能,提升团队工作效率,那么本篇文章就来教大家如何在docker部署drawio绘图工具并且实现公网远程访问。

Docker本地部署在线绘图工具Draw.io并实现公网远程访问

1. 使用Docker本地部署Drawio

启动docker,运行容器

docker run -it --rm --name="draw" -p 8080:8080 -p 8443:8443 jgraph/drawio

c229b0b6b6281842248cfdb9e3076ad

启动 Web 浏览器会话到http://localhost:8080/?offline=1&https=0或https://localhost:8443/?offline=1

d7d23e3ca246263580b4b812a9dfd01

可以看到在docker本地部署了draw.io,进入到了绘画作图界面。

2. 安装cpolar内网穿透工具

上面我们在docker中成功安装了draw.io,并局域网成功访问,下面我们安装cpolar内网穿透工具,通过cpolar 转发本地端口映射的http公网地址,我们可以很容易实现远程访问,而无需自己注册域名购买云服务器.下面是安装cpolar步骤

cpolar官网地址: https://www.cpolar.com

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

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

image-20230831171159175

3. 配置Draw.io公网访问地址

点击左侧仪表盘的隧道管理——创建隧道,创建一个Draw.io的cpolar 公网地址隧道

  • 隧道名称:可自定义命名,注意不要与已有的隧道名称重复
  • 协议:选择http
  • 本地地址:8080 (局域网访问的端口)
  • 域名类型:免费选择随机域名
  • 地区:选择China

点击创建

56544a2956f6fd3f95376a73b85f62d

隧道创建成功后,点击左侧的状态——在线隧道列表,查看所生成的公网访问地址,有两种访问方式,一种是http 和https

0aae43287fc845a4b660a0ca8f5fac5

4. 公网远程访问Draw.io

使用上面的cpolar https公网地址在任意设备的浏览器访问,即可成功看到我们Draw.io的绘图界面,这样一个公网地址且可以远程访问就创建好了,无需自己购买云服务器,即可发布到公网访问。

1efafda6150f3fcc24d3b3b66fcf7f3

482a34eb28c000551eaf2a07e2270a0

由于以上使用cpolar所创建的隧道使用的是随机公网地址,24小时内会随机变化,不利于长期远程访问。

我一般会使用固定二级子域名,原因是我希望将网址发送给同事时,它是一个固定、易记的公网地址(例如:drawio.cpolar.cn),这样更显正式,便于绘图交流协作。因此我们可以为其配置二级子域名,该地址为固定地址,不会随机变化【ps:cpolar.cn已备案】

注意需要将cpolar套餐升级至基础套餐或以上,且每个套餐对应的带宽不一样。【cpolar.cn已备案】

登录cpolar官网,点击左侧的预留,选择保留二级子域名,设置一个二级子域名名称,点击保留,保留成功后复制保留的二级子域名名称

image-20231113175903671

保留成功后复制保留成功的二级子域名的名称

image-20231113175932756

返回登录cpolar web UI管理界面,点击左侧仪表盘的隧道管理——隧道列表,找到所要配置的隧道,点击右侧的编辑

image-20231113175958164

修改隧道信息,将保留成功的二级子域名配置到隧道中

  • 域名类型:选择二级子域名
  • Sub Domain:填写保留成功的二级子域名

点击更新(注意,点击一次更新即可,不需要重复提交)

image-20231113180044175

更新完成后,打开在线隧道列表,此时可以看到公网地址已经发生变化,地址名称也变成了固定的二级子域名名称的域名

image-20231113180111047

最后,我们使用固定的公网地址访问,可以看到访问成功,这样一个固定且永久不变的公网地址就设置好了

image-20231113180137575

image-20231113180214595

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/340789.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

你了解计算机网络的发展历史吗?

1.什么是计算机网络 计算机网络是指将一群具有独立功能的计算机通过通信设备以及传输媒体被互联起来的,在通信软件的支持下,实现计算机间资源共享、信息交换或协同工作的系统。计算机网络是计算机技术与通信技术紧密结合的产物,两者的迅速发展…

linux手动安装 vscode-server

适用场景 很多时候,我们需要在本机(比如windows)通过remote ssh访问远程服务器(一般是ubuntu),但经常出现 vscode 一直连不上远程服务器的情况,看一下 log: 这个log表示远程服务器…

2023年低代码无代码产业大会:核心内容与学习收获(附大会核心PPT下载)

2023年低代码无代码产业大会聚焦了行业最前沿的趋势与技术,为企业数字化转型提供新的思路和方法。在这次大会上,我们可以深入了解到低代码/无代码技术的最新发展,以及如何利用这些技术来提高业务效率和创新能力。 一、大会的核心内容 1、低代…

在加载第三方库过程中,无法加载到库的问题(使用readelf, patchelf命令)

无法加载到库问题 问题及分析过程readelf 命令patchelf命令 问题及分析过程 在开发一个程序过程中,需要加载第三方库iTapTradeAPI, 在CMakeList.txt中已经设置了CMAKE_INSTALL_RPATH,但是发布到生产之后由于目录问题无法加载到libiTapTradeAPI库了 下面…

统计学-R语言-2.2

文章目录 前言导入.RData文件方式1方式2方式3 导入程序包总结 前言 本篇文章是将上篇得软件安装完,对其部分功能进行介绍。 导入.RData文件 在我们日常练习时会有.RData文件导入,并对其进行分析,下面是两种方导入.RData文件。 方式1 直接…

iOS rootless无根越狱解决方案

据游戏工委数据统计,2023年国内游戏市场实际销售收入与用户规模双双创下新高,游戏普遍采用多端并发方式,成为收入增长的主因之一。 中国市场实际销售收入及增长率丨数据来源:游戏工委 多端互通既是机遇,也是挑战。从游…

跟着仙凡兄学习编译Telegram vs2022 2024.1.11编译成功

编译Telegram 本人花了两天,问官方作者终于编译成功Telegram 运行环境:win11 vs2022 参见学习视频:【telegram编译成功,编译遇到的各种问题】https://www.bilibili.com/video/BV11c411x7jm?vd_sourcedf2e51268cc7412cc3937cf3df2…

2 快速前端开发

CSS快速入门 1.CSS案例1.1 内容回顾1.2 案例:二级菜单1.2.1 划分区域1.2.2 搭建骨架1.2.3 Logo区域1.2.4 菜单部分 1.3 案例:顶部菜单 二级菜单小结 1.4 案例:推荐区域1.4.1 划分区域1.4.2 搭建骨架1.4.3 案例的实现小结 2. CSS知识点2.1 ho…

SAP PP配置学习(五)

查找 四、 其它 设置 MM 过帐号码范围 定义凭证号码范围 OB52 打开期间 MMPV 开帐 (下篇见)

pytorch07:损失函数与优化器

目录 一、损失函数是什么二、常见的损失函数2.1 nn.CrossEntropyLoss交叉熵损失函数2.1.1 交叉熵的概念2.2.2 交叉熵代码实现2.2.3 加权重损失 2.2 nn.NLLLoss2.2.1 代码实现 2.3 nn.BCELoss2.3.1 代码实现 2.4 nn.BCEWithLogitsLoss2.4.1 代码实现 三、优化器Optimizer3.1 什么…

激活/注册navicat15

一、获取软件 链接:https://pan.baidu.com/s/1F_tiLuLvVFMEz8pDfIvDjw?pwdjjfj 提取码:jjfj 二、安装 安装的过程我就不放了,重点如下 安装完不要打开软件! 安装完不要打开软件! 安装完不要打开软件!…

谁说贵的就好?揭秘性价比最高的指纹识别模块!

消费者在购买产品时的一种常见误区,即认为价格高就一定意味着品质好。在指纹识别模块的市场上,这种观念同样存在。但实际上,性价比高并不代表产品价格低,而是指产品在性能、质量、服务等多方面都达到较高标准,且价格合…