1.准备controller文件(路径与之前controller路径同)
![](https://img-blog.csdnimg.cn/img_convert/54e77ae53e6dfd9150616a5324293613.png)
![](https://img-blog.csdnimg.cn/img_convert/8ae1b56d4c76c5251c415d467db1f591.png)
2.准备前端页面
![](https://img-blog.csdnimg.cn/img_convert/32cecd85d4c1b03de946e9af3743152b.png)
前端页面Html文件与controller中请求路径进行对应
![](https://img-blog.csdnimg.cn/img_convert/06708a8c28c127568fb277f956168099.png)
3.准备一个简单的前端页面
![](https://img-blog.csdnimg.cn/img_convert/bbd371ef69086e6fd9e5c747c3a86bc9.png)
渲染前端界面,引入jquery和js(我使用Thymeleaf 语法)
![](https://img-blog.csdnimg.cn/img_convert/60d6764111ab9939fd4832fe5ebf65bf.png)
使用ajax异步提交请求,但是无法成功
![](https://img-blog.csdnimg.cn/img_convert/bc68047f31db25f41e804e88b9fc849b.png)
4.解决无法请求成功问题,因为若依自带了安全框架shiro,需更改对应的过滤器配置(ShiroConfig.java)文件
![](https://img-blog.csdnimg.cn/img_convert/0d4c686da8bb62a66170320cd77c1e05.png)
5.权限问题(若不需要,取消@RequiresPermissions注解)
![](https://img-blog.csdnimg.cn/img_convert/1253c8aeaae2955dadc33b2e1f2b3dec.png)
6.添加成功
7.删除操作(默认方法无根据id删除,只有批量删除,需自行进行修改)
![](https://img-blog.csdnimg.cn/img_convert/aa5d11afccf8bbe8b04ba52f24e6af27.png)
添加前端删除请求
![](https://img-blog.csdnimg.cn/img_convert/3d0d40beb7934969661f6fd4c13fe354.png)
8.删除成功
9.修改,查询操作(同增删)
![](https://img-blog.csdnimg.cn/img_convert/168499c62c830d4ff3f11af30df43ffb.png)
![](https://img-blog.csdnimg.cn/img_convert/24d3d39bb2d4d9d384cb46f356d63627.png)
10.最后展示
![](https://img-blog.csdnimg.cn/img_convert/cf3c0169de2c9239e0fe59c68744f020.png)