首页 > 数据库 >Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap

时间:2023-11-01 13:02:40浏览次数:42  
标签:Java java Bootstrap 点击 mysql 后台 服务器 最新版 我们


由于之前的Java后台微信点餐小程序有些知识点过时了,所以今天重新出一版,把里面过时的知识点更新下

第一章,技术选型(重要)

在开始学习之前,要记得安装jdk8和mysql8,后面的笔记里也会具体讲解怎么安装,但是jdk8和mysql8必须和石头哥保持一致。

1,后台技术选型:

  • JDK8 (必须保持一致)
  • Mysql8 (必须保持一致)
  • Spring-boot
  • Spring-data-jpa
  • Lombok
  • Freemarker
  • Bootstrap
  • Websocket即时通讯
  • Tomcat服务器
  • Excel数据的批量导入与导出

2,小程序端技术选型

  • 原生微信小程序
  • css3
  • JavaScript

第二章,效果图

1, 管理后台

后台登录

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序


登录成功后的后台如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_02

饭店管理员

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_03

菜品类目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_04

excel批量导入

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_05

菜品管理

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_06

菜品批量导入与导出

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_07


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_08

订单管理

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_09

饭店收入统计和菜品库存预警

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_10

用户和会员管理

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_11


可以在后台送客户金额,用于模拟支付

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_12

客户评价

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_13

2,小程序端

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_14


如上图,目前实现了如下功能。

小程序首页

1,扫码点餐
2,菜品浏览
3,餐厅电话
4,在线客服
5,排号等位
6,顶部轮播图
7,搜索功能
8,购物车页面
9,会员功能

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_15

菜品分类显示

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_16

购物车编辑页

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_17

购物车页面

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_18

订单确认页(可以选择就餐人数)

这里新加了会员8折优惠的功能

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_19

支付系统(模拟支付,可接入微信支付)

学习版只提供模拟支付,这里的模拟是否使用用户的积分来支付。支付之前可以实时显示用户当前余额。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_20

订单列表页(多种订单状态)

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_21

评论系统(评价列表)

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_22

个人中心页

1,可以注册用户
2,可以注册会员
3,可以查看我的订单
4,可以查看我的评价
5,可以查看我的排号
6,可以拨打饭店电话

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_23

用户注册

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_24

会员充值

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_25

排号等位系统

可以排大桌和小桌

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_26


过号后可以重新排号

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_27

排号订阅消息授权

我们每次排号时可以获取订阅消息,排到自己时可以收到微信消息

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_28


当管理员点击当前用户入座时

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_29


用户会收到如下消息

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_30


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_31

第三章,Java项目的部署

1,准备工作

  • 1,安装jdk8
  • 2,安装mysql8.0
  • 3,安装IntelliJ IDEA 开发工具(java)
  • 4,安装微信小程序开发者工具
  • 5,注册小程序获取小程序appid
  • 6,开通小程序云开发功能
1-1, jdk8和MySQL8的安装

jdk8和MySQL8的安装与使用,网上很多教程的,可以自己去网上随便找一个跟着安装即可

1-2,当然也可以参考我后面的笔记,往下翻就可以找到的

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_32

2,源码导入

关于源码的导入,我这里说下,只要大家认真跟着笔记或者视频走,都可以跑起来的,如果你实在不想看笔记或者视频,可以找石头哥付费部署,石头哥可以远程协助你在10-30分钟内把项目完整的运行起来。

2-1,首先下载源码

这里先说明下,我的源码会不断的更新,建议大家用最新的代码,历史文件忽略就行了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_33


把上图所示的以Java-diancan开头的源码下载到桌面并解压

  • 点击open导入上图的java源码,下面两种方式都可以
  • 选择你解压后的源码

这里要说明下,我源码可能会更新,记得去网盘里下载最新的源码,解压后导入即可。

2-2,配置小程序相关的appid和密匙

导入成功后如下图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_34


这里我们需要配置APPID和APPSECRET,记得把这两个换成你自己的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_35


这两个的获取,需要你先去注册小程序,下面小程序部分的章节会具体讲小程序的注册。这里先教大家怎么拿到APPID和APPSECRET

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_36

2-3,git不用管

有的同学导入项目后会报下面这个错误,如果报的话,可以忽略不用管,当然没报肯定更好了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_37

2-4,项目启动报错解决方案

确认下项目是不是使用的jdk8,有时候不用jdk8有可能会报如下错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_38


解决方法如下图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_39


记得要使用Java8

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_40

3,安装mysql8数据库

我们这里要安装的是mysql8.0数据库。只要是8.0开头的,不管是8.0.11还是8.0.19都可以。

数据库的安装,我在点餐视频的第3章的2,3,4节里都有讲。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_41

3-1,关联mysql可视化管理

接下来,我们就要关联mysql数据库了,方便后面的可视化管理

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_42


然后选择Mysql 如下图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_43

3-2,链接数据库

接下来就要进行数据库的配置了,这里如实的输入自己的数据库名和密码就行

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_44


这里要强调下,mysql数据库默认端口是3306,如果你有变过,记得把下面这里的端口号改为你最新的。一般不建议改变mysql的端口号的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_45

3-3,链接成功

如果运气好的话,你点完Test Connection后会出现下面的绿色对勾。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_46


链接成功后,不要忘记点ok

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_47

这就说明你关联成功了,但是好多同学会出现以下错误。

3-4,关联mysql常见错误
3-4-1,时区错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_48


时区错误,MySQL默认的时区是UTC时区,比北京时间晚8个小时。所以要修改mysql的时区。

解决:

找到mysql安装目录并进入bin文件夹,我的是安装在c盘

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_49


然后输入cmd,回车

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_50


输入:mysql -uroot -p123456进入mysql命令模式

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_51


然后输入

set persist time_znotallow='+8:00';

再次连接成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_52


配置完后,点击下test,如果出现绿色对勾,即代表链接成功。然后点击ok

3-4-2,驱动错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_53


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_54


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_55


这是因为驱动没有安装的问题。解决

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_56


问题出在了上图所示的地方。这个地方你如果有看我视频,肯定知道在哪里的。

我们下面就来说下怎么解决吧。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_57


一定要注意,上图我使用的是com.mysql.jdbc.Driver这个数据库驱动。

然后下面的8.0.15的添加是先点加号,然后再如下图所示。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_58

4,执行qcl.sql创建数据库和相关数据表

如果下面第3步箭头是灰色无法点击,说明你mysql数据库没有链接成功,去看下上面第三步里提到的视频。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_59


idea链接数据库成功后,我们再来执行qcl.sql文件。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_60


正常来说,点完run就可以直接执行sql了,但是由于idea做了升级,上面直接右键可能不是直接执行,当然了,如果你是老一点版本的idea,就会直接执行,但是如果你是新版的就会变成了下面所示。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_61


这个时候,也不用害怕,只需要简单配置即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_62


然后就可以看到控制台打印下面日志

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_63


到这里我们数据相关的配置就完成了。

5,本地运行项目

启动项目有两种方法

5-1,通过DianCanApplication类启动

如下图所示

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_64

5-2,点击工具栏三角按钮

点击下图绿色箭头,运行项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_65


因为之前我们执行了sql,可能有的同学是这样的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_66


这里要记得切换成这个

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_67

6,运行成功的检验

我们上面点完运行,日志台会出现下面字样,就代表启动成功了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_68


然后输入下面网址,如果返回下面文字,就代表启动成功了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_69


也可以通过url.md里存的这个链接

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_70


输入下面网址,即可进入登陆后台页面。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_71


注意端口号要和你设置页里的保持一致

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_72

7,无法查看数据表的问题

有好多同学说执行项目后为啥只有一个表,如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_73


这是因为我们用的是jpa,项目运行的时候,会自动建表,当然创建后的表,需要你点击一下刷新才可以看得到。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_74


刷新后如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_75

第四章,导入Java常见问题汇总

1,程序包lombok不存在

如果不存在下面错误,直接跳过即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_76


通常报这个错误,是因为,我们的开发者工具idea没有安装lombok库导致的

解决办法如下:

提示我们没有安装,我们就安装一个不就行了,下面来教大家如何安装。

mac电脑点击扳手进入设置页

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_77


window电脑点击file----》settings

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_78


点击plugins,然后搜索lombok,点击install即可安装

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_79


安装完成后,重启idea开发工具即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_80

2,Idea导入三方依赖报红

问题如下图所示:

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_81


产生这个问题的原因就是因为,你项目相关类库没有加载成功。或者说你的默认maven是国外链接,加载的比较慢,甚至没有加载下来。所以我们最好使用国内镜像的maven仓库。

2-1解决方案:

1,先去我们的网盘里下载下图这个xml文件,下载后放到桌面

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_82


2,去配置maven

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_83


然后就是静静的等待了,快的话1分钟,慢的话5-10分钟。就可以把所有类库加载完了。

视频讲解:

可以到网盘里找到下面红框里的讲解视频

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_84

2-2, 使用2-1方法不行,还是没法加载依赖

有些同学的电脑,使用1-1的解决方法还是不行,通常是因为这些同学的电脑上不能使用阿里云镜像。所以这个时候我们就要换个解决思路了。这些同学常见的问题如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_85


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_86


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_87


这个时候我们就要使用默认的settings.xml了,下面教大家解决思路。

解决方案

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_88


然后右键pom.xml如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_89


新建sttings.xml后重新导入下依赖包即可。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_90


如果上面操作还不能加载类库,就如下图所示点击下clean

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_91


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_92

3,项目启动报SQLException错误

SQLException: Access denied for user ‘root’@‘localhost’ (using password: YES)

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_93


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_94


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_95


其实出现这个错误的主要原因,是因为你不细心,数据库的密码没有输入对。所以解决的方法就是数据库密码要输对。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_96

4,数据库链接时的时区问题serverTimezone错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_97


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_98


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_99


问题原因:

时区错误,MySQL默认的时区是UTC时区,比北京时间晚8个小时。所以要修改mysql的时区。

解决方法如下

找到mysql安装目录并进入bin文件夹,我的是安装在c盘

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_100


然后输入cmd,回车

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_101


输入:mysql -uroot -p123456进入mysql命令模式

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_102


然后输入

set persist time_znotallow='+8:00';

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_103

注意,上面的mysql> 不用输入的。只需要输入set persist time_znotallow=‘+8:00’; 后面这个分号不要忘记。

  • 然后再输入下
flush privileges;

做权限刷新,这样你设置的新的时区才会起效果。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_104


再次连接成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_105


配置完后,点击下test,如果出现绿色对勾,即代表链接成功。然后点击ok

