JeecgBoot – wqh博客

JeecgBoot（六）| 开发心得

wqh_work — Sun, 17 Jan 2021 01:54:46 +0000

JeecgBoot也用过一段时间了，总结一下这段时间的开发心得。

前端如何发送HTTP请求

自动生成的前端代码都是通过组件src/mixins/JeecgListMixin.js来发送http请求，里面列出了许多方法。

loadData     //查询数据
handleDelete //删除数据
handleEdit   //编辑数据
handleAdd    //新增数据
...

前端添加Components组件

Ant Design Vue提供了丰富的组件资源，如果需要在页面上放置组件，直接复制对应的组件代码即可，。

例如在页面上放一个按钮，打开https://www.antdv.com/components/button-cn/，找到Components—Button：

把复制的代码粘贴到对应的页面位置即可，例如放到src/views/exception/404.vue页面。

复制代码部分放到对应页面的标签下面：

刷新之后就可以看到按钮组件：

日志跟踪

框架中已经实现了日志跟踪功能，使用的接口在jeecg-boot-base/jeecg-boot-base-core/src/main/java/org/jeecg/modules/base/service/BaseCommonService.java，会把信息存入sys_log表中，并且可以通过前端查看：

邮件提醒

框架提供系统通知、邮件提醒、短信提醒和微信提醒4个功能，官方文档：http://doc.jeecg.com/2043949：

总结

目前项目开发中，JeecgBoot完全符合OA系统开发需要，可以自动生成前后端代码，方便项目组快速上手开发，尽管在使用过程中存在一些小问题，但相比起来优点更加突出。

现在开发的是OA系统，JeecgBoot的单体模式可以满足需求，如果后期需要扩展其他系统，可以把单体模式升级为微服务模式，让每个系统变成一个单独的服务。

JeecgBoot（六）| 开发心得最先出现在wqh博客。

JeecgBoot（五）| 微服务

wqh_work — Tue, 12 Jan 2021 01:35:30 +0000

微服务通过 Nacos 实现服务注册发现和统一配置中心，官方地址：http://doc.jeecg.com/2043906

安装

如果安装了docker：

docker  pull nacos/nacos-server
docker run -d -p 8848:8848 --env MODE=standalone  --name nacos  nacos/nacos-server

如果没有安装docker，可以去Github上下载：https://github.com/alibaba/nacos

这里下载的是nacos-server-1.4.0.tar.gz。

上传到服务器解压：

tar -zxvf nacos-server-1.4.0.tar.gz

然后切换到bin目录，执行命令：

 nohup bash -f ./startup.sh -m standalone

安装成功之后，通过http://localhost:8848/nacos访问，账号密码默认都是nacos。

nacos配置

新建jeecg.yaml，把jeecg-boot-starter/jeecg-boot-starter-cloud/nacos/jeecg.yaml文件中的内容复制进去，然后点击发布：

新建jeecg-dev.yaml，把jeecg-boot-starter/jeecg-boot-starter-cloud/nacos/jeecg-dev.yaml文件中的内容复制进去，这里的网关使用nocas配置方式，所以修改一下参数route—config–data-type为nocase，然后点击发布。

新建jeecg-gateway-router.json，把jeecg-boot-starter/jeecg-boot-starter-cloud/nacos/jeecg-gateway-router.json文件中的内容复制进去，然后点击发布。

pom配置

修改单体的jeecg-boot-module-system/pom.xml文件。

注释掉依赖：

修改skip为true：


    
    true

启动

启动之前需要先把rabbitmq安装好，因为各个服务之间是通过消息队列进行通信。

依次启动各个服务：

jeecg-cloud-module/jeecg-cloud-gateway/src/main/java/org/jeecg/JeecgGatewayApplication.java

jeecg-cloud-module/jeecg-cloud-system-start/src/main/java/org/jeecg/JeecgSystemApplication.java

jeecg-cloud-module/jeecg-cloud-demo/src/main/java/org/jeecg/JeecgCloudDemoApplication.java

可以在服务列表中看到对应的服务名就表示安装成功了：

JeecgBoot（五）| 微服务最先出现在wqh博客。

JeecgBoot（四）| Online表单开发

wqh_work — Thu, 07 Jan 2021 00:30:48 +0000

JeecgBoot提供了一系列低代码模块，Online表单开发就是其中之一。

前端导入表

在MySQL中创建测试数据：

CREATE TABLE `test` (
  `id` int NOT NULL AUTO_INCREMENT COMMENT '主键ID',
  `name` varchar(30)  DEFAULT NULL COMMENT '姓名',
  `sex` varchar(2)  DEFAULT NULL COMMENT '性别 {男:1,女:2}',
  `age` int DEFAULT NULL COMMENT '年龄',
  PRIMARY KEY (`id`) USING BTREE
) ;

INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('赵', '男', '16');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('钱', '女', '17');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('孙', '女', '15');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('李', '男', '18');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('周', '男', '19');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('吴', '女', '20');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('郑', '男', '17');
INSERT INTO `jeecg-boot`.`test` (`name`, `sex`, `age`) VALUES ('王', '女', '18');

创建好测试数据之后，在页面上点击：在线开发–Online表单开发–导入数据库表：

在弹出框中选中新增的表test，点击生成表单。

代码生成器

JeecgBoot通过代码生成器直接生成前台端代码，非常方便。

选中新生成的表单，在页面上点击代码生成

代码生成目录：默认的文件夹目录就是jeecg_config.properties中project_path配置的文件夹目录。

表名：数据库中的表名。

实体类名：java代码中的类名。

包名：java代码中的包名，会加上jeecg_config.properties中的bussi_package做为前缀。

生成成功之后，可以在目录/home/twyc/code/org/jeecg/modules/test下找到对应的代码：

├─controller
├─entity
├─mapper
├─service
├─vue
│ └─TestList.vue
│ ├─modules
│    └─TestForm.vue
│    └─TestModal__Style#Drawer.vue
│    └─TestModal.vue

前面4个文件夹就是后端代码，在目录jeecg-boot-module-system/src/main/java/org/jeecg/modules下创建test文件夹，把这4个放到test目录下面。

后面的vue就是前端代码，其中TestForm.vue和TestModal__Style#Drawer.vue分别表示Test页面是以弹出框形式还是侧边抽屉形式展现，二者任选其一即可。

在目录src/views下面创建test文件夹，把vue下的内容放到test目录下面。

然后重启前后端。

页面编辑

有了代码之后，需要新增一个页面，在页面中点击：系统管理–菜单管理–新增

把新增的页面放在异常页下面。

菜单路径：就是浏览器的访问相对路径。

前端组件：就是views到TestList.vue的路径，比如这里的TestList.vue路径是src/views/test/TestList.vue，写成test/TestList即可。

页面授权

有了页面之后，还需要授权，在页面中点击：系统管理–角色管理-对应角色-授权

现在的登录用户是admin，就给admin授权。

授权之后，刷新就可以在异常页面下看到测试页面。

问题

目前这里有2个问题。

第1个问题就是前端请求的时候，会默认发送createTime做为sql语句排序，所以修改一下前端代码src/mixins/JeecgListMixin.js：

/* 排序参数 */
isorter:{
   // column: 'createTime',
   // order: 'desc',
},

第2个问题就是在新增数据的时候，jeecg-boot-module-system/src/main/java/org/jeecg/modules/test/entity/Test.java代码主键ID类型是ASSIGN_ID，改成AUTO就可以了：

/**主键ID*/
@TableId(type = IdType.AUTO)
@ApiModelProperty(value = "主键ID")
private java.lang.Integer id;

JeecgBoot（四）| Online表单开发最先出现在wqh博客。

JeecgBoot（三）| 项目调试

wqh_work — Tue, 29 Dec 2020 00:42:59 +0000

项目启动之后，需要对项目进行调试，VSCode提供了各种插件，方便我们快速进行调试。

JDK11

调试Java代码的时候，插件需要使用jdk11，之前安装过jdk1.8，可以同时安装多个jdk版本，在项目中配置对应的jdk就可以了。

首先下载jdk11，官方的需要oracle账号密码:

https://www.oracle.com/java/technologies/javase-jdk11-downloads.html

我已经下载并上传到云盘：

链接: https://pan.baidu.com/s/1udb9uoWqRImb4bSgS81h6Q
提取码: 3fzr

上传到Linux服务器并安装

rpm -ivh jdk-11.0.9_linux-x64_bin.rpm

修改/etc/profile配置文件

export JAVA_HOME=/usr/java/jdk-11.0.9
export JRE_HOME=${JAVA_HOME}/jre
export CLASSPATH=.:${JAVA_HOME}/lib:${JRE_HOME}/lib
export PATH=${JAVA_HOME}/bin:$PATH

保存退出之后刷新：

source /etc/profile

修改后端代码根目录下的pom.xml，指定jdk版本：


	...
	1.8
	1.8

后端调试

用VSCode安装一系列的插件：

Debugger for Java
Language Support for Java(TM) by Red Hat
Lombok Annotations Support for VS Code
Maven for Java
Visual Studio IntelliCode

