Docker 快速搭建 HTML 应用管理系统，轻松发布你的 HTML 小应用，支持版本管理与授权访问

一、简介

• 这个项目采用的是前后端分离的技术架构，后端采用PHP的thinkphp框架、前端采用React的Ant Design Pro框架；
• 该项目功能旨在可以帮助快速部署HTML应用
• 支持多用户管理、HTML项目管理、HTML应用固定访问链接与授权码访问等功能
• 支持Docker一键快速部署
• 该项目的代码地址参考：https://github.com/luler/hello_project
• 项目的主要功能和工作原理概览图：
  

二、安装

• 准备好Docker、docker-compose软件环境
• 拉取项目代码

  git clone https://github.com/luler/hello_project

• 进入项目目录，可以编辑项目下的docker-compose.yml文件，需要占用1314端口，如果已被占用可修改下面配置的端口映射，其他配置按需修改（可不修改，否则可能启动异常）

  version: "3"
  services:
    php_nginx:
      image: registry.cn-shenzhen.aliyuncs.com/luler/linux_php_nginx:php7.3
      restart: always
      privileged: true
      ports:
        - 1314:80   #如端口1314已被占用或者希望监听其他端口，可以修改
      volumes:  #下面是数据持久化的配置，可不修改
        - ./config/init.sh:/init.sh
        - ./runtime/nginx/wwwlogs:/home/wwwlogs
        - ./code/api:/home/wwwroot/api
        - ./code/web/dist:/home/wwwroot/web/dist
        - ./config/nginx/nginx.conf:/usr/local/nginx/conf/nginx.conf
        - ./config/nginx/vhost:/usr/local/nginx/conf/vhost
        - ./config/php/php-fpm.conf:/usr/local/php/etc/php-fpm.conf
        - ./config/php/php.ini:/usr/local/php/etc/php.ini

• 以上步骤完成，可运行下面命令快速启动

  //一键快速启动
  docker-compose up -d

  查看是否正常启动
  

三、使用

1. 安装完成后，可以访问地址：http://127.0.0.1:1314/ ,默认登录账号：admin，密码：admin

2. 新增一个HTML项目，可以自定义设定针对这个HTML项目的页面访问授权码

3. 打包HTML项目，并上传到系统中

• 这里示例使用AI生成一个HTML页面，如下
  

• 创建一个目录，如project，把AI生成的内容分别下载或者创建成相关文件，如html、js、css文件，注意一个HTML项目必须有一个index.html文件，其他资源文件相对路径引入使用。项目文件准备好，打包project目录为压缩文件project.zip。
  

• 上传HTML项目的zip压缩文件到项目中，获得相应的版本页面链接、固定页面链接
  

4. 访问HTML项目页面链接，如果设置了授权码输入授权码才能访问

• 未授权不能访问，需要输入授权码
  

• 验证成功，正常进入页面
  

四、总结

• 可以作为一些HTML单页应用的发布系统，比如原型页面、H5小应用、单页应用、AI生成的页面、JS页面小工具等等
• 支持授权码访问控制，保证了一定的安全性
• 部署和使用简单方便，可以快速应用起来

在线演示使用地址参考：https://cas.luler.top/?search=620f63c842ad8