讲解视频:

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_106

5,Driver files are not downloaded, jdbc.Driver报红

问题截图如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_107

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_108

出现这种问题是因为jdbc驱动问题,解决方案就是把默认的驱动删除,重新加载一个。解决方案如下


  • 1,删除默认的驱动
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_109


  • 2,重新添加jdbc驱动8.0.15
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_110

  • 这里使用com.mysql.jdbc.Driver
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_111

6,出现Public Key Retrieval is not allowed这个问题

这个问题呢,是你重启电脑后,再来启动项目时,会报的一个错误,如下图所示。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_112


这是mysql8才会出现的一个问题,如果你出现了这个问题,解起来也很简单,只需要在链接数据库的url后面追加一个 allowPublicKeyRetrieval=true

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_113

讲解视频:

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_114

第五章,小程序代码的导入与运行

1,小程序开发工具

你如果没有小程序开发基础,只需要看下这个视频学习下如何导入小程序源码到开发者工具即可

1-1,微信开发者工具的安装与使用

我们在开发小程序之前,首先需要安装小程序开发者工具,今天就来教大家安装小程序开发者工具。

一,其实很简单,只需要进入小程序官网,然后点击工具,如下图所示。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_115


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_116


当然了,也可以直接通过下面链接去下载

https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

二,下载安装包如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_117


不管你是window还是mac电脑,只需要双击安装包实现安装即可。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_118


等待安装即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_119


安装完成

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_120

三,进入开发者工具

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_121


第一次进入时,如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_122


点击上图的加号,我们来创建一个新项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_123


完成上图的配置后,点击新建。即可创建项目。创建好以后的项目如下图所示。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_124


这样我们就完成了小程序开发者工具的安装了,后面我们就可以开始小程序的代码编写了。

1-2,注册小程序

我们前面虽然可以用测试号创建小程序,但是测试号有很多功能会受限,比如我们后面讲的云开发,必须是注册小程序后才可以使用,所以今天我们就来讲讲小程序的注册.

其实官方给的注册步骤很详细了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_125


官方注册地址:https://mp.weixin.qq.com/wxopen/waregister?actinotallow=step1 进入注册页面时,跟着提示一步步来就可以了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_126

注意点:

如果只是学习的话,注册个人小程序即可.
如果想商用,想使用微信支付,取用户手机号等复杂功能,可以注册企业小程序,不过企业小程序必须有营业执照才可以注册

2,下载小程序源码并运行

2-1,下载小程序源码并解压

大家去网盘里把对应的代码下载下来即可。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_127

2-2,打开小程序开发者工具,并导入小程序源码

1,点击加号创建小程序项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_128


2,导入源码,填写自己的appid点击导入

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_129


然后选择下载并解压好的小程序源码

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_130

这里一定要用自己appid,不要用石头哥的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_131

至于appid如何获取,我这里不做讲解了,我零基础入门小程序的视频里都有讲解的:

2-3,注册小程序获取appid

和创建普通小程序一样,如上图所示,需要注意的就是这里必须要填写自己的appid,不可以用测试号. appid的获取如下图所示.

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_132

3,做一些设置(重要)

3-1,记得把基础库调为2.27.0(重要)

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_133

3-2,勾选不校验域名

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_134

4,运行小程序

这和你上面java的运行要保持一致,如果是本地的java项目运行你就用 localhost

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_135

如果你是真机调试就用下面这个。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_136

6,编译运行小程序

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_137

如果上述菜品栏没有数据,记得去自己的管理后台,先添加类目,再添加菜品

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_138


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_139


上面两步操作,可以批量导入,相应的数据,我也再网盘里给大家准备好了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_140

到这里我们点餐系统的java后台和微信小程序就完整的部署了。后面再有问题,我也会持续在这里给大家更新出来的。

7,真机调试小程序(在手机上运行)

正常情况下,我们的本地模拟器运行小程序是没问题的。如果想在手机上运行小程序。就只有两种方式了
1,部署Java后台到线上服务器(比较麻烦后面讲解)
2,运用真机调试

所以我们接下来重点讲解下真机调试

7-1,真机调试的准备工作

1,手机和电脑必须在同一个wifi下(也可以手机开热点)电脑链接热点
2,电脑防火墙要关掉
3,小程序代码app.js里要做如下处理

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_141

7-2,获取电脑ip

下面教大家如何获取自己的电脑ip

首先随便打开自己电脑的一个文件

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_142


输入cmd然后按回车键

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_143


然后就会出现下图所示的命令行窗口

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_144


然后输入ipconfig

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_145


这样就拿到我们需要的电脑ip了,然后去app.js里把ip换成你自己电脑的ip就行了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_146


记得把本地调试注释掉,把真机调试解开注释

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_147

7-3,真机调试

真机调试前,一定记得把Java后台运行起来,然后点击真机调试

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_148


点完真机调试会出现一个二维码,然后用手机微信去扫描即可。

这里再次强调下
1,手机和电脑必须在同一个wifi下(也可以手机开热点)电脑链接热点
2,电脑防火墙要关掉
3,小程序代码app.js里要用你自己电脑的ip

第六章,详细代码讲解

第1节~IntelliJ IDEA的下载与安装


我们这里以2019.2为例

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_149

一,IntelliJ IDEA软件的下载
  • 1,找石头哥获取,石头哥已经把安装包放到了网盘里。
二,软件下载好,我们就来安装了

不同电脑上安装步骤可能有些差异,下面步骤仅供参考。


  • 1,双击安装
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_150



  • 2,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_151



  • 3,选择安装目录
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_152



  • 4,勾选
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_153

  • 如果你是32位的电脑,就勾选32
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_154



  • 5,安装
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_155



  • 6,等待安装
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_156



  • 7,点击finish
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_157


三, 安装完成,打开软件。


  • 1,点击打开软件
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_158

  • 如果找不到图标,就可以去常用软件找图标即可。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_159



  • 2,选择do not import settings,然后点击ok
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_160



  • 3,同意协议,点击continue
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_161



  • 4,点击Dont send
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_162



  • 5,设置主题,直接跳过即可
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_163



第2节~jdk的安装

今天来教大家如何安装Java开发环境jdk,我们这里以jdk8为例。

一,jdk安装包的下载

目前有3种方式


  • 1,Java官网下载
    https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_164

  • 因为Java官网是国外的,有些地方的同学可能下载有点慢。

  • 2,直接百度搜索jdk8安装包,如下图
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_165

  • 缺点就是网上东西太多太乱,不一定能找到合适的。

  • 3,石头哥在网盘里帮大家准备好了,对应的安装包
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_166

  • 对应的mac电脑,window电脑的32位和64位的安装包都有。
    下载链接我也发给大家
    链接:https://pan.baidu.com/s/1GvmSRJx72vSZi3l71kr2SQ
    提取码:mj3o

二,以window64位安装为例


  • 1,双击安装包
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_167



  • 2,点击下一步
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_168



  • 3,设置安装目录,保持默认即可,然后点击下一步
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_169



  • 4,然后等待安装
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_170



  • 5,安装完成,点击确定
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_171



  • 6,接着点击下一步
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_172



  • 7,接着等待进度
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_173



  • 8,安装完成
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_174


三,配置全局环境变量


  • 1,这里点击搜索框,然后输入cmd打开命令提示符
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_175



  • 2,命令行输入javac如果提示下面,就说明需要配置全局环境变量
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_176



  • 3,拿到自己的jdk安装目录
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_177



  • 4,打开控制面板
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_178



  • 5,然后点击高级系统配置
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_179



  • 6,点击高级,然后点击环境变量
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_180


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_181



  • 7,新建JAVA_HOME,把我们上面第3步的jdk安装目录设置到下面
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_182


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_183



  • 8,新建CLASSPATH,设置变量值,
    .;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar
    注意前面的.表示当前目录。然后点击“确定”按钮。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_184



  • 9,新建PATH,设置变量值,%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_185

  • 然后点击确定即可
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_186


四,验证

重新打开cmd命令行,输入javac,如果出现下面一大串提示就代表Java环境变量配置成功了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_187

第3节~开发自己的第一个java项目

上一节带领大家成功安装的java开发工具IntelliJ IDEA,这一节就来教大家如何创建自己的第一个java项目。

所用技术

  1. jdk8(java8)
  2. springboot2.2.2

同样本节课程会配套一个视频讲解。我们每节图文教程后面都会配套一个视频讲解,方便大家更直观的学习。

话不多说,我们就来教大家如何快速创建我们的第一个java项目。

一,打开idea开发者工具

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_188

我们工具第一次打开,可能会等待几分钟。

二,点击新建项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_189

就是点击 我们上图箭头所指的 Create New Project

三,配置信息

跟着下面图片一步一步来就行

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_190

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_191

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_192

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_193

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_194

到这里我们项目就创建完成了

四,认识项目结构

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_195

我们开发java项目的时候,只需要关心src目录和pom.xml文件即可,别的都可以先不用管。

五,创建自己的第一个java文件

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_196

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_197

名字这里你可以随便取,但是有两点要求

  1. 必须是英文或者拼音
  2. 第一个字母要大写

六,编写java代码

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_198

代码如下

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RestController;
/**
 * Created by qcl on 2019-06-05
 * desc:
 */
@RestController
public class Hello {
 @GetMapping("/hello")
 public String hello() {
 return "欢迎访问我的网站";
 }
}

到这里我们的第一个java项目就成功创建了,接下来我们运行项目看下效果

七,运行项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_199

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_200

这里如果出现 Started DemoApplication in 3.426 seconds (JVM running for 4.769)

就代表项目成功运行起来了。

八,访问项目

我们这里在浏览器里输入下面网址

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_201

到这里我们就完整的实现了自己的第一个可以访问的java项目。

如果觉得图文不太好理解,请查看本专栏下一节。老师下一节会用录制视频来讲解本节课程。

本节课是《手把手带你零基础入门java开发》系列课程的一节,如果你想快速入门java开发,想开发一款属于自己的java项目,想学习springboot,想了解小程序,想了解全栈开发,想开发自己的网站,可以跟着石头哥来零基础入门。

第4节~数据库Mysql8的安装

上一节给大家讲了mysql5.7的安装,有好多同学反应,在使用5.7安装包时,最终系统却安装成了mysql8.0。这是因为现在官方也提倡我们用最新版本的,所以今天我们就再来教下大家8.0的安装。在安装8.0之前,建议大家先把之前安装的5.7卸载了。

