如何部署一套自己的表单收集系统【教程-下】

上篇我们已经把环境折腾好了，接下来就是拉代码进行部署了

启动后端服务

下载代码

在 /home/software/ 目录下拉取代码

# 拉取代码
git clone https://gitee.com/TDuckApp/tduck-platform.git

导入数据

sql 文件在 doc 目录中

在这个目录下登录 mysql ，创建相应名称的数据库。

# 登录 mysql
mysql -uroot -p

# 创建 tduck 库
CREATE DATABASE tduck;

# 退出命令行
quit;

# 将sql文件导入数据库
mysql -u 用户名 -p 数据库名 < 数据库名.sql

# 导入tduck.sql文件
mysql -u root -p tduck < tduck.sql

修改配置

配置文件在 /tduck-api/src/main/resources/ 目录，其中application.yml 存放公共配置

active: dev 就是将读取 application-dev.yml 本地开发环境变量，所以接下来我们要修改 application-dev.yml

具体的修改请参考官方的「后端项目配置：（https://gitee.com/TDuckApp/tduck-platform/wikis/%E5%90%8E%E7%AB%AF%E9%A1%B9%E7%9B%AE%E9%85%8D%E7%BD%AE）」

这里坑有点多，所以对修改了的 mysql、redis 、微信公众号 和 邮件设置 做个简单说明

MySQL

一定不要用 root ，用我们新建的数据库账号 tduck

Redis

如果前面设置了密码，记得填上，其他的默认就可以

微信公众号

和官方一样，申请的微信测试公众号：https://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login

开始是用 frp 反向代理出去的

老苏的域名没有备案，所以是带端口的，结果提交后一直返回 配置失败

或者

{"errcode":-1,"errmsg":"system error"}

查了下官方的接入指南，似乎只能使用 80 或者 443 端口

所以老苏想到了 utools，在 跨平台的工具箱uTools（https://laosu.ml/2020/06/17/%E8%B7%A8%E5%B9%B3%E5%8F%B0%E7%9A%84%E5%B7%A5%E5%85%B7%E7%AE%B1uTools） 中老苏介绍过它的 内网穿透 插件，设置非常简单

这次 配置成功 了

成功后的显示

将对应的参数 appId 等值写入到配置文件

邮件设置

1. username 一定要写完整的邮箱；

2. 不要直接用邮箱密码，要用第三方邮件客户端的专用密码；

老苏测试了 88 邮箱和 QQ 邮箱，都是可以的正常工作的

启动后端服务

# 进入 tduck-platform 目录
cd /home/software/tduck-platform/

在当前目录 /home/software/tduck-platform/ 下执行下面的命令

# 清理项目建的临时文件，打包
mvn clean package -DskipTests

如果显示 BUILD SUCCESS 表示已经编译成功

最后执行

# 运行
java -Dfile.encoding=UTF-8 -jar tduck-api/target/tduck-api.jar

接下来就可以访问了

# 看是否有输出
curl localhost:8999/tduck-api

在浏览器中访问 http://虚拟机ip:8999/tduck-api

启动管理后台前端

下载代码

在 /home/software/ 目录下拉取代码

# 拉取代码
git clone https://gitee.com/TDuckApp/tduck-front.git

# 配置镜像加速
npm install -g cnpm --registry=https://registry.npm.taobao.org

启动项目

# 进入tduck-front 目录
cd tduck-front

# 安装依赖
cnpm install

# 启动项目
cnpm run serve

接下来就可以访问了

# 打印html文件
curl localhost:8888

当然最直观的还是在浏览器中访问 http://虚拟机ip:8888

部署

在 tduck-front 目录中运行

# 开始构建
cnpm run build

构建打包成功之后，会在根目录生成 dist 文件夹，里面就是构建打包好的文件，通常是 *.js 、*.css、index.html 等静态文件。

通常情况下 dist 文件夹的静态文件发布到你的 nginx 或者静态服务器即可，其中的 index.html 是项目的入口页面。

参考文档

tduck-platform: Tduck-填鸭收集器是一款开源的表单在线收集系统，后台基于SpringBoot+MybatisPlus+MySql+Redis，前端基于Vue ElementUI开发，功能强大，界面美观。keywords：问卷/表单/信息收集
地址：https://gitee.com/TDuckApp/tduck-platform

CentOS 7安装MySQL - SegmentFault 思否
地址：https://segmentfault.com/a/1190000022843273

SpringBoot多环境配置详解(application-dev.yml、application-test.yml、application-prod.yml)_Wingkin的博客-CSDN博客
地址：https://blog.csdn.net/Wing_kin666/article/details/111992800

各种折腾

聚沙成塔，集腋成裘

153篇原创内容

公众号