使用drawio源码,搭建自己的绘图网站

本人是processon的付费会员,但最近一段时间使用这个网站的频率很低,再对比年费,就有点不划算了,于是想找一个替代方案。几近对比之后,觉的draw.io的使用体验也很棒,而且是开源的,缺点是不支持思维导图,是国外网站稳定性欠佳。思维导图可以采用百度脑图替代。为了解决稳定性的问题,我的阿里云上自行搭建了一套。以下是关键过程。

下载源码并编译

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# 安装ant及java的devel包
sudo yum install -y ant java-1.8.0-openjdk-devel
# clone代码到本地
git clone https://github.com/jgraph/drawio.git
# 编译
cd drawio/etc/build
ant #编译完成后会在drawio下产生一个war目录
# copy war 到 nginx 发布目录
sudo cp -r war /var/www
cd /var/www
sudo mv war drawio
# 增加nginx站点文件
cd /etc/nginx/conf.d
sudo vim draw.conf

配置nginx,开启SSL

draw.conf内容如下

1
2
3
4
5
6
7
8
9
10
11
server {
listen 80;
server_name draw.lefer.cn;
charset utf-8;
root /var/www/drawio;
index index.html index.htm;
location / {
root /var/www/drawio;
index index.html index.htm;
}
}

重启nginx

1
sudo systemctl restart nginx

在dns解析服务提供商上增加draw.lefer.cn解析记录。

申请CA证书。我一直使用的Let’s encrypt的免费CA证书,非常好用。怎么申请及应用可以参考我的另一篇文章

1
sudo ./certauto --nginx certonly

修改站点配置文件draw.conf

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
server {
listen 443;
server_name draw.lefer.cn;
ssl on;
ssl_certificate /etc/letsencrypt/live/lefer.cn-0001/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/lefer.cn-0001/privkey.pem;
ssl_session_cache shared:le_nginx_SSL:1m;
ssl_session_timeout 1440m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
ssl_ciphers "ECDHE-ECDSA-CHACHA20-POLY1305:ECDHE-RSA-CHACHA20-POLY1305:ECDHE-ECDSA-AES128-GCM-SHA256:ECDHE-RSA-AES128-GCM-SHA256:ECDHE-EC
DSA-
AES256-GCM-SHA384:ECDHE-RSA-AES256-GCM-SHA384:DHE-RSA-AES128-GCM-SHA256:DHE-RSA-AES256-GCM-SHA384:ECDHE-ECDSA-AES128-SHA256:ECDHE-RSA-AES128-
SHA256:ECDHE-ECDSA-AES128-SHA:ECDHE-RSA-AES256-SHA384:ECDHE-RSA-AES128-SHA:ECDHE-ECDSA-AES256-SHA384:ECDHE-ECDSA-AES256-SHA:ECDHE-RSA-AES256-
SHA:DHE-RSA-AES128-SHA256:DHE-RSA-AES128-SHA:DHE-RSA-AES256-SHA256:DHE-RSA-AES256-SHA:ECDHE-ECDSA-DES-CBC3-SHA:ECDHE-RSA-DES-CBC3-SHA:EDH-RSA
-DES-CBC3-SHA:AES128-GCM-SHA256:AES256-GCM-SHA384:AES128-SHA256:AES256-SHA256:AES128-SHA:AES256-SHA:DES-CBC3-SHA:!DSS";
charset utf-8;
root /var/www/drawio;
index index.html index.htm;
location / {
root /var/www/drawio;
index index.html index.htm;
}
}

再次重启nginx服务

1
sudo systemctl restart nginx

此时访问已能正常使用。

遗留问题

  • 存储位置只能指定到本地硬盘或者浏览器。如github、google drive等地方,在申请授权时绑定的是draw.io,而不是我自己搭建的draw站点,导致无法使用。

  • 分享为URL时,自动生成的URL,指向的是draw.io。可以直接将url中的draw.io修改为draw.lefer.cn。

以上两个问题,我将找时间修改源码来解决。

END