一,安装包的下载


  • 1,官网下载
    https://dev.mysql.com/downloads/mysql/ 下载这个187M的即可
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_202

  • 点击 No thanks
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_203

  • 如果觉得官网下载有点慢,可以去我网盘里下载

  • 2,网盘下载,安装包我已经给大家放到网盘
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_204

  • 有买我点餐系统或者Java基础入门课程的同学,都可以获取到这个网盘链接。
  • 3,当然你也可以去百度下 mysql8安装包,去下载

注意:这里只要是8.0开头的就可以了,不管是8.0.11,8.0.18,8.0.19都可以的。

二,安装

我这里以mysql8.0.11为例,如果你电脑上有安装过mysql,记得卸载干净。


  • 1,双击安装
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_205



  • 2,勾选协议,然后点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_206



  • 3,保持默认,直接点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_207



  • 4,点击next,然后点击yes
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_208


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_209



  • 5,点击Execute
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_210

  • 等待所有的安装成功
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_211



  • 6,全部安装通过后,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_212

  • 继续点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_213



  • 7,保持默认,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_214



  • 8,保持默认端口号
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_215



  • 9.保持默认,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_216



  • 10,设置密码,学习用的,尽量简单,设置好以后要牢牢记住,后面还会用到。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_217



  • 11,保持默认,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_218


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_219



  • 12,点击Execute,等待校验
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_220

  • 校验通过,点击Finish
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_221



  • 13,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_222



  • 14,点击Finish
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_223

  • 点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_224



  • 15,验证密码,默认的用户名是root
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_225

  • 验证通过,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_226



  • 16,点击Execute
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_227

  • 成功后点击Finish
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_228



  • 17,点击next
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_229



  • 18,点击Finish
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_230

  • 到这里就安装成功了,步骤有点多,可能不同电脑上会有出入,但是大体都是一样的。

三,打开mysql并进入

两种方式,建议用第一种方式即可。如果第一种不行,再用第二种。


  • 1,mysql自带客户端。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_231

  • 输入密码,成功进入
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_232



  • 2,用cmd命令行
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_233

  • 但是这里提示mysql不是内部或外部命令,所以我们接下来要配置mysql全局环境变量。

四,配置全局环境变量


  • 1,进入高级设置
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_234



  • 2,设置MYSQL_HOME
    把你mysql的安装目录,如我的是下面这个
    C:\Program Files\MySQL\MySQL Server 8.0\bin
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_235



  • 3,设置PATH
    在PATH里添加 %MYSQL_HOME%
    如果PATH 里已有内容,就把%MYSQL_HOME%追加进去
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_236

  • 如果PATH里没有内容,就新建添加,如下图
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_237



  • 4,打开cmd命令行输入mysql -V
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_238


如果能出现版本号,就代表环境变量配置完成。

五,登陆mysql

mysql -uroot -p123456

这里的root是mysql的用户名,123456是密码

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_239

第5节~idea连接Mysql8数据库

上一节,我们讲了mysql5.7可视化操作,今天再来讲下mysql8的可视化操作,后面我们的课程,都用mysql8来讲,所以这一节很重要,一定要跟着老师一步步配置。

一,新建一个Java项目


  • 1,新建项目
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_240

  • 如果你是第一次打开的话,应该是这样的
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_241



  • 2,创建springboot项目
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_242


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_243


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_244


  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_245


二,idea链接mysql

1,如下图所示,点击最右侧的DataBase,然后点击Data Source

然后选择mysql

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_246

2,配置数据库

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_247


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_248

三,时区错误及解决方案

如果出现下面错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_249

时区错误,MySQL默认的时区是UTC时区,比北京时间晚8个小时。所以要修改mysql的时区。

解决:

找到mysql安装目录并进入bin文件夹,我的是安装在c盘

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_250


然后输入cmd,回车

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_251


输入:mysql -uroot -p123456进入mysql命令模式

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_252


然后输入

set persist time_znotallow='+8:00';

再次连接成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_253


配置完后,点击下test,如果出现绿色对勾,即代表链接成功。然后点击ok

四,可视化操作数据库


  • 1,上面第二步链接成功后,我们这里就可以添加数据库,添加数据表了。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_254

  • 我们执行下面sql语句,创建一个test数据库
create database test default character set utf8 collate utf8_general_ci;
  • 2,创建一个user表
    同样的执行下面sql语句,来创建一个user表
use test;
create table user
(
    id int null,
    name varchar(20) null
);

创建好以后的user表,如下图。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_255


  • 3,添加数据
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_256



  • 4,查询数据
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_257


到这里我们就可以成功的借助idea来可视化的操作mysql8了。后面我会讲解更多Java和小程序的知识,敬请关注。

第6节~Jpa操作数据库

我们经过前面的学习,已经可以正式操作mysql数据库,进行增删改查了。今天就来讲讲通过JPA来操作mysql数据库。学完本节,你会感慨springboot结合jpa操作数据库是如此的简单。好了,话不多说,我们开始在springboot中使用jpa。

一,创建springboot项目

1,创建一个新项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_258


2,定义项目名称,点击next

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_259


3,勾选Spring Web

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_260


4,勾选jpa和mysql驱动

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_261


5,点击finish

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_262


到这里我们就成功的创建springboot项目,并在项目里引入jpa了。下面我们就来讲解下怎么使用jpa操作数据库。

二,配置数据库相关信息

我们需要在配置文件里配置数据相关的信息。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_263

完整配置代码如下

# 数据库驱动
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
# 数据库用户名
spring.datasource.username=root
# 数据库密码
spring.datasource.password=123456
# 链接本地数据库
spring.datasource.url=jdbc:mysql://localhost:3306/test?characterEncoding=utf-8&useSSL=false
# 每次启动项目时更新数据库
spring.jpa.hibernate.ddl-auto=update

我们这里用到了test数据库,所以我们要先新建一个test数据库。
创建test数据库的sql语句。如果你还不知道怎么使用idea链接mysql并创建数据库,可以去看下我前面的文章或者看下配套视频。

create database test default character set utf8 collate utf8_general_ci;

如下图所示,即代表我们创建test数据库成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_264

三,编写一个实体类和数据库表一一对应

我们这里编写一个 Test类,这个test类会和我们的数据表test一一对应。然后表里有一个自增的id字段,和一个name字段。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_265

/**
 * 作者:编程小石头
 */
@Entity
public class Test {
    @Id
    @GeneratedValue
    private int id;
    private String name;
    public int getId() {
        return id;
    }
    public void setId(int id) {
        this.id = id;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
}

四,实现一个持久层,用来操作数据库

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_266

@Repository
public interface TestDao extends JpaRepository<Test,Integer> {
}

五,实现一个controller用来供浏览器操作数据库

@RestController
public class TestController {
    @Resource
    TestDao dao;

    @GetMapping("/add")
    public Test add() {
        Test test = new Test();
        test.setName("编程小石头");
        Test save = dao.save(test);
        return save;
    }
    @GetMapping("/list")
    public List<Test> list() {
        List<Test> all = dao.findAll();
        return all;
    }  
}

六,效果演示

执行下面操作之前,别忘记先启动项目


  • 1,增加一条数据
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_267



  • 2,看下我们的数据表里,有成功添加这条数据
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_268



  • 3,查询所有数据
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_269

  • 到这里我们就成功的在springboot引入jpa,成功的实现的数据的增加和查询了,是不是很简单。spingboot结合jpa对mysql数据库进行增删改查的操作,可以去看下配套视频。

第7节~springboot引入freemarker

今天我就要正式学习Java后台页面编写了,通常我们应该用html直接编写,也可以用前后端分离的方式,比如vue来编写后台网页,但是呢,作为Java后端开发来所,有一个很方便的模板,可以快速实现Java后台页面的开发,这就是我们今天要讲的freemarker.

一,pom.xml里引入freemarker类库

这里默认你已经新建了一个spingboot项目,我们这里直接引入类库.

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_270

<!--freemarker-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>

二,新建ftlh文件

在resources里新建templates文件,默认freemarker页面都是放在templates里.

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_271


如果又同学学过freemarker,肯定会问,这里为什么是ftlh结尾,而不是ftl结尾呢,因为spingboot2.2以后默认使用ftlh来表示freemarker文件了,所以我们以后都用.ftlh结尾

三,新建一个controller

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_272


这样我们运行项目,然后访问效果如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_273


到这里我们就成功的在springboot里引入freemarker里,后面我们就可以愉快的编写后台网页了.

四,freemarker常用标签

  • 1,列表<#list>
<#list nameList as names>  
  ${names} 
</#list>
  • 2,if语句
<#if (age>=18)>
    成年人
</#if>
  • 3,if else语句
<#if (age>=18)>
    成年人
<#else>
    未成年人
</#if>
  • 4,elseif语句
<#if (age>=18)>
    年龄大于等于18
<#elseif (age>12)>
    年龄大于12
<#else>
    年龄小于12
</#if>
  • 5,导入文件
    可以导入ftlh,也可以导入html文件.
<#include "left.ftlh">

第8节~freemarker+bootstrap实现管理后台

我们做后台开发时,难免会要开发管理后台。如下面这样的管理后台,我们完全可以不用h5同学,自己快速开发管理web后台的。

所以接下来我会用几节来教大家如何快速实现管理后台。

本节知识点

  • springboot2.2.2
  • freemarker
  • bootstrap4
  • maven

老规矩,先看效果图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_274

所以本节就来教大家如何快速实现管理后台表格数据的展示与操作。

这节课是建立在你已经会创建springboot项目的基础上,如果你还不知道怎么创建一个springboot项目请异步到这里:

好了,下面就来讲解,如何使用springboot+freemarker+bootstrap快速实现管理后台表格数据的展示。

一,首先要在你的pom.xml 加入freemarker仓库

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_275

<dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-freemarker</artifactId>
        </dependency>

二,在项目的templates目录下创建demo目录,然后创建list.ftl文件

我们freemarker使用的是 .ftl结尾的模版文件

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_276


list.ftl完整代码如下

<html>
<head>
	<meta charset="utf-8">
	<title>freemarker+bootstrap学习</title>
	<#--本地引入-->
	<#--<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">-->
	<!-- 新 Bootstrap4 核心 CSS 文件 -->
	<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap
	.min.css">

</head>
<body>
<div class="container-fluid">
	<div class="table-responsive">
		<table id="dataGrid" class="table table-striped table-bordered">
			<thead>
			<tr>
				<th width="50"><input type="checkbox" class="checkall"></th>
				<th>标题</th>
				<th>姓名</th>
				<th>微信</th>
				<th width="50">操作</th>
			</tr>
			</thead>
			<tbody>
			<#list demoList as row>
				<tr>
					<td>
						<input type="checkbox" name="id" value="${row.id}">
					</td>
					<td>${row.title}</td>
					<td>${row.name}</td>
					<td>${row.wechat}</td>
					<td>
						<button class="btn btn-xs btn-primary"
								onclick="deleteRow(${row.id})">删除
						</button>
					</td>
				</tr>
			</#list>
			</tbody>
		</table>
	</div>
</div>
<script type="text/javascript">
    function deleteRow(rowId) {
        console.log("点击了删除", rowId);
    }
</script>

</body>
</html>

这里需要讲下,我们引入bootstrap有两种方式,大家学习阶段推荐用第一种方式。

