项目一众筹网01_04环境搭建_表述层springMvc的搭建、快速打开web.xml快捷键、Ajax-ResultEntity封装统一返回数据-为了方便前端工程师

表述层文章目录

37-环境搭建-表述层-各个配置文件的关系

表述层,即我们的springMvc
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

38-尚硅谷-尚筹网-环境搭建-表述层-web.xml-配置ContextLoaderListener

web.xml,逐步逐步去找比较麻烦,我们直接通过快捷键更方便
我们知道找一个类的ctrl+shift+T
那么web.xml是一个资源,同理按Ctrl+shift+R 即可以打开可视化界面,如下
在这里插入图片描述
在这里插入图片描述
想尽一切办法去提高我们的效率
在这里插入图片描述
在这里插入图片描述
这里我们对比一下代码或者拷贝一下就行了

39-尚硅谷-尚筹网-环境搭建-表述层-web.xml-配置CharacterEncodingFilter

在这里插入图片描述
在这里插入图片描述
这个就没有快捷键了,需要我们手把手配置
设置字符集
设置字符集为UTF8
在这里插入图片描述
同样的,不好配就直接拿源码复制一下,理解就行了

40-尚硅谷-尚筹网-环境搭建-表述层-web.xml-初步配置DispatcherServlet

在这里插入图片描述

41-环境搭建-表述层-web.xml-配置请求扩展名

在这里插入图片描述
在这里插入图片描述

42-环境搭建-表述层-web.xml-配置JSON请求扩展名

这里有一个小坑需要我们注意
不匹配的错误码是406
在这里插入图片描述
所以我们需要再配置一个.json的扩展名
在这里插入图片描述

在这里插入图片描述

43-环境搭建-表述层-SpringMVC配置

新建如下配置文件,并且把前置需要的架子搭起来
在这里插入图片描述
下面我们需要配置一个扫描的包
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
异常映射我们就放在上图所示的config里面
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

把spring-web-mvc.xml文件内容复制一下,用起来

44-环境搭建-表述层-测试SSM整合环境

在这里插入图片描述
在这里插入图片描述
一定要转变一个思想,以前我们没有用maven项目的时候是加一个jar包
现在用了maven本质上还是少了jar包去加jar包,但是我们的jar包是需要maven去帮我们管理
所以我们需要去加一个依赖(加一个maven帮我们管理的jar包)

在这里插入图片描述
只要servlet-api,下面那个jsp-api不要,图片截取的时候可能搞错了
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
没有这个方法那就新建就行了
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述
这个快捷键就可以快速定位到实现类去,非常方便
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
ModelMap的用法:https://blog.csdn.net/qq_26411021/article/details/79493308

然后运行项目看看,是骡子是马拉出来溜溜
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
这就说明OK了

45-环境搭建-表述层-base标签

上面那个问题,如果每次都用绝对路径可能会觉得比较烦,所以我们加一个base标签
在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

46-环境搭建-表述层-Ajax-简述

在这里插入图片描述
在这里插入图片描述
== springBoot 不建议使用jsp(但是支持,只是不建议) ==
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

47-表述层-Ajax-发送数组-方案一:@RequestBody的使用

我们继续在index.jsp里面去写,注意,不要用原生的js写,我们引入一个jquery,用jquery框架来写js代码
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
ajax请求有3种,如下:
$.get()
$.post()
$.ajax()
的区别要搞清楚
$.get() 、 $.post() 必须要是服务端成功处理了请求之后才能够用的,意思就是他们都想要状态码200(通过)
而 $.ajax()可以在服务器端处理失败以后也能用,意思就是他返回的状态码400,404也可以处理

== 所以这里我们应该使用$.ajax() ==

服务器端返回什么,浏览器端是控制不了的,浏览器端能做的是,怎么去对待服务器返回过来的数据
在这里插入图片描述
在这里插入图片描述
然后运行一下项目试试

在这里插入图片描述
说我没传参数给它
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
再改一下
在这里插入图片描述

之前那个问题怎么解决呢,明明前端传的是array,后端为啥就变成了要用array[]才能接收到
在这里插入图片描述
所以这种方案并不理想, 我们看看其他的方案

48-表述层-Ajax-发送数组-方案二

在这里插入图片描述
覆盖了,只有一个12
在这里插入图片描述
再来
在这里插入图片描述
Handler写一下
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
所以这种还是不行,除非是这种情况就可以,如下
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
这种方式的缺点就是必须你还得构造一个实体类,而这个实体类对业务还没有啥帮助,有帮助的话还好
所以也有局限性 我们再看下一种方式

49-表述层-Ajax-发送数组-方案三:优雅且完美

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
一定要设置请求体的内容类型
在这里插入图片描述
在这里插入图片描述
不需要我们加实体类,也不需要我们加[ ],是什么就是什么,所以说这种方式最完美

在这里插入图片描述

50-环境搭建-表述层-Ajax-发送复杂对象

再举个例子,这种方式的为例看看@RequestBody到底有多强大
在这里插入图片描述

在这里插入图片描述
同样的操作——新建一个科目类Subject
在这里插入图片描述
再新建一个学生实体类 Student
在这里插入图片描述
目前这些类我们都要加无参构造、有参构造、get/set
等后面我们再学另外一种技术,就可以不写get/set这些了,直接省略了

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
这么些个对象如果我们不直接传,而是一个一个传,相当的麻烦
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
实际工作中就是一般都是这样的请求体

51-表述层-Ajax-ResultEntity-代码-为了方便前端工程师和后端工程师无缝对接

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
注意,== 加上无参构造、有参构造、tostring( ) ==
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述
这个类直接用老师的,这个类很重要,以后的分布式项目都可以用,对于前后端分离的项目非常重要

52-表述层-Ajax-ResultEntity-测试

上面写了之后我们总要用一下才知道怎么样,以及到底好不好用
在这里插入图片描述
不要去返回 “success”,而是返回刚刚我们写的那个
在这里插入图片描述
那么此时页面需要改吗
肯定也是要改的,因为此时返回的就不是文本了,而是json数据了
在这里插入图片描述
在这里插入图片描述

如果 dataType 你没有改成json ,你就得自己解析,这就很麻烦,jquery能解析,为啥不让它帮我们解析呢
所以一定要改
项目运行起来看看

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
再次运行项目,就不会报错了,完美运行
在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值