Docker一键搭建实用开源项目

yoyo 6/5/2021 HaloDirectoryListercreate-chartExcalidrawStirling-PDF木及简历

# 1. 服务器管理类

# 1.1 搭建Nginx管理面板

# 1.1.1 Nginx Proxy Manager 简介

Nginx Proxy Manager门槛极低，操作简单，不需要你掌握很复杂的Nginx配置知识，只需要几步就能很轻松完成反向代理的设置和SSL证书的部署。便捷直观的web页面管理和操作无疑大大简化了一般Nginx反代服务的步骤。

项目地址：https://github.com/jc21/nginx-proxy-manager (opens new window)

# 1.1.2 Nginx Proxy Manager 部署

Step1：安装 Docker 和 Docker-Compose

Step2：编写配置文件

docker-compose.yml

version: '3'
services:
  app:
    image: 'jc21/nginx-proxy-manager:latest'
    container_name: nginx-proxy-manager
    restart: always
    ports:
      - '80:80'
      - '81:81'
      - '443:443'
    volumes:
      - ./data:/data
      - ./letsencrypt:/etc/letsencrypt

1
2
3
4
5
6
7
8
9
10
11
12
13

Step3：创建并运行容器

$ docker-compose up -d

Step4：浏览器访问面板

使用 Chrome 浏览器访问 http://IP:81地址，默认账号如下，登录后建议立刻进行修改，之后便可以看到如下面板。

Email:    [email protected]
Password: changeme

1
2

Nginx-Proxy-Manager面板

# 1.2 搭建dockur/windows虚拟机

# 1.2.1 dockur/windows简介

dockur/windows是一个使用Docker一键搭建Windows服务器环境的工具。

项目地址：https://github.com/dockur/windows (opens new window) （如果需要安装 ARM64 版本的 Windows 请使用 dockur/windows-arm (opens new window)）
适用场景：测试一些桌面软件的兼容性，但不方便在本机安装虚拟机的情形，比如 ARM 架构的 Mac 安装不了 Win11 之前版本的虚拟机。

支持以下操作系统：

Value	Description	Source	Transfer	Size
`win11`	Windows 11 Pro	Microsoft	Fast	6.4 GB
`win10`	Windows 10 Pro	Microsoft	Fast	5.8 GB
`ltsc10`	Windows 10 LTSC	Microsoft	Fast	4.6 GB
`win81`	Windows 8.1 Pro	Microsoft	Fast	4.2 GB
`win7`	Windows 7 SP1	Bob Pony	Medium	3.0 GB
`vista`	Windows Vista SP2	Bob Pony	Medium	3.6 GB
`winxp`	Windows XP SP3	Bob Pony	Medium	0.6 GB

`2022`	Windows Server 2022	Microsoft	Fast	4.7 GB
`2019`	Windows Server 2019	Microsoft	Fast	5.3 GB
`2016`	Windows Server 2016	Microsoft	Fast	6.5 GB
`2012`	Windows Server 2012 R2	Microsoft	Fast	4.3 GB
`2008`	Windows Server 2008 R2	Microsoft	Fast	3.0 GB

`core11`	Tiny 11 Core	Archive.org	Slow	2.1 GB
`tiny11`	Tiny 11	Archive.org	Slow	3.8 GB
`tiny10`	Tiny 10	Archive.org	Slow	3.6 GB

# 1.2.2 使用dockur/windows搭建虚拟机

前提条件：需要服务器上有Docker 和 Docker Compose 环境。

Step1：准备 compose.yaml 文件

version: "3"
services:
  windows:
    image: dockurr/windows
    container_name: windows
    devices:
      - /dev/kvm
    cap_add:
      - NET_ADMIN
    ports:
      - 8006:8006
      - 3389:3389/tcp
      - 3389:3389/udp
    volumes:
      - /root/windows/storage:/storage
    environment:
      VERSION: "win7"
      RAM_SIZE: "8G"
      CPU_CORES: "4"
      DISK_SIZE: "256G"
    stop_grace_period: 2m
    restart: on-failure

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

Step2：准备Win系统的镜像文件

新建一个目录 /root/windows/storage，在这里放入镜像文件custom.iso（需要重命名为这个），例如：

Win7镜像：https://dl.bobpony.com/windows/7/en_windows_7_enterprise_with_sp1_x64_dvd_u_677651.iso (opens new window)

注：其实 dockur/windows 会自动下载镜像，但内置的这个下载源在国内无法直连，要么设置代理，要么把镜像手动放置进去。

Step3：使用镜像构建容器

 $ docker-compose up -d