  • 1,直接引入网上资源(推荐)
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap
    .min.css">
  • 2,把bootstrap下载到本地,然后再引入本地
<link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_277

三,我们页面写好了,接下来就是网页面里传数据了。

这里我们定义一个DemoController如下

package com.qcl.demo.controller;

import com.qcl.demo.bean.Demo;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import java.util.ArrayList;
import java.util.List;
import java.util.Map;

/**
 * Created by qcl on 2019-04-29

 * desc:freemarker学习
 */
@RestController
public class DemoController {

    @GetMapping("/demoList")
    public ModelAndView list(Map<String, Object> map) {
        List<Demo> demoList = new ArrayList<>(4);
        demoList.add(new Demo(1, "标题1", "编程小石头1", "2501902696"));
        demoList.add(new Demo(2, "标题2", "编程小石头2", "2501902696"));
        demoList.add(new Demo(3, "标题3", "编程小石头3", "2501902696"));
        demoList.add(new Demo(4, "标题4", "编程小石头4", "2501902696"));
        map.put("demoList", demoList);
        return new ModelAndView("demo/list", map);
    }
}

这里我们先模拟4条数据,然后把数据传到我们的list.ftl页面,正常数据都应该是从数据库里取的,后面会做讲解。
这就是用freemarker模版的好处。可以直接在页面里使用我们的java数据。

<table id="dataGrid" class="table table-striped table-bordered">
	<thead>
	<tr>
		<th width="50"><input type="checkbox" class="checkall"></th>
		<th>标题</th>
		<th>姓名</th>
		<th>微信</th>
		<th width="50">操作</th>
	</tr>
	</thead>
	<tbody>
	<#list demoList as row>
		<tr>
			<td>
				<input type="checkbox" name="id" value="${row.id}">
			</td>
			<td>${row.title}</td>
			<td>${row.name}</td>
			<td>${row.wechat}</td>
			<td>
				<button class="btn btn-xs btn-primary"
						onclick="deleteRow(${row.id})">删除
				</button>
			</td>
		</tr>
	</#list>
	</tbody>
</table>

这样我们运行项目,然后进入web后台,就可以看到了,我们这里点击删除时,是可以拿到每行的id的,这样我们就可以根据id删除具体数据,然后再重新刷新下页面就可以了。后面会给大家讲解通过web后台操作数据库的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_278

到这里我们就实现了管理后台表格数据的展示与操作了,是不是很简单啊。

我会把10小时实战入门java系列课程录制成视频,如果你看文章不能很好的理解,可以去看下视频:

编程小石头,码农一枚,非著名全栈开发人员。分享自己的一些经验,学习心得,希望后来人少走弯路,少填坑。

第9节~freemarker+bootstrap实现分页功能

本节是建立在上节的基础上,上一节给大家讲了管理后台表格如何展示数据,但是当我们的数据比较多的时候我们就需要做分页处理了。这一节给大家讲解如何实现表格数据的分页显示。

准备工作

还是老规矩,看效果图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_279

可以看出我们实现了如下功能

  • 1,表格数据的展示
  • 2,分页效果的实现
  • 3,上一页和下一页的实现
  • 4,当前选中页码加重颜色

下面来看实现步骤

一,定义表格和分页组件

简单说说代码

  • head里面是引入bootstrap的样式库
  • table定义表格来展示数据
  • ul里定义分页
    代码如下:
<html>
<head>
	<meta charset="utf-8">
	<title>freemarker+bootstrap学习</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<!-- 新 Bootstrap4 核心 CSS 文件 -->
	<link rel="stylesheet"
		  href="https://cdn.staticfile.org/twitter-bootstrap/4.1.0/css/bootstrap.min.css">

</head>
<body>
<div class="container-fluid">
	<div class="row clearfix">
		<div class="col-md-12 column">
			<table class="table table-bordered table-condensed table-striped">
				<thead>
				<tr>
					<th>id</th>
					<th>姓名</th>
					<th>微信</th>
					<th colspan="2">操作</th>
				</tr>
				</thead>
				<tbody>

				<#list productInfoPage as productInfo>
					<tr>
						<td>${productInfo.id}</td>
						<td>${productInfo.name}</td>
						<td>${productInfo.wechat}</td>
						<td>
							<#if productInfo.id%2 == 0>
								<a href="#">下架</a>
							<#else>
								<a href="">上架</a>
							</#if>
						</td>
					</tr>
				</#list>
				</tbody>
			</table>
		</div>

		<#--分页-->
		<div class="col-md-12 column">
			<ul class="pagination ">
				<#if currentPage lte 1>
					<li class="disabled "><a class="page-link" href="#">上一页</a></li>
				<#else>
					<li>
						<a class="page-link" href="/pageList?page=${currentPage -
						1}&size=${size}">上一页</a>
					</li>
				</#if>

				<#list 1..totalPage as index>
					<#if currentPage == index>
						<li class="page-item active "><a class="page-link" href="#">${index}</a>
						</li>
					<#else>
						<li>
							<a class="page-link" href="/pageList?page=${index}&size=${size}">
								${index}</a>
						</li>
					</#if>
				</#list>

				<#if currentPage gte totalPage>
					<li class="disabled "><a class="page-link" href="#">下一页</a></li>
				<#else>
					<li>
						<a class="page-link" href="/pageList?page=${currentPage + 1}&size=${size}">下一页</a>
					</li>
				</#if>
			</ul>
		</div>
	</div>
</div>
</body>
</html>

二,定义好页面后,我们就来获取数据

同样这里的数据我们先用模拟数据,后面会用数据库里的数据。
看下面代码可以看出来,我们模拟了6条数据,然后每页显示2条数据。

package com.qcl.demo.controller;

import com.qcl.demo.bean.Demo;

import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.servlet.ModelAndView;

import java.util.ArrayList;
import java.util.List;
import java.util.Map;

/**
 * Created by qcl on 2019-04-29

 * desc:freemarker学习
 */
@RestController
public class DemoController {

    /*
     * 分页效果的实现
     * */
    @GetMapping("/pageList")
    public ModelAndView list(@RequestParam(value = "page", defaultValue = "1") Integer page,
                             @RequestParam(value = "size", defaultValue = "2") Integer size,
                             Map<String, Object> map) {
        List<Demo> demoList = new ArrayList<>(4);
        demoList.add(new Demo(1, "标题1", "编程小石头1", "2501902696"));
        demoList.add(new Demo(2, "标题2", "编程小石头2", "2501902696"));
        demoList.add(new Demo(3, "标题3", "编程小石头3", "2501902696"));
        demoList.add(new Demo(4, "标题4", "编程小石头4", "2501902696"));
        demoList.add(new Demo(5, "标题5", "编程小石头4", "2501902696"));
        demoList.add(new Demo(6, "标题6", "编程小石头4", "2501902696"));
        demoList.add(new Demo(7, "标题7", "编程小石头7", "2501902696"));
        int start = (page - 1) * 2;
        int end = start + size;
        List<Demo> subList = demoList.subList(start, end);
        int totalPage = (int) Math.ceil(demoList.size() / size);
        map.put("productInfoPage", subList);
        map.put("totalPage", totalPage);
        map.put("currentPage", page);
        map.put("size", size);
        return new ModelAndView("demo/list", map);
    }
}

三,启动springboot查看效果。

注意每一页地址栏的url

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_280


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_281


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_282


可以看出,我们第一次访问时,默认显示第一页,url里没有page和size字段。

访问第2页和第3页时,url里就有了page和size。page是显示那一页,size是每页显示多少条数据。

到这里我们就实现的管理后台的分页效果。

我会把10小时实战入门java系列课程录制成视频,如果你看文章不能很好的理解,可以去看下视频:

第10节,点餐系统排号等位功能讲解

最近忙着创业,好久没有写文章了。今天就抽空给点餐系统加一个排号等位功能,想加这个功能很久了,一直没有瞅到时间写。今天就把这个功能实现了,顺便写个文章出来。

老规矩,先给大家看效果图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_283


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_284


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_285


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_286


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_287


只顾实现功能了,ui没怎么美化,后面有时间再做下ui美化吧。下面就来给大家讲解下。

讲之前,先给大家看一个简单的流程图。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_288


流程其实很简单,就是客户端(小程序端)操作,点击排位。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_289


然后Java后台,入库,并生成排位的号码,用户端可以看到自己当前排在第几号。

然后管理员在后台操作,排到位的客户可以入座。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_290


等到号的用户,就会出现可入座的标识。后面会增加排到号的用户接受微信订阅消息通知的功能。敬请期待。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_291


流程基本上讲完了,接下来就给大家讲解代码部分。这里只把重要的代码贴出来给到大家,顺便给大家讲下思路。后面也会录制完整的讲解视频:《点餐系统,java后台+点餐小程序》

一,小程序端代码

1,排号相关代码

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_292


我们先来讲讲排号相关的代码,从上图可以看出,我们排号的wxml文件里可以显示两种状态,未排号和已排号。上图展示的是未排号的状态,用户点击完取号以后,就可以展示已排号状态了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_293


其实排号的小程序端代码很简单。下面再把paihao.js的代码贴出来给到大家。

