Use Docker local installation to deploy Draw.io drawing tools and achieve remote access and collaborative work

Preface

When it comes to flow charts, you may think of Visio at the first time. It is undeniable that VIsio is indeed powerful, but the software is paid, and because of its powerful functions, the installation requires a lot of system memory, and it is not possible Cross-platform use. Therefore, today I recommend a more practical flowchart software to you - Draw.io online drawing tool.

In fact, in addition to writing code, drawing is also one of the essential skills for every programmer. We often come into contact with flow charts, architecture diagrams, etc. Moreover, Draw.io combined with the cpolarintranet penetration tool can also add sharing and collaboration functions to improve team work efficiency, so this article will teach you How to deploy the draw.io drawing tool in docker and achieve remote access over the public network.

Docker locally deploys the online drawing tool Draw.io and achieves remote access over the public network

1. Use Docker to deploy draw.io locally

Start docker and run the container

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

c229b0b6b6281842248cfdb9e3076ad

Start a web browser session to http://localhost:8080/?offline=1&https=0 or https://localhost:8443/?offline=1

d7d23e3ca246263580b4b812a9dfd01

You can see that draw.io is deployed locally in docker and enters the painting and drawing interface.

2. Install cpolar intranet penetration tool

Above we successfully installed draw.io in docker and successfully accessed it through the LAN. Next we installed the cpolar intranet penetration tool and forwarded the http public network address mapped to the local port through cpolar. We can easily achieve remote access without having to do it ourselves. Register a domain name and purchase a cloud server. The following are the steps to install cpolar

cpolar official website address: https://www.cpolar.com

  • Use one-click script installation command
curl -L https://www.cpolar.com/static/downloads/install-release-cpolar.sh | sudo bash
  • Add services to the system
sudo systemctl enable cpolar
  • Start cpolar service
sudo systemctl start cpolar

After cpolar is successfully installed, access Linux port 9200 on an external browser: [http://LAN ip:9200]. Log in using your cpolar account. After logging in, you can see the cpolar web configuration interface, which is connected to the web management interface. Just configure

image-20230831171159175

3. Configure Draw.io public network access address

Click Tunnel Management - Create Tunnel on the left dashboard to create a Draw.io cpolar public network address tunnel.

  • Tunnel name: The name can be customized. Be careful not to duplicate the existing tunnel name.
  • Protocol: Select http
  • Local address: 8080 (port for LAN access)
  • Domain name type: Choose a random domain name for free
  • Region: Select China

Click创建

56544a2956f6fd3f95376a73b85f62d

After the tunnel is successfully created, click the status on the left - online tunnel list to view the generated public network access address. There are two access methods, one is http and https

0aae43287fc845a4b660a0ca8f5fac5

4. Remote access to Draw.io via public network

Use the above cpolar https public network address to access it in the browser of any device, and you can successfully see our Draw.io drawing interface. In this way, a public network address that can be accessed remotely is created. There is no need to purchase a cloud server yourself, that is Can be published to the public network for access.

1efafda6150f3fcc24d3b3b66fcf7f3

482a34eb28c000551eaf2a07e2270a0

Since the tunnel created using cpolar above uses a random public network address, it will change randomly within 24 hours, which is not conducive to long-term remote access.

I usually use a fixed second-level subdomain name because I hope that when I send the URL to my colleagues, it will be a fixed and easy-to-remember public address (for example: draw.io.cpolar.cn), which makes it more formal and convenient. Drawing communication and collaboration. Therefore, we can configure a second-level subdomain name for it. This address is a fixed address and will not change randomly [ps: cpolar.cn has been filed]

Note that you need to upgrade the cpolar package to a basic package or above, and the bandwidth corresponding to each package is different. [cpolar.cn has been registered]

Log in to the cpolar official website, click Reserve on the left, select to reserve the second-level subdomain name, set a second-level subdomain name, click Reserve, and copy the reserved second-level subdomain name after the reservation is successful. Level subdomain name

image-20231113175903671

After the reservation is successful, copy the name of the second-level subdomain name that was successfully reserved.

image-20231113175932756

Return to the cpolar web UI management interface, click Tunnel Management - Tunnel List on the left dashboard, find the tunnel you want to configure, and click Edit on the right

image-20231113175958164

Modify the tunnel information and configure the successfully reserved second-level subdomain name into the tunnel.

  • Domain name type: Select a second-level subdomain name
  • Sub Domain: Fill in the successfully reserved second-level subdomain name

Click更新(Note, click once to update, no need to submit again)

image-20231113180044175

After the update is completed, open the online tunnel list. At this time, you can see that the public network address has changed and the address name has become a fixed second-level subdomain name.

image-20231113180111047

Finally, we use a fixed public network address to access, and we can see that the access is successful. In this way, a fixed and permanent public network address is set.

image-20231113180137575

image-20231113180214595

Guess you like

Origin blog.csdn.net/YYDsis/article/details/135006628