右键jeecg-boot-module-system/src/main/java/org/jeecg/JeecgSystemApplication.java，在选择框中可以看到Run和Debug选项。

Run表示Release，Debug就是调试，这里我们选中Debug。

启动成功之后，就可以进行后端的调试了。

前端调试

用VSCode安装一系列的插件：

Vetur
Debugger for Chrome

安装完成之后，配置launch.json：

"version": "0.2.0",
"configurations": [
	{
		"type": "chrome",
		"request": "launch",
		"name": "Launch Chrome against localhost",
		"url": "http://localhost:3000",
		"webRoot": "${workspaceFolder}"
	}
]

在VSCode终端使用命令启动：

npm run serve

启动完成之后，按F5启动就可以进行前端调试了。

在下一节中，我们将学习如何使用代码生成器自动生成前后端代码？

JeecgBoot（三）| 项目调试最先出现在wqh博客。

JeecgBoot（二）| 项目启动

wqh_work — Mon, 21 Dec 2020 11:14:45 +0000

依赖安装好之后，现在就可以来启动项目了。

我这里使用的IDE是VSCode，如果有不知道怎么用VSCode连接Linux的可以参考这篇文章：

VSCode通过RemoteSSH远程连接Linux服务器

后端配置

打开jeecg-boot-module-system/src/main/resources/application-dev.yml。

修改Mysql对应的配置：

url: jdbc:mysql://127.0.0.1:3306/jeecg-boot?characterEncoding=UTF-8&useUnicode=true&useSSL=false&tinyInt1isBit=false&allowPublicKeyRetrieval=true&serverTimezone=Asia/Shanghai
username: root
password: 你的密码
driver-class-name: com.mysql.cj.jdbc.Driver

修改Redis对应的配置：

database: 0
host: 127.0.0.1
lettuce:
  pool:
    max-active: 8   #最大连接数据库连接数,设 0 为没有限制
     max-idle: 8    #最大等待连接中的数量,设 0 为没有限制
    max-wait: -1ms   #最大建立连接等待时间。如果超过此时间将接到异常。设为-1表示无限制。
    min-idle: 0     #最小等待连接中的数量,设 0 为没有限制
  shutdown-timeout: 100ms
password: '你的密码'
port: 6379

打开jeecg-boot-module-system/src/main/resources/jeecg/jeecg_database.properties，修改mysql配置，这里的mysql是代码生成器的：

diver_name=com.mysql.cj.jdbc.Driver
url=jdbc:mysql://localhost:3306/jeecg-boot?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai
username=root
password=你的密码
database_name=jeecg-boot

打开jeecg-boot-module-system/src/main/resources/jeecg/jeecg_config.properties，修改生成路径等配置：

project_path=你的文件夹目录
bussi_package=org.jeecg.modules
source_root_package=

后端启动

配置完成之后，在VSCode终端执行打包：

mvn package

打包时间可能较长，看到下面内容表示打包成功：

[INFO] Reactor Summary:
[INFO]
[INFO] jeecg-boot-parent 2.4.0 ………………………. SUCCESS [ 0.014 s]
[INFO] jeecg-boot-base ……………………………… SUCCESS [ 0.003 s]
[INFO] jeecg-boot-base-tools ………………………… SUCCESS [ 1.579 s]
[INFO] jeecg-boot-base-core …………………………. SUCCESS [ 7.147 s]
[INFO] jeecg-boot-base-api ………………………….. SUCCESS [ 0.002 s]
[INFO] jeecg-system-local-api ……………………….. SUCCESS [ 0.198 s]
[INFO] jeecg-system-cloud-api ……………………….. SUCCESS [ 0.190 s]
[INFO] jeecg-boot-module-demo ……………………….. SUCCESS [ 6.392 s]
[INFO] jeecg-boot-module-system ……………………… SUCCESS [ 4.927 s]
[INFO] jeecg-boot-starter …………………………… SUCCESS [ 0.003 s]
[INFO] jeecg-boot-starter-cloud ……………………… SUCCESS [ 0.356 s]
[INFO] jeecg-boot-starter-job ……………………….. SUCCESS [ 0.209 s]
[INFO] jeecg-boot-starter-lock ………………………. SUCCESS [ 0.237 s]
[INFO] jeecg-boot-starter-rabbitmq …………………… SUCCESS [ 0.194 s]
[INFO] jeecg-boot-starter-redis ……………………… SUCCESS [ 0.160 s]
[INFO] jeecg-cloud-module …………………………… SUCCESS [ 0.002 s]
[INFO] jeecg-cloud-system-start ……………………… SUCCESS [ 2.487 s]
[INFO] jeecg-cloud-gateway ………………………….. SUCCESS [ 0.577 s]
[INFO] jeecg-cloud-monitor ………………………….. SUCCESS [ 0.573 s]
[INFO] jeecg-cloud-xxljob …………………………… SUCCESS [ 2.564 s]
[INFO] jeecg-cloud-demo 2.4.0 ……………………….. SUCCESS [ 0.929 s]
[INFO] ------------------------------------------------------------------------
[INFO] BUILD SUCCESS
[INFO] ------------------------------------------------------------------------