let app = getApp()
Page({
  data: {
    num: 1111, //当前排号
    type: 1,
    currentSmall: -1,
    currentBig: -1
  },
  onShow: function () {
    this.getNum()
  },
  //取号
  quhao(event) {
    let type = event.currentTarget.dataset.type
    let that = this;
    //如果openid不存在,就重新请求接口获取openid
    var openid = app.globalData.openid;
    if (openid === null || openid === undefined) {
      app.getOpenid();
      wx.showToast({ //这里提示失败原因
        title: 'openid为空!',
        duration: 1500
      })
      return;
    }
    wx.request({
      url: app.globalData.baseUrl + '/paihao/quhao',
      method: "POST",
      header: {
        "Content-Type": "application/x-www-form-urlencoded"
      },
      data: {
        openid: openid,
        type: type,
      },
      success(res) {
        if (res && res.data && res.data.data) {
          wx.showToast({
            title: '排号成功',
          })
          console.log(res)
          that.setData({
            type: res.data.data.type,
            num: res.data.data.num
          })
        }
      },
      fail(res) {
        console.log("排号失败", res)
      }
    })

  },
  //查询我的排号
  getNum() {
    let that = this;
    //如果openid不存在,就重新请求接口获取openid
    var openid = app.globalData.openid;
    if (openid === null || openid === undefined) {
      app.getOpenid();
      wx.showToast({ //这里提示失败原因
        title: 'openid为空!',
        duration: 1500
      })
      return;
    }
    wx.request({
      url: app.globalData.baseUrl + '/paihao/getNum',
      data: {
        openid: openid
      },
      success: function (res) {
        if (res && res.data && res.data.data) {
          let dataList = res.data.data;
          console.log("请求到的排号情况", dataList)
          that.setData({
            type: dataList.type,
            num: dataList.num,
            smallOkNum: dataList.smallOkNum,
            bigOkNum: dataList.bigOkNum,
          })
        } else {
          that.setData({
            num: -1
          })
        }
      },
      fail(res) {
        console.log("查询排号失败", res)
      }
    })
  }
})

这里需要注意一点,就是一定要先获取用户的openid,因为openid是用户的唯一标识。每人每天只能排一次号。买我点餐系统这门课的同学,都知道如何获取openid,我课程配套的视频也有讲。

二,Java后台代码讲解

如果有仔细看上面第一步小程序端代码,应该可以看到wx.request网络请求部分,其实这个网络请求就是请求的我们Java后台。下面先把Java后台源码贴出来。

/**
 * 小程序端排号相关接口
 */
@RestController
@RequestMapping("/paihao")
@Slf4j
public class WxPaihaoController {
    @Autowired
    PaihaoRepository repository;

    /*
     * 取号
     * */
    @PostMapping("/quhao")
    public ResultVO quhao(@RequestParam(value = "type") Integer type,
                          @RequestParam("openid") String openid) {
        int size = repository.findByDayAndType(TimeUtils.getYMD(), type).size();
        log.info("当前排号数={}", size);
        Paihao paihao = new Paihao();
        paihao.setDay(TimeUtils.getYMD());
        paihao.setNum(size + 1);
        paihao.setType(type);
        paihao.setOpenid(openid);
        paihao.setRuzuo(false);
        return ApiUtil.success(repository.save(paihao));
    }
    /*
     * 查询当前排号
     * */
    @GetMapping("/getNum")
    public ResultVO getNum(@RequestParam("openid") String openid) {
        //获取当前小桌入座情况
        List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 0);
        //获取当前大桌入座情况
        List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 1);
        //查询当前客户的排号情况
        List<Paihao> listKeHu = repository.findByOpenidAndDay(openid,TimeUtils.getYMD());
        //组装数据返回给小程序端
        PaihaoVO paihao = new PaihaoVO();
        if (listSmall != null && listSmall.size() > 0) {
            paihao.setSmallOkNum(listSmall.get(listSmall.size() - 1).getNum());
        } else {
            paihao.setSmallOkNum(0);
        }
        if (listBig != null && listBig.size() > 0) {
            paihao.setBigOkNum(listBig.get(listBig.size() - 1).getNum());
        } else {
            paihao.setBigOkNum(0);
        }
        if (listKeHu != null && listKeHu.size() > 0) {
            paihao.setNum(listKeHu.get(listKeHu.size() - 1).getNum());
            paihao.setType(listKeHu.get(listKeHu.size() - 1).getType());
        } else {
            paihao.setNum(0);
            paihao.setType(0);
        }
        return ApiUtil.success(paihao);
    }
}

可以看到我们一共给小程序前端提供两个接口,一个是取号,一个是查询当前排号状态。

1,先给大家讲讲取号

/*
     * 取号
     * */
    @PostMapping("/quhao")
    public ResultVO quhao(@RequestParam(value = "type") Integer type,
                          @RequestParam("openid") String openid) {
        int size = repository.findByDayAndType(TimeUtils.getYMD(), type).size();
        log.info("当前排号数={}", size);
        Paihao paihao = new Paihao();
        paihao.setDay(TimeUtils.getYMD());
        paihao.setNum(size + 1);
        paihao.setType(type);
        paihao.setOpenid(openid);
        paihao.setRuzuo(false);
        return ApiUtil.success(repository.save(paihao));
    }

取号其实很简单,就是先查询当前已经排到第几号,然后新排号的客户号码再前面排号的基础上加一。然后数据入库就可以了。

2,再给大家讲下排号状态查询。

@GetMapping("/getNum")
    public ResultVO getNum(@RequestParam("openid") String openid) {
        //获取当前小桌入座情况
        List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 0);
        //获取当前大桌入座情况
        List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), true, 1);
        //查询当前客户的排号情况
        List<Paihao> listKeHu = repository.findByOpenidAndDay(openid,TimeUtils.getYMD());
        //组装数据返回给小程序端
        PaihaoVO paihao = new PaihaoVO();
        if (listSmall != null && listSmall.size() > 0) {
            paihao.setSmallOkNum(listSmall.get(listSmall.size() - 1).getNum());
        } else {
            paihao.setSmallOkNum(0);
        }
        if (listBig != null && listBig.size() > 0) {
            paihao.setBigOkNum(listBig.get(listBig.size() - 1).getNum());
        } else {
            paihao.setBigOkNum(0);
        }
        if (listKeHu != null && listKeHu.size() > 0) {
            paihao.setNum(listKeHu.get(listKeHu.size() - 1).getNum());
            paihao.setType(listKeHu.get(listKeHu.size() - 1).getType());
        } else {
            paihao.setNum(0);
            paihao.setType(0);
        }
        return ApiUtil.success(paihao);
    }

这一步稍微复杂一点。这一步的主要就是给小程序端返回所需的数据,比如当前大桌排到了第几号,小桌排到了第几号,当前用户的排号,当前用户是否被叫到。代码里注释都很清楚了,感兴趣的同学仔细看下上面代码即可。

3,管理员端

管理员就是用来操作谁可以入座的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_294


这个页面主要是用freemarker写的前端页面。代码如下图。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_295


对应的后台接口。

/**
 * 排号相关
 */
@Controller
@RequestMapping("/adminPaihao")
@Slf4j
public class AdminPaihaoController {

    @Autowired
    PaihaoRepository repository;

    /*
     * 页面相关
     * */
    @GetMapping("/list")
    public String list(ModelMap map) {
        //获取小桌未入座的用户
        List<Paihao> listSmall = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), false, 0);
        //获取大桌未入座的用户
        List<Paihao> listBig = repository.findByDayAndRuzuoAndTypeOrderByNum(TimeUtils.getYMD(), false, 1);
        map.put("listSmall", listSmall);
        map.put("listBig", listBig);
        return "paihao/list";
    }

    @GetMapping("/ruzhuo")
    public String ruzhuo(@RequestParam("id") int id, ModelMap map) {
        try {
            Paihao paihao = repository.findById(id).orElse(null);
            if (paihao == null) {
                throw new DianCanException(ResultEnum.PAIHAO_NOT_EXIST);
            }
            if (paihao.getRuzuo()) {
                throw new DianCanException(ResultEnum.PAIHAO_STATUS_ERROR);
            }
            paihao.setRuzuo(true);
            repository.save(paihao);
        } catch (DianCanException e) {
            map.put("msg", e.getMessage());
            map.put("url", "/diancan/adminPaihao/list");
            return "zujian/error";
        }
        map.put("url", "/diancan/adminPaihao/list");
        return "zujian/success";
    }
}

管理页对应的代码很简单,就是一个显示当前排号数据列表,另外一个就是操作到号用户入座,后面还会添加到号后微信订阅消息通知相应用户的功能。

到这里完整的点餐排号等位功能就差不多实现了,相应的讲解视频和源码我会放到网盘

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_296

第11节,微信订阅消息推送的讲解

其实想给点餐系统加推送很久了,之前也有单门写过Java版的微信消息推送和云开发版的微信消息推送。之所以一直没有加,也是考虑到大家的学习接受度,因为做订阅消息推送是一个综合性的开发工作。
需要你既要会小程序端开发,又要会Java端开发,还要会web网页端开发。还要懂得小程序公众号后台操作,还要自己去申请消息模板,自己配置appid,模板id,模板内容。就是因为怕大家一上来被这么多问题吓到,所以一直没有搞点餐系统的消息推送。

老规矩,先看效果图

我们今天就以排号入座为例,当排号等位的用户被叫号时,会给用户发送一条微信订阅消息。就是在管理点击下图的可入座时,发送订阅消息给用户。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_297

至于如何创建模板消息,如果获取模板id我这节就不再讲解,不知道的同学可以查看我上篇文章《借助云开发实现小程序订阅消息和模板消息的推送功能》里面有详细的讲解。
今天呢就来重点讲下如何在Java后台编写小程序订阅消息推送的知识。
其实我很早之前有写过一篇Java实现模板消息推送的,但是小程序后面用订阅消息替换了模板推送,所以我也会根据最新的知识点不定期的更新文章的。

发送订阅消息三步走
1,拿到用户的openid
2,获取access_token
3,调用小程序消息推送的接口

一,获取用户的openid

关于用户openid的获取,我写过很多篇文章了,也有录过视频出来的,还不知道怎么获取的同学,可以取翻看下我之前的文章,或者看下我录制的零基础入门小程序的视频:《5小时零基础入门小程序云开发》 所以这一步不是今天的重点。

我们点餐系统里前面的排号功能讲解里也已经成功的存入了我们的openid到数据库了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_298

二,获取access_token

官方文档:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

首先来看下access_token是什么,下图是官方给出的

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_299

其实通俗的讲,access_token就是小程序官方给我们提供的一个凭证,你要调用小程序官方的接口,就必须先拿到access_token。所以下面先讲下如果获取access_token


  • 看下官方文档,可以知道我们需要用到下面的几个参数
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_300

  • grant_type是一个固定的值,只有appid和secret是需要我们填入的,这两个值在我们的小程序后台就可以拿到,我也有录视频教大家如何拿到,如果不知道怎么获取的同学可以去看下我的视频。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_301

  • 这里需要注意的是,AppSectet一定要记好,要不然每次都要重置。

下面就是Java代码的编写了

我们这里用的是springboot,这里涉及到一个请求小程序官方接口,所以我们这里用了springboot自带的RestTemplate来做网络请求。具体代码如下。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_302

