在线图表编辑工具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

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

怎么处理网站的一些安全风险

随时互联网的持续发展,数字化转型步伐不断加快,社会各行业都走进了信息化、数字化。但与此同时,网络发展带来了许多风险,各行业面临着日益复杂的数据安全和网络安全威胁。其中,网站的安全风险持续增长,是各…

R语言生物群落(生态)数据统计分析与绘图教程

详情点击链接:R语言生物群落(生态)数据统计分析与绘图教程 前沿 R 语言作的开源、自由、免费等特点使其广泛应用于生物群落数据统计分析。生物群落数据多样而复杂,涉及众多统计分析方法。 一:R和Rstudio及入门和作…

零基础学习数学建模——(一)什么是数学建模

本篇博客将详细介绍什么是数学建模。 文章目录 个人简介什么是数学建模(一)引例:高中数学里的简单线性规划问题数学建模的定义及用途数学建模的定义数学建模的用途 正确认识数学建模 个人简介 ​ 本人在本科阶段获得过国赛省一、mathorcup数…

【算法】基础算法001之双指针

👀樊梓慕:个人主页 🎥个人专栏:《C语言》《数据结构》《蓝桥杯试题》《LeetCode刷题笔记》《实训项目》《C》《Linux》《算法》 🌝每一个不曾起舞的日子,都是对生命的辜负 目录 前言 1.数组分块&#xf…

UTONMOS:探索元宇宙,开启未来游戏新篇章

在元宇宙的世界里,游戏不再只是消遣,而是一个全新的互动世界,等待你来探索! 逼真的虚拟现实技术,让你沉浸在充满想象力的游戏世界中,体验前所未有的刺激和乐趣。 与来自全球的玩家互动交流,结…

vue3+ts+vite中封装axios,使用方法从0到1

一、安装axios npm install axios types/axios --save二、配置代理vite.config.ts,如果没有需要新建该文件 module.exports {server: {proxy: {/api: {target: http://localhost:5000, // 设置代理目标changeOrigin: true, // 是否改变请求源地址rewrite: (path)…

【算法每日一练]-动态规划 (保姆级教程 篇16) #纸带 #围栏木桩 #四柱河内塔

目录 今日知识点: 计算最长子序列的方案个数,类似最短路径个数问题 四柱河内塔问题:dp[i]min{ (p[i-k]f[k])dp[i-k] } 纸带 围栏木桩 四柱河内塔 纸带 思路: 我们先设置dp[i]表示从i到n的方案数。 那么减法操作中&#xff…

Kafka消息存储

一、层次结构 具体到某个broker上则是, 数据目录/分区名/日志相关文件集合。其中日志文件集合内包括.log文件, index索引文件和.timeindex时间戳索引文件。 二、.log 结构 .log中记录具体的消息。一般消息由header和body组成, 这点儿在Kafka消息中也同样适用。 message MES…

视角与焦距

视角与焦距关系 视角与焦距之间存在密切的关系。在摄影和摄像领域,这两个概念都非常重要。 视角是指相机镜头所能覆盖的视野范围,通常以度数来表示。焦距则是从镜头到成像平面的距离,决定了拍摄的物体在成像平面上的大小。 焦距越短,视角就越大,拍到的画面就越宽广;焦距…

雪王IP +出海,是蜜雪冰城登陆港交所想讲的“新故事”?

霸屏互联网的“雪王”,如今身影出现在港交所。这一次,“雪王”除了出街的气派,也给市场打开了更多的想象空间。 据招股书数据,2023年前三个季度,蜜雪冰城营收同比增加近50%。如今看来,无论是品牌影响力&am…

【数据库学习】ClickHouse(ck)

1,ClickHouse(CK) 是一个用于联机分析(OLAP)的列式数据库管理系统(DBMS)。 1)特性 按列存储,列越多速度越慢; 按列存储,数据更容易压缩(类型相同、区分度)&#xff1b…

Flink/Doris生产环境方案选型的一些思考

各位总监,技术负责人,架构师们大家好。今天的文章有点短,是一些个人思考,仅做记录。 以Flink为主的计算组件和以Doris为代表的存储计算一体的方案选择问题是我们在技术选型过程中最常见的问题之一。也是很多公司和业务支持过程中会…

locust 快速入门--一次接口压测

背景: 使用locust,借助webUI,完成一次接口压测 实现步骤: 完成locust环境配置 准备一个locustfile(current_limiting_test.py) from locust import HttpUser, task, events from locust.env import Envi…

海外市场调研为什么要用独享静态代理IP?

独享静态IP在海外市场调研中扮演着至关重要的角色,提供了一系列无可比拟的优势。独享静态代理IP的稳定性和可靠性对于长期的市场调研至关重要,它保证了连接的持续性和数据的准确性。通过这些方面的综合优势,独享静态代理IP成为海外市场调研中…

Kali安装Xrdp结合内网穿透实现无公网ip远程访问系统桌面

文章目录 前言1. Kali 安装Xrdp2. 本地远程Kali桌面3. Kali 安装Cpolar 内网穿透4. 配置公网远程地址5. 公网远程Kali桌面连接6. 固定连接公网地址7. 固定地址连接测试 前言 Kali远程桌面的好处在于,它允许用户从远程位置访问Kali系统,而无需直接物理访…

数字化校园实验室综合管理平台|推动实验室创新发展新引擎

一、数字化建设目标 实验室数字化指的是运用新一代的人工智能、大数据、互联网技术、物联网技术、云计算技术、人体感应技术、语音技术、生物识别技术、手机APP等技术,实现各个业务间数据流和任务流的互通互联,将实验室管理过程中涉及的对象&#xff0c…

C语言——结构体类型(二)【结构体内存对齐,结构体数组】

📝前言: 上一讲结构体类型(一)中,我们讲述了有关结构体定义,创建,初始化和引用的内容,这一讲,我们进一步学习结构体的相关知识: 1,结构体内存对齐…

如何搭建开源知识库软件AFFiNE并实现公网环境远程协作【内网穿透】

目录 前言 1. 使用Docker安装AFFINE 2. 安装cpolar内网穿透工具 3. 配置AFFINE公网访问地址 4. 实现公网远程访问AFFINE 结语 作者简介: 懒大王敲代码,计算机专业应届生 今天给大家聊聊如何搭建开源知识库软件AFFiNE并实现公网环境远程协作【内网穿…

Python 代码轻松实现 HTML 文件及HTML字符串到 PDF 文档的转换

从网页生成文档已经是一种常见需求。无论是为了存档网页内容、离线共享网页或创建可打印的报告,经常会需要一种可靠的方法将HTML文件转换为稳定且普遍可访问的PDF格式。通过利用强大的Python语言,我们可以轻松地使用Python程序将HTML转换为PDF&#xff0…

2024在视频号开店怎么样?平台现状如下,有电商经验者优先!

我是王路飞。 现在开网店、做电商的平台有很多,但是有着绝对流量优势的,除了抖音之外就是视频号了。 但是抖音跟视频号相比,已经属于一个很成熟的平台了,商家们也开始进入到内卷阶段了。 所以,如果你们2024年想做电…