执行如下命令构建容器，之后使用Chrome访问 http://ip:8006 地址，即可看到安装过程，等安装过程走完即可使用系统。

Step4：本机与Win系统共享文件

打开文件资源管理器并单击网络部分，将看到一台名为的计算机 host.lan（提示权限问题，设置允许即可），双击它，它将显示一个名为 Data 的文件夹。

在此文件夹中，可以访问主机上放置在 /storage/shared 目录的任何文件。

# 2. 在线工具类

# 2.1 搭建Stirling-PDF文件处理工具

# 2.1.1 Stirling-PDF简介

项目简介：允许对 PDF 文件做各种操作的 Web 应用。这是一款功能强大、开箱即用的 PDF 工具，支持拆分/合并文件、添加/提取图片、压缩、加水印、添加/删除密码等功能，满足你对 PDF 文件的所有需求。

项目地址：https://github.com/Frooodle/Stirling-PDF (opens new window)

# 2.1.2 Stirling-PDF部署

$ docker run -d \
  -p 8080:8080 \
  --name stirling-pdf \
  frooodle/s-pdf:latest
$ docker update stirling-pdf --restart=always

1
2
3
4
5

用Chrome浏览器打开http://IP:8080即可访问Stirling-PDF。

Stirling-PDF

# 2.2 搭建Excalidraw在线共享白板

# 2.2.1 Excalidraw简介

项目简介：用于绘制手绘图的虚拟白板，可以点对点加密分享，可以导出。

项目地址：https://github.com/excalidraw/excalidraw (opens new window) （同类项目：https://github.com/tldraw/tldraw (opens new window)）

# 2.2.2 Excalidraw部署

$ docker run -itd --name excalidraw -p 8080:80 excalidraw/excalidraw:latest
$ docker update excalidraw --restart=always

1
2

用Chrome浏览器打开http://IP:8080即可访问Excalidraw。

Excalidraw

# 2.3 搭建DirectoryLister资源下载站

# 2.3.1 DirectoryLister简介

DirectoryLister 是一种简便的文件目录浏览与共享工具，可将任何通过网络可访问的文件夹内容以网页形式公开展示，方便用户浏览和下载资源。说白了就是一个资源下载站。

项目地址：https://github.com/DirectoryLister/DirectoryLister (opens new window)
历史版本及变更日志：https://github.com/DirectoryLister/DirectoryLister/releases (opens new window)

# 2.3.2 DirectoryLister部署

我曾部署过 DirectoryLister 的 2.7.1、3.7.9 和 5.0.6 版本，并对 2.7.1 和 3.7.9 的源码进行过修改。2.7.1 版本功能简洁，仅保留了核心特性。3.7.9 版本在样式和功能上有了较大改版，但存在文件缓存的 bug，长时间运行且不清理缓存时，可能导致服务器磁盘被占满。部署 5.0.6 版本的时候，我已经懒得再次修改源码，选择直接拉取 Docker 镜像的方式来部署。

[1] 部署3.7.9版本

Step1：下载DirectoryLister3.7.9版本的压缩包：Download Directory Lister 3.7.9 (opens new window)

样式修改：修改/app/views/components内的twig文件即可。注意这个修改后不会立刻生效，需要先将/app/cache内的缓存文件删除，再重新请求即可看到修改结果了。

Step2：修改配置文件准备部署包

mount
├── LICENSE
├── README.md
├── app
│   ├── assets
│   ├── cache
│   ├── config
│   ├── src
│   ├── translations
│   ├── vendor
│   └── views
├── directory-lister.svg
├── .hidden
├── env
└── index.php

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

将.env.example文件重命名为.env，然后修改里面的配置，配置说明详见：https://docs.directorylister.com/configuration/configuration-overview (opens new window)，以下是我所使用的配置，仅供参考。

# Here you can control Directory Lister configuration through environment
# varaibles. See the configuration documentation for additional information:
# https://docs.directorylister.com/configuration

APP_DEBUG=false
APP_LANGUAGE=zh-CN

# 是否解析和渲染README文件
DISPLAY_READMES=false

# 在文件列表之前显示README文件
READMES_FIRST=false

# 是否允许将目录下载为Zip
ZIP_DOWNLOADS=false

# 您的Google分析跟踪ID
GOOGLE_ANALYTICS_ID=false

# 您的Matomo分析URL
MATOMO_ANALYTICS_URL=false

# 您的Matomo分析站点ID
MATOMO_ANALYTICS_ID=false

# 文件和文件夹的排序顺序
SORT_ORDER=type