使用java命令启动：

java -jar jeecg-boot-module-system/target/jeecg-boot-module-system-2.4.0.jar

看到下面内容就表示启动成功了：

Application Jeecg-Boot is running! Access URLs: Local: http://localhost:8080/jeecg-boot/ External: http://172.17.0.2:8080/jeecg-boot/
Swagger文档: http://172.17.0.2:8080/jeecg-boot/doc.html

启动完成之后，通过http://localhost:8080/jeecg-boot/访问。

前端配置

打开public/index.html，修改配置：

window._CONFIG = {
    domianURL:'http://localhost:8080/jeecg-boot'
};

在VSCode终端执行yarn，时间可能较长：

yarn install

前端启动

使用npm命令启动：

npm run serve

看到下面内容表示启动成功：

App running at:
Local: http://localhost:3000/
It seems you are running Vue CLI inside a container.
Access the dev server via http://localhost:/
Note that the development build is not optimized.
To create a production build, run yarn build.

动完成之后，通过http://localhost:3000/访问。

账号admin，密码123456。

在下一节中，我们将学习如何用VSCode调试前后端。

JeecgBoot（二）| 项目启动最先出现在wqh博客。

JeecgBoot（一）| Linux开发环境安装

wqh_work — Wed, 16 Dec 2020 08:40:40 +0000

JeecgBoot 是一款基于代码生成器的低代码开发平台！前后端分离架构 SpringBoot2.x，SpringCloud，Ant Design&Vue，Mybatis-plus，Shiro，JWT，支持微服务。

官方Github：https://github.com/zhangdaiscott/jeecg-boot

本文为JeecgBoot的全Linux开发环境，使用的是Centos8，想安装Windows开发环境的请查看：http://doc.jeecg.com/2043873

下载解压

这里使用的是2.4.0版本，下载：

wget https://codeload.github.com/zhangdaiscott/jeecg-boot/tar.gz/2.4.0

下载完成后解压：

tar -zxvf jeecg-boot-2.4.0.tar.gz

进入目录jeecg-boot-2.4.0，可以看到2个文件夹。

jeecg-boot：后端框架代码。

ant-design-vue-jeecg：前端框架代码。

后端环境

安装后端框架需要的依赖：

yum -y install java-1.8.0-openjdk maven mysql mysql-server redis

1. mysql

安装完成之后，不要立即启动mysql，这里需要先配置lower_case_table_names选项，因为在Linux是区分大小写的，这里必须先配置选项再启动mysql，否则sql语句会报错。

修改mysql配置文件，打开/etc/my.cnf.d/mysql-server.cnf，在[mysqld]下面加入：

lower_case_table_names=1

保存退出之后，启动msyql：

systemctl start mysqld
systemctl enable mysqld

Centos8默认安装的是mysql8.0.21，root默认密码为空。

登录之后，修改root密码：

alter user 'root'@'localhost' identified by '新密码';

修改好密码之后，使用source导入sql文件，文件在jeecg-boot/db/jeecgboot-mysql-5.7.sql。

2. jdk

配置JDK环境，编辑文件/etc/profile，在最下面加入：

export JAVA_HOME=/usr/lib/jvm/java-1.8.0-openjdk-1.8.0.272.b10-3.el8_3.x86_64
export JRE_HOME=${JAVA_HOME}/jre
export CLASSPATH=.:${JAVA_HOME}/lib:${JRE_HOME}/lib
export PATH=${JAVA_HOME}/bin:$PATH

保存退出之后，刷新profile：

source /etc/profile

3. reids

编辑文件/etc/redis.conf，修改requirepass：

requirepass 你的密码

保存退出之后，启动redis：

systemctl start redis
systemctl enable redis

前端环境

安装前端框架需要的依赖，yarn需要配置repo：

curl --silent --location https://dl.yarnpkg.com/rpm/yarn.repo | tee /etc/yum.repos.d/yarn.repo

完成之后再执行：

yum -y install nodejs yarn

配置国内镜像：

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

前端环境安装还是比较简单的。

在下一节中，我们将学习如何启动JeecgBoot？

JeecgBoot（一）| Linux开发环境安装最先出现在wqh博客。