可以看出代码很简单,就是用RestTemplate来实现一个get请求,这样我们就可以轻松的获取到了access_token。获取到的access_token返回数据如下图。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_303


请求上面代码,返回的数据如下。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_304

注意点

关于这个access_token,是存在有效期的,来看下官方给出的提示

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_305

所以我要在获取到access_token的时候,把access_token存到数据库,或者存到本地缓存,并且还要记录当前时间,后面再用的时候先判断这个access_token有没有超过2个小时,如果超过2个小时的话,就要重新获取了。由于这里不是本节的重点,我这里只给大家说下原理。

三,发送消息到小程序

我们通过上面第二步,成功的获取到了access_token。下面就要调用小程序官方为我们提供的发送消息的接口了。先看下官方文档。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_306

上面的参数都是我们发送消息时需要的。这些参数的定义和设置我在前面的文章里也都讲过了,不知道的同学可以去看下我前面写的这篇文章 《借助云开发实现小程序订阅消息和模板消息的推送功能》

这里需要注意的一点是,我们要给用户发送消息,就必须引导用户授权,就是下面这个图

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_307

因为用户不点击允许,你是没有办法给用户推送消息的。每一次授权只允许发送一条消息,所以如果你想尽量多的发送消息,就得尽量多的引导用户授权。

推送的Java代码如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_308

可以看到,我们这里需要定义用户的openid,模板id,跳转路径,模板消息内容。。。

这些都定义好以后,我们就可以提供一个服务给到Java的其他代码调用,或者提供一个接口供外界传入openid,然后给对应的用户推送消息了。

我们在浏览器里调用上面接口,可以看到下图所示,这样就代表我们消息推送成功了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_309


这里要注意,我们要把openid和一些参数动态的获取到,然后封装到模板里。

所以接下来继续改造我们的推送代码

我们既然要获取一些用户的信息,比如openid,桌号,排队开始时间等,我们一个个传进来就有些太麻烦了,所以最简单的方式,就是把排号表里对应的id拿过来。所以我们只需要知道用户当前排号的id,就可以拿到所有需要的信息。

改造后的发送订阅消息的方法如下:

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_310


这个时候,如果我们直接调用发送,会报下面这个错误。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_311


仔细看下错误,就可以知道,我们的模板id不正确,所以,我们要配置我们自己的模板id。我们可以去小程序后台获取到我们自己的模板id。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_312

填入我们的模板id后,还会报下面的错误。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_313


上面的这个错误,就是因为我们在小程序端没有做授权。所以授权这一步也必不可少的。而这个授权应该在用户点击取号的时候,就应该弹出来询问用户授权的。

四,微信小程序端用户授权

授权代码的官方文档:https://developers.weixin.qq.com/miniprogram/dev/api/open-api/subscribe-message/wx.requestSubscribeMessage.html

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_314

下面我把小程序端的代码和注意事项也和大家说下

我们在用户取号时,不仅要请求取号接口,还要获取用户授权。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_315


这个模板id为了方便管理,我写在了app.js里了,方便全局使用。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_316


其实小程序端只需要做这些就可以了,无非在取号时,我们要把模板id传给后台,存到数据库,方便后台Java后台调用消息发送时使用。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_317

五,我再把Java的完整代码贴出来给到大家

1,获取AccessToken

//获取AccessToken
    public String getAccessToken() {
        RestTemplate restTemplate = new RestTemplate();
        Map<String, String> params = new HashMap<>();
        params.put("APPID", GlobalConst.APPID);  //这里替换成你的appid
        params.put("APPSECRET", GlobalConst.APPSECRET);  //这里替换成你的appsecret
        ResponseEntity<String> responseEntity = restTemplate.getForEntity(
                "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={APPID}&secret={APPSECRET}", String.class, params);
        String body = responseEntity.getBody();
        AccessToken object = new Gson().fromJson(body, AccessToken.class);
        log.info("返回的AccessToken={}", object);
        String Access_Token = object.getAccess_token();
        return Access_Token;
    }

2,Java调用订阅消息推送

package com.qcl.push;
import com.google.gson.Gson;
import com.google.gson.JsonArray;
import com.google.gson.JsonElement;
import com.google.gson.JsonObject;
import com.qcl.bean.Paihao;
import com.qcl.global.GlobalConst;
import com.qcl.repository.PaihaoRepository;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.http.ResponseEntity;
import org.springframework.stereotype.Service;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.client.RestClientException;
import org.springframework.web.client.RestTemplate;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

/**
 * 作者:编程小石头
 * 发送小程序订阅消息
 */
@Service
@Slf4j
public class SendWxMessage {
    @Autowired
    private PaihaoRepository repository;
    //发送订阅消息
    public String pushOneUser(Integer id) {
        Paihao paihao = repository.findById(id).orElse(null);
        RestTemplate restTemplate = new RestTemplate();
        //这里简单起见我们每次都获取最新的access_token(时间开发中,应该在access_token快过期时再重新获取)
        String url = "https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=" + getAccessToken();
        //拼接推送的模版
        WxMssVo wxMssVo = new WxMssVo();
        wxMssVo.setTouser(paihao.getOpenid());//用户的openid(要发送给那个用户,通常这里应该动态传进来的)
        wxMssVo.setTemplate_id(paihao.getTemplateid());//订阅消息模板id
        wxMssVo.setPage("pages/index/index");
        //封装模板消息内容。必须和你申请的小程序模板格式一模一样。
        Map<String, TemplateData> m = new HashMap<>(2);
        //A小桌,B大桌
        String num = (paihao.getType() == 1 ? "B" : "A") + paihao.getNum();
        m.put("phrase1", new TemplateData("您可入座啦"));
        m.put("character_string5", new TemplateData(num));
        wxMssVo.setData(m);
        ResponseEntity<String> responseEntity =
                restTemplate.postForEntity(url, wxMssVo, String.class);
        log.info("推送返回的信息 ={}", responseEntity.getBody());
        return responseEntity.getBody();
    }
    //获取AccessToken
    public String getAccessToken() {
        RestTemplate restTemplate = new RestTemplate();
        Map<String, String> params = new HashMap<>();
        params.put("APPID", GlobalConst.APPID);  //这里替换成你的appid
        params.put("APPSECRET", GlobalConst.APPSECRET);  //这里替换成你的appsecret
        ResponseEntity<String> responseEntity = restTemplate.getForEntity(
                "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid={APPID}&secret={APPSECRET}", String.class, params);
        String body = responseEntity.getBody();
        AccessToken object = new Gson().fromJson(body, AccessToken.class);
        log.info("返回的AccessToken={}", object);
        String Access_Token = object.getAccess_token();
        return Access_Token;
    }
}

WxMssVo类

package com.qcl.push;

import java.util.Map;

/*
 * 小程序推送所需数据
 * 编程小石头
 * */
public class WxMssVo {
    private String touser;//用户openid
    private String template_id;//订阅消息模版id
    private String page = "pages/index/index";//默认跳到小程序首页
    private Map<String, TemplateData> data;//推送文字

    public String getTouser() {
        return touser;
    }

    public void setTouser(String touser) {
        this.touser = touser;
    }

    public String getTemplate_id() {
        return template_id;
    }

    public void setTemplate_id(String template_id) {
        this.template_id = template_id;
    }

    public String getPage() {
        return page;
    }

    public void setPage(String page) {
        this.page = page;
    }

    public Map<String, TemplateData> getData() {
        return data;
    }

    public void setData(Map<String, TemplateData> data) {
        this.data = data;
    }
}

TemplateData类

package com.qcl.push;

import lombok.Data;

/*
 * 编程小石头
 * 用来封装订阅消息内容
 * */
@Data
public class TemplateData {
    private String value;//

    public TemplateData(String value) {
        this.value = value;
    }

}

AccessToken类

package com.qcl.push;
import lombok.Data;
/**
 * 作者:编程小石头
 * 微信返回的Access_Token对应的bean
 */
@Data
public class AccessToken {
    private String access_token;
    private String expires_in;
}

服务器部署相关(选学)

001~简单Java项目部署到腾讯云linux服务器

前面给大家讲了一个点餐系统的开发,包括java点餐后台和微信点餐小程序。可是都是教大家如何在本地把项目跑起来。今天就来教大家如何把这个点餐系统部署到服务器,实现商用。

本节知识点

  • 1,使用springboot开发java项目
  • 2,小程序后台的开发
  • 3,小程序后台部署到服务器
  • 4,java项目部署到服务器
  • 5,springboot项目部署到服务器

准备工作

  • 1,需要购买一台腾讯云服务器
  • 2,需要开发一个springboot后台项目
  • 3,需要购买一个域名,并做备案。
  • 4,需要配置你的服务器环境 jdk,mysql(下面会做讲解)

我们默认你上面的准备工作都做好了,下面我们就来开始学习把后台项目部署到服务器,让所有人都可以访问到你的服务器。

一,首先创建一个springboot(java项目)

1,创建springboot项目,选用jdk1.8

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_318


2,填写包名,选择配置,这些保持默认即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_319


3,添加一些项目依赖,使用最新springboot版本

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_320


4,项目名,项目目录设置。可以保持默认

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_321


5,导入依赖,下面两种方式都可以。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_322


6,实现一个简单的后台数据接口

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_323


如果上面这些简单的创建一个项目的步骤你不是很懂,可以看下我录制的java零基础视频:


  • 7,本地运行项目
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_324

  • 8,运行成功的标示,在run里看到控制台日志显示项目端口是 8080
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_325

  • 9,浏览器里访问本地项目,查看访问效果。可以看到我们成功的访问到了后台数据。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_326


二,项目打包

上面给大家演示的是在idea开发者工具里启动的项目,我们正常部署服务器的时候,肯定不会有开发者工具的,所以我们接下来要先学会项目打包,然后在本地通过命令行的方式运行后台项目。


  • 1,项目打包
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_327



  • 2,打包成功
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_328



  • 3,修改jar的名字(也可以不改名字,我是觉得这个jar名字太长,所以改一个短的)
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_329

  • 我这里改名为qcl80.jar 建议大家也改成这个名字,因为后面运行脚本里用的就是qcl80这个名字,大家和我保持一致,省得出问题。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_330


三,服务器环境的登录

我们前面三步,都是在自己的本地电脑启动的后台项目,这样我们只能在自己的电脑浏览器访问到,别人是访问不到的,如果想让别人访问,就需要把我的qcl80.jar这个文件传到服务器上,并且在服务器上通过命令行启动这个java项目,这样别人才可以访问到