# 反转文件的顺序（应用排序后）
REVERSE_SORT=false

# 隐藏版本控制系统（即Git和Mercurial）用于存储其元数据的文件
HIDE_VCS_FILES=true

# 目录列表的标题
SITE_TITLE="ToolBox"

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
29
30
31
32
33
34
35
36

修改缓存配置文件 ./app/config/cache.php，将cache_driver改为array，关闭缓存，防止因缓存文件导致服务器磁盘占满。

    /**
     * The application cache driver. Setting this value to 'array' will disable
     * the cache across requests. Additional driver-specific options may require
     * configuration below.
     *
     * Possible values: apcu, array, file, memcached, redis, php-file
     *
     * Default value: 'file'
     */
    'cache_driver' => DI\env('CACHE_DRIVER', 'array'),

1
2
3
4
5
6
7
8
9
10

新建隐藏文件.hidden

directory-lister.svg
env
LICENSE
README.md

1
2
3
4

Step3：编写Dockerfile及脚本进行部署

Dockerfile

FROM docker.io/php:7.4-apache

# ADD mount /var/www/html

RUN apt update && apt install -y libzip-dev \
  && rm -rf /var/lib/apt/lists/* \
  && pecl install zip \
  && docker-php-ext-enable zip \
  && chown -R 777 /var/www/html

1
2
3
4
5
6
7
8
9

build.sh

$ docker build -t 'directorylister_image' .
$ docker run -itd --name directorylister -p 8080:80 -e DISPLAY_READMES=false -v /docker/directorylister/mount:/var/www/html directorylister_image
$ docker update directorylister --restart=always

1
2
3

将部署包（mount）、Dockerfile、build.sh上传到服务器，执行脚本进行部署。

部署成功后，访问路径为：https://域名 （目录名即为资源的访问路径），将欲展示的文件目录上传到服务器的该服务根目录下即可。

DirectoryLister3.7.9

[2] 部署5.0.6 版本

$ docker run -d --name directorylister \
    -e APP_DEBUG=false \
    -e APP_LANGUAGE=zh-CN \
    -e DISPLAY_READMES=false \
    -e READMES_FIRST=false \
    -e ZIP_DOWNLOADS=false \
    -e SORT_ORDER=type \
    -e REVERSE_SORT=false \
    -e HIDE_VCS_FILES=true \
    -e SITE_TITLE="ToolBox" \
    -e FILES_PATH=/data \
    -e COMPILE_CONTAINER=false \
    -v /docker/directorylister/data:/data \
    -p 7239:80 \
    directorylister/directorylister:5

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

-e的参数含义详见：https://docs.directorylister.com/configuration/configuration-reference (opens new window)

# 3. 低代码工具类

# 3.1 搭建create-chart大屏编辑器

# 3.1.1 create-chart简介

基于Echarts的可视化数据大屏设计器（包含设计、预览、分享等全部流程）

项目地址：https://github.com/food-billboard/create-chart (opens new window)
演示地址：https://food-billboard.github.io/create-chart/index.html#/designer (opens new window)

create-chart大屏可视化编辑器

# 3.1.2 其他类似开源项目

[1] light-chaser

light chaser 是一款免费的数据可视化开源设计工具，基于React技术栈实现。通过它，您可以简单快速地制作数据可视化相关内容。它可用于大屏数据可视化、数据报表、数据展示分析等场景。

项目地址：https://github.com/xiaopujun/light-chaser (opens new window)
演示地址：https://xiaopujun.github.io/light-chaser-app/#/ (opens new window)

light-chaser大屏可视化编辑器

[2] AJ-Report

AJ-Report是一个完全开源，拖拽编辑的可视化设计工具。三步快速完成大屏：配置数据源---->写SQL配置数据集---->拖拽生成大屏。让管理层随时随地掌控业务动态，让每个决策都有数据支撑。

项目地址：https://github.com/anji-plus/report (opens new window)
演示地址：https://ajreport.beliefteam.cn/index.html (opens new window) 体验账号及密码：guest / guest

AJ-Report大屏可视化编辑器

# 3.1.3 create-chart部署

这里只本机调试、打包部署create-chart的纯前端版本。将项目启动起来后，可以通过简单的代码修改将上方滚动的文字和右上方的开源仓库跳转标志去除。

$ yarn   // 安装依赖
$ yarn start:static  // 纯前端版本-调试

1
2

打包的时候要，注意 create-chart/config/config.ts 文件publicPath处的路由改成 / 而不要是原来的 /create-chart/，不然打出来的包会获取不到资源。

$ yarn build:static  // 纯前端版本-打包

准备Dockerfile

# 设置基础镜像
FROM nginx
# 将dist文件中的内容复制到 /usr/share/nginx/html/这个目录下面
COPY dist/  /usr/share/nginx/html/

1
2
3
4

服务器部署：

$ docker build -t create-chart-image .
$ docker run -d -p 8080:80 --name create-chart create-chart-image:latest
$ docker update create-chart --restart=always

1
2
3

# 3.2 搭建木及简历

# 3.2.1 项目简介

基于React开发的一款用Markdown写出简洁好看简历的在线工具。官方体验 (opens new window)

项目地址：https://github.com/hua1995116/react-resume-site (opens new window)

# 3.2.2 服务部署

可以使用如下的docker方式部署，也可以按照常规react项目的方式进行部署。

$ docker run --itd -p 3000:80 yanzhiwei147/muji

# 3.2.3 效果展示

选择一个模板，左侧编辑Markdown，右侧所见即所得，支持导出pdf与md。

木及简历

# 3.3 搭建Halo动态博客

# 3.3.1 Halo基本介绍

Halo是一款现代化的开源博客/CMS系统，功能与Wordpress类似，但它是Java实现的，界面看起来更现代化，算是Wordpress的上位替代。

项目地址：https://github.com/halo-dev/halo (opens new window)
官网文档：https://docs.halo.run/ (opens new window)
主题商店：https://halo.run/themes.html (opens new window)

在线体验：官方提供一个在线体验站，此站点每 2 小时重置一次数据。

前端地址：https://demo.halo.run 后台地址：https://demo.halo.run/admin  用户名：demo  密码：P@ssw0rd123..

Halo主题仓库

# 3.3.2 Halo搭建过程

以下提供两种方式进行部署，使用H2 database的是默认的最简便方案，但我更喜欢使用mysql和redis进行部署的方案。

部署完之后，可借助 OneinStack 使用Nginx开启HTTPS并配置反向代理，这里不详细介绍了，可参考：Halo官方文档 (opens new window)

[1] 使用H2 database进行部署

安装docker环境，直接使用docker进行部署。

$ docker run -itd --name halo -p 8090:8090 -v ~/.halo:/root/.halo --restart=always halohub/halo:1.5.4

[2] 使用mysql和redis进行部署

安装docker与docker compose环境，提前创建好mysql和redis服务，然后创建mysql数据库。

create database halodb character set utf8mb4 collate utf8mb4_bin;

新建 docker-compose.yaml 文件，内容如下（把mysql和redis的连接信息换成自己的）：

version: "3"

services:
  halo_server:
    image: halohub/halo:1.5.4
    container_name: halo_server
    restart: on-failure:3
    networks:
      network:
    volumes:
      - ./:/root/.halo
      - /etc/timezone:/etc/timezone:ro
      - /etc/localtime:/etc/localtime:ro
    ports:
      - "8090:8090"
    environment:
      - SERVER_PORT=8090
      - SPRING_DATASOURCE_DRIVER_CLASS_NAME=com.mysql.cj.jdbc.Driver
      - SPRING_DATASOURCE_URL=jdbc:mysql://127.0.0.1:3306/halodb?characterEncoding=utf8&useSSL=false&serverTimezone=Asia/Shanghai&allowPublicKeyRetrieval=true
      - SPRING_DATASOURCE_USERNAME=root
      - SPRING_DATASOURCE_PASSWORD=your_mysql_password
      - HALO_ADMIN_PATH=admin
      - HALO_CACHE=redis
      - SPRING_REDIS_PORT=6379
      - SPRING_REDIS_DATABASE=0
      - SPRING_REDIS_HOST=127.0.0.1
      - SPRING_REDIS_PASSWORD=your_redis_password
      
networks:
  network:

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
29
30

然后依次执行如下命令即可：

$ docker network create halo_network
$ docker network connect halo_network mysql
$ docker network connect halo_network redis
$ docker-compose up -d

1
2
3
4

# 3.3.3 Halo搭建效果

前端地址：https://域名，后端地址：https://域名/admin/index.html

Halo初始化界面

# 4. 参考资料

[1] 使用 Docker Compose 部署 Halo from Halo官方文档 (opens new window)

[2] DirectoryLister配置说明 from DirectoryLister官网

[3] DirectoryLister配置更改不生效问题 from DirectoryLister官网 (opens new window)

[4] Docker for DirectoryLister from Github (opens new window)

[5] DirectoryLister 缓存大小 from Github issues (opens new window)

Quantum Bit