所以我们接下来要讲服务器环境的搭建。

  • 1,首先我们要买一台云服务器(推荐阿里云或者腾讯云)

  • 2,买完服务器后我们登录服务器后台,这里以腾讯云为例。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_331



  • 3,点击登录
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_332

  • 重置密码方式
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_333



  • 4,输入实力的账号和密码,登录linux服务器
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_334



  • 5,登录成功
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_335

  • 大家不要看到一堆命令行,就头疼,我接下来会教大家如何一步步配置服务器环境的。大家只需要跟着我的步骤,一步步来就可以了。

四,linux服务器安装jdk

  • 1,采用yum安装jdk1.8,非常简单,下面用来查看yum库中jdk的版本
yum search java|grep jdk

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_336

安装jdk8

yum -y  install java-1.8.0-openjdk*

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_337


耐心的等待jdk的安装,大概2分钟左右,出现下面标志,即代表安装成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_338


  • 2,检查jdk是否安装成功
    命令行里输入 java -version 出现下面标示,可以看到我们的jdk版本 1.8.0_222
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_339


五,上传jar包到服务器

我们第五步已经在linux服务器上成功的安装了jdk,接下来就是要想办法把qcl80.jar传到服务器了。可能有同学要问了,你部署服务器,不要在linux服务器里安装tomcat吗,其实我们用springboot开发出来的jar包,已经有内置的tomcat了。所以我们不用再部署tomcat了,只需要把qcl80.jar这个文件上传到服务器,然后用java命令启动即可。

我们上传文件到Linux服务器用下面这个软件

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_340


你只需要去百度下你电脑对应系统的安装包,安装即可。具体怎么安装这里就不教大家了。

下面教下大家如何使用FileZilla上传文件到服务器。

1,打开FileZilla软件, 链接服务器

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_341


2,去服务器根目录看看

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_342


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_343


3,上传文件到home文件里,如果在父亲根目录没有home文件,可以自己新建。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_344


到这里我们就成功的上传qcl80.jar到服务器了。下面就教大家如何在服务器里启动我们的项目。

六,在服务器里启动java后台项目

1,首先重复上面第四步登录服务器。然后在服务器里输入

cd..    #用来返回服务器根目录 
ls      #显示当前根目录有那些文件

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_345

cd home     #进入home文件
ls          #显示home文件里都有那些子文件,可以看到我们的qcl80.jar

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_346

2,启动java项目

java -jar qcl80.jar

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_347

3,项目启动成功,出现下面的标示,即代表项目启动成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_348


4,访问我们服务器的项目

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_349


通过上图可以看到,我们通过公网ip+8080端口,可以成功的访问到我们服务器的数据了。


  • 我们再用手机浏览器试试
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_350

  • 可以看到我们在手机浏览器里也可以访问到后台数据了。你把上面的这个网址发给你朋友,你朋友应该也可以访问到数据了。
    到这里我们就成功的把一个java项目部署到服务器,并成功的可以让任何人访问了,但是有个问题,你用公网ip做域名,很容易被封的,基本上能成功访问几次以后,就会被拒绝访问了

所以我们接下来还要讲解如何通过域名访问我们的服务器

我会把这些录制成视频来给大家做讲解,


七,服务器绑定域名

我们在做域名绑定之前,需要你先自己去注册一个域名,比如我注册的域名是:“www.saibanmall.com”,我这里还是以腾讯云为例


  • 1,登录腾讯云后台,找到自己的域名列表,点击解析
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_351



  • 2,添加解析规则
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_352



  • 3,绑定自己服务器的公网ip到解析规则
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_353



  • 4,我们主要设置下面两个解析规则
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_354

  • 这样把我们服务器公网ip和域名绑定以后,就可以通过域名访问我们的服务器了,效果如下。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_355

  • 再来看下手机浏览器访问的效果
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_356


还有我们小程序访问的效果。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_357

到这里我们就成功的部署好我的后台服务器了,但是还有几个问题

  • 1,小程序上线的话需要https请求,所以我们后面还会讲我们的服务器如何支持https
  • 2,我们通过java -jar qcl80.jar部署的java项目,不能后台运行。所以我们后面还会讲如何让我们的java项目常驻后台运行。

八,java项目在服务器后台长期运行

我们通过上面的方法,会有一个问题,就是我们命令行窗口关闭时,会导致java项目停止,所以我们要通过脚本实现java项目在后台长期运行。

springboot生成的jar在阿里云的linux服务器后台运行

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_358


通过创建stop.sh , start.sh ,run.sh这三个脚本文件来实现后台长久运行springboot

这里我把运行的qcl80.jar ,start .sh,stop.sh ,run.sh都放在home下的jar目录下

  • 1,创建stop.sh

vim stop.sh 创建文件然后把下面内容复制进去,一定要把qcl80.jar替换成你的jar

#!/bin/bash
PID=$(ps -ef | grep qcl80.jar | grep -v grep | awk '{ print $2 }')
if [ -z "$PID" ]
then
    echo Application is already stopped
else
    echo kill $PID
    kill $PID
fi
  • 2,创建start.sh,

这里我们用80端口,这样可以直接通过ip访问,不用再输端口了
vim start.sh 输入这个命令后然后把下面的内容复制进去

#!/bin/bash
nohup java -jar qcl80.jar --server.port=80 &
  • 3,创建run.sh

整合了关闭和启动的脚本:run.sh,由于会先执行关闭应用,然后再启动应用,这样不会引起端口冲突等问题,适合在持续集成系统中进行反复调用。
把下面内容复制进去,一定要注意复制时不能少东西

#!/bin/bash
echo stop application
source stop.sh
echo start application
source start.sh
  • 4,start .sh,stop.sh ,run.sh都创建后

./run.sh 运行run.sh脚本

如果遇到没有权限运行的问题,就在run.sh所在目录下执行

chmod u+x *.sh 这样就ok了。

执行完以后,我们可以去nohup.out文件中查看启动的log

cat nohup.out 这个命令可以查看jar启动的log

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_359


这个时候我们的项目就启动了,就可以通过下面这个网址访问项目了:http://saibanmall.com/上面start.sh,stop.sh,run.sh如果觉得写起来麻烦的话,也可以直接获取我写好的。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_360

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_361


002~java配置ssl证书实现https请求

上一节给大家讲了服务器的部署,正常的http请求都可以实现了,但是我们做小程序开发时需要用到https,所以这一节要教大家如何让自己的后台服务器实现https请求。这节是以java部署服务器并配置https为例,别的语言可以把这篇文章作为参考。

我们实现https必须先具备下面条件

1,申请一个ssl证书(阿里云腾讯云都可以免费申请)
2,有一台自己的服务器(阿里云腾讯云都可以)

一,申请ssl证书

这里以腾讯云为例,我们首先要登录自己的腾讯云服务器,然后进入ssl证书申请页。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_362


然后选择免费的ssl证书,申请即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_363


给证书绑定域名,一个证书只能绑定一个顶级域名或者二级域名。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_364


证书申请成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_365

二,下载ssl证书

点击下载证书后,会得到一个压缩包,解压后可以看到每种服务器对应的证书,选择自己的即可。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_366


我们看下tomcat对应的文件都有什么

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_367

把证书放到我们项目里

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_368

三,springboot项目配置ssl证书

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_369


代码给大家贴出来

#https加密端口号 443
server.port=443
#SSL证书路径 一定要加上classpath:
server.ssl.key-store=classpath:2501902696.jks
#SSL证书密码(密码在第一步的keystorePass.txt中)
server.ssl.key-store-password=x6qm42y4auvhh
#证书类型
server.ssl.key-store-type=JKS

配置好以后,我们就可以使用maven打包了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_370


打包完成后,我们把打包好的jar包改下名字

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_371


改名完成后,我们通过FileZilla 把这个jar包上传到服务器。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_372


上面上个脚本是我提前定义好的,我的上一篇文章里有讲怎么定义脚本文件,这三个脚本是为了我们的项目可以长期运行在后台用的。

四,进入服务器,部署项目。

点击登录,登录服务器

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_373


进入服务器对应的目录

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_374


我们通过执行 ./run.sh 来运行项目, 如果遇到没有权限运行的问题,就在run.sh所在目录下执行 chmod u+x *.sh 这样就ok了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_375


通过上图可以看到,我们成功执行来 run.sh脚本。

然后执行下面命令可以查看我们项目是否成功启动

tail -f nohup.out

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_376

五,访问https

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_377


通过上图我们可以看到,我们成功的访问到了https。到这里我们的https就配置好了,然后把我们的域名配置到小程序里就可以直接在小程序里使用https了。

003~腾讯云Linux服务器安装Mysql8并实现远程访问

上一节已经给大家讲解了我们java项目,也就是微信小程序后台项目部署到腾讯云服务器,但是呢,我们服务器肯定要装mysql数据库吧,要不然我们的数据放哪里呢,所以这一节来教大家如何在linux服务器里安装mysql数据库,并做一些数据库常见的配置。

一,首先还是登录到我们的服务器

服务器如何登录我在上一节已经讲过了,大家只需要去看我上一节课程即可。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_378


然后通过下面命令行,检测服务器上是否安装过mysql

rpm -qa|grep mysql

如果安装过,可以通过下面命令卸载删除

rpm -e --nodeps mysql-libs

二,下载并安装mysql

  • 1,检查服务器是否已经安装过mysql
yum list installed mysql*

出现下图所示,代表没有安装过

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_379

  • 2,安装mysql源
sudo wget https://repo.mysql.com//mysql80-community-release-el7-1.noarch.rpm
  • 3,下载mysql rpm源
wget http://repo.mysql.com/mysql57-community-release-el7-8.noarch.rpm

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_380

  • 4安装下载好的rpm包
sudo rpm -ivh mysql80-community-release-el7-1.noarch.rpm

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_381

  • 5安装mysql,发现提示,y到底
sudo yum install mysql-server

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_382

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_383


凡是让输入的地方,都输入y

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_384


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_385

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_386

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_387


有的地区服务器安装mysql比较慢,只能耐心等待了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_388

出现下面标志,代表安装成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_389

  • 6,查看下mysql的版本,确定是否安装成功
mysql -V

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_390

可以看出我们安装的mysql版本是5.7.27

  • 7,运行mysql
service mysqld start

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_391


查看是否启动

service mysqld status

出现下面箭头所示,代表已经启动mysql

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_392

  • 8,取得mysql初始化随机密码
grep "password" /var/log/mysqld.log

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_393


可以看到我们的初始密码是 l>KbWhk6K&+Y

  • 9,登录mysql
mysql -uroot -p'l>KbWhk6K&+Y'

记得把l>KbWhk6K&+Y换成你自己的密码。下面代表登录成功。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_394

  • 10,更改root密码
alter user user() identified by '你的新密码';

(“需要带数字,大写字母,小写字母,特殊符号”)如我设置密码为 Qc123456!

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_395

设置密码永不过期

ALTER USER 'root'@'localhost' PASSWORD EXPIRE NEVER;

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_396


一定要记得执行下面代码刷新MySQL的系统权限相关表

flush privileges;

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_397

三,设置mysql可以远程访问

默认情况下,我们的mysql只可以在服务器的本地访问,远程是没法访问的,今天就来教大家如何设置mysql的远程访问。


  • 1,同样还是先登陆mysql,这时登陆记得用我们新设置的密码。
    如我们的mysql -uroot -p’Qc123456!’ 这里的Qc123456!就是我的新密码
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_398

  • 2,登陆成功后用 show databases; 来显示所有的数据库
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_399

  • 3,use mysql; 来更改管理员信息
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_400

  • 4,select user,host from user; 查询所有的管理员
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_401

  • 5, update user set host = ‘%’ where user = ‘root’; 更新root用户的本地访问为% ,即代表可以远程访问。通常情况下我们的root用户应该只能本地访问,但是我们今天是为了学习方便,所以就设置root可以远程访问了。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_402

  • 6,设置完,一定要记得 flush privileges;刷新下权限。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_403

  • 7,再来看user表,root后面的信息就改变了。
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_404


四,添加mysql数据库的子管理员

我们上面直接用root来操作数据库,有些危险,所以我们再来教大家添加一个子管理员。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_405


如上图所示:

1,添加用户名为xiaoshitou,密码为Xiaoshitou123!的子用户

create user 'xiaoshitou'@'%' identified with mysql_native_password by 'Xiaoshitou123!';

2,设置xiaoshitou这个用户可供远程访问

grant all privileges on *.* to 'xiaoshitou'@'%' with grant option;

3,刷新权限

flush privileges;

可以看到我们的xiaoshitou用户的host也变成了 %

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_406


4,可以看到我们的xiaoshitou子用户也可以供远程访问了(远程访问前,要记得设置下服务器的安全组,下面第五步有讲)

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_407


后面的生产环境里我们也可以给这个xiaoshitou用户设置一些权限,比如只可以增加和修改mysql数据库,不可以删除数据。。。。

五,设置完以后不要忘记设置你服务器的安全组

出站和入站规则都要设置3306端口

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_408


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_409

六,idea远程访问服务数据库。


  • 1,进入mysql链接
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_410



  • 2,输入信息链接服务器mysql数据库
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_411



  • 3,查看链接效果
  • Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_412


到这里我们就完整的在linux服务器里安装好mysql了,并且可以通过远程访问到。


004~部署点餐系统到腾讯云服务器

经过前面几节的学习,我们在腾讯云Linux服务器上成功的安装了jdk8,mysql8,并且教会了大家如何配置ssl证书实现https,今天我们就来正式的部署点餐系统到linux服务器,这里以腾讯云服务器为例。

准备工作

  • 1,linux服务器安装jdk8
  • 2,linux服务器安装mysql8
  • 3,申请ssl证书,配置https
  • 4,要有一个备案的域名
    上面这几条我前面的章节和视频都有讲解过,大家翻下我的文章,或者去看下我的视频:《点餐系统,java后台+点餐小程序》 上面的准备工作都做好以后,我们就来开始正式的部署工作了。

一,申请并下载ssl证书

这里以腾讯云为例,我们首先要登录自己的腾讯云服务器,然后进入ssl证书申请页。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_413


然后选择免费的ssl证书,申请即可

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_414


给证书绑定域名,一个证书只能绑定一个顶级域名或者二级域名。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_415


等待审核,证书申请成功后点击下载

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_416


下载解压后有下面几个,我们使用Tomcat

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_417


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_418


把证书放到我们项目里的resources目录下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_419

二,配置ssl证书到点餐项目里

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_420


把上图的配置代码贴出来给大家,一定要注意,根据代码上的注释来配置。

server:
  #https加密端口号 443
  port: 443
  #SSL证书路径 一定要加上classpath:
  ssl:
    key-store: classpath:xiaoshitou.jks
    #SSL证书密码(密码在第一步的keystorePass.txt中)
    key-store-password: pa2pzzb8436
    #证书类型
    key-store-type: JKS

同时数据库的账号和密码记得改下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_421

三,打包项目成jar包

我们这里使用maven打包

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_422


等待项目打包

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_423


打包成功

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_424


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_425


把jar包改名为qcl443,为后面部署做准备

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_426

四,通过FileZilla把jar包和443运行脚本上传到服务器

通常服务器有个home目里,我们把jar包和脚本文件放到home目里下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_427

五,登陆服务器,创建数据库和表

1,到服务器后台,点击登陆

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_428


2,登陆mysql

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_429


qcl.sql里的语句

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_430


3,把我们qcl.sql里的sql语句复制到控制台,执行如下

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_431


然后按ctrl+z,退出mysql命令行

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_432


然后cd …回到我们的跟目里

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_433


也可以直接 cd …/home 进入我们的home目录里

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_434

六,执行脚本运行项目

进入home目里后,可以看到我们之前传的qcl443.jar和脚本文件,然后执行 ./run.sh

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_435


通常会遇到上图所示,没有权限的问题,这个时候我们 在目录下执行 chmod u+x *.sh 这样就ok了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_436


然后再执行 ./run.sh 就可以执行脚本,启动项目了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_437


然后再输入 tail -f nohup.out查看执行日志

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_438

七,配置出站和入站规则

在安全组里添加443端口的出站和入站规则

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_439


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_440

八,域名绑定公网ip

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_441


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_Java_442


这些都处理好以后,就可以通过https链接访问点餐后台了

九,访问演示

这样我们熟悉的登陆页面,就部署成功了,外界就可以访问我的程序了。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_443


登陆后台后,记得添加一个轮播图片,下面小程序演示时会用到

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_444

https://www.pyjwyx.com/diancan/leimu/list这个是我一个学生的,大家可以用这个访问下点餐后台试试。你自己部署的时候,一定要记得把下面的XXX换成你自己的域名 https://XXX/diancan/leimu/list

十,小程序里演示

1,在app.js里把baseUrl配置为

https://你的域名/diancan

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_445


2,先勾选不校验https

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_spring boot_446


3,然后就可以看到我们访问到了后台配置的轮播图数据

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_小程序_447

十一,小程序配置安全域名

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_448


如果我们的不校验https没有勾选,就会报下面的错误

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_449


本地调试不校验https没事,但是我们要上线小程序的话,必须校验小程序,所以,我接下来需要把我们的域名配置到小程序安全域名里。

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_450


添加域名到request里,如我的是 www.pyjwyx.com和pyjwyx.com

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_451


Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_微信点餐_452

可以看到我们的域名已经添加到了request合法域名里

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_453


这样我们就可以成功的加载到数据了

Java后台微信点餐小程序2023年最新版笔记Springboot+Mysql+Freemarker+Bootstrap_点餐小程序_454


然后点餐系统就可以提交发布了。

到这里我们的点餐系统和点餐小程序就可以成功的供外界使用了



标签:Java,java,Bootstrap,点击,mysql,后台,服务器,最新版,我们
From: https://blog.51cto.com/u_14368928/8120836

相关文章

  • Idea编译/运行Java程序慢
    修改前:修改后:参考:https://www.jjput.com/archives/macbookpro14m1mavenslowcompilation问题JDK尽量不要换版本classlombok.javac.apt.LombokProcessor(inunnamedmodule@0x267d00eb)cannotaccessclasscom.sun.tools.javac.processing.JavacProcessingEnvi......
  • Java语言基础知识梳理与总结
    导语:Java作为一门广泛应用于软件开发领域的编程语言,具备强大的功能和灵活性。本篇博客将对Java语言的基础知识进行梳理与总结,包括标识符、运算符、流程控制、循环结构、分支结构、数组、方法、类与对象等相关知识点,帮助读者快速掌握Java基础。目录:1.标识符2.运算符3.流程控制......
  • 详解Java ArrayList
    ArrayList简介ArrayList是List接口的实现类,底层基于数组实现,容量可根据需要动态增加,相当于动态数组。ArrayList继承于AbstractList,并且还实现了Cloneable、Serializable、RandomAccess接口。List:表明是列表数据结构,可以通过下标对元素进行添加删除或查找。Serializable:表示可......
  • Java异常机制和 JavaSE 总结
    Java异常机制和JavaSE总结1.什么是异常​ 1.1检查性异常用户错误​ 1.2运行时异常代码运行的异常​ 1.3ERROR不时代码的问题,可能时内存问题2.Throwable异常的超类(error||exception)![](https://img2023.cnblogs.com/blog/808616/202311/808616-20231101114143316......
  • Java导入Jsoup库做一个有趣的爬虫项目
    Jsoup库是一款Java的HTML解析器,可用于从网络或本地文件中获取HTML文档并解析其中的数据。它可以模拟浏览器的行为,获取网页中的数据,是Java爬虫中常用的工具之一。与浏览器相比,Jsoup库的主要区别在于它不会执行JavaScript代码,因此无法获取通过JavaScript生成的内容。使用Jsoup库进行......
  • 二、3、java基础之流程控制语句
    一、顺序结构根据代码的书写顺序进行执行代码二、选择结构      if选择语句:格式1:if(关系表达式){语句体;}格式2:if(关系表达式){语句体1;......
  • Java流程控制_03死循环、循环嵌套
    1、死循环 2、循环嵌套 ......
  • JavaScript 的力量
    JavaScript是一个超越React领域的强大力量。虽然React在现代Web开发中的受欢迎程度是不可否认的,但了解JavaScript的多功能性和实际应用程序是基础。用于事件处理和DOM操作等,JavaScript的统治地位远远超出了React;它是现代网络开发的基石。这些扩展示例展示了其在事件......
  • Java关于stream处理数据的一些操作
    classUserPo{  privateStringname;  privateDoublescore;} List<UserPo>list=newArrayList<>();    list.add(newUserPo("小一",10.d));    list.add(newUserPo("小五",50.d));    list.add(newUserPo(......
  • java for循环内部使用线程
    /***1、业务场景* 1、定时执行时,可能出现数据量大,执行不完,线程直接被终止掉,丢数据。*/importjava.util.ArrayList;importjava.util.List;importjava.util.concurrent.ExecutorService;importjava.util.concurrent.Executors;/***1、首先创建线程池,针对线程池开......