SpringBoot和Ajax阶段总结

王继福

1.Springboot基本配置合信息
首先,需要sts(Spring Tools Suit)专为Spring开发定制的,方便创建调试运行维护Spring应用。jdk(1.8)。tomacat不需要配置,因为sts内置了一个tomcat。但要配置maven,在windos下的偏好里陪着一下,搜索maven,配置下user settings和installations
image.png
创建项目:

创建springboot项目需要联网,因为他会去spring官方去下载资源(当然也可以去阿里云里下载。)这里需要注意的是,阿里那边版本最高是2.3.0,所以需要手动修改版本号。在创建时你可以根据自己的需要去下载额外的配置依赖。这里说一个坑,在引入mybatis时,一定要在resources下的配置文件中去配置数据库信息
![image.png](/img/bVbMxQZ)

否则会在启动时报一个url找不到的错误。
如果运行时出现这种界面且没有明显报错说明创建项目没有问题了。
image.png
HikariCP
image.png
用户通过DataSource对象的getConnection()方法,获取一个连接。假如池中有连接,则直接将连接返回给用户。假如池中没有连接,则会调用Dirver(驱动,由数据库厂商进行实现)对象的connect方法从数据库获取,拿到连接以后,可以将连接在池中放一份,然后将连接返回给调用方。
springboot整合了mybatis和spring mvc吗
整合了
image.png
不需要我们手动配置只需要将你需要的依赖勾选上。

注解总结
下面会讲解做项目时经常用到的一些注解:
首先解释下springboot注解作用,注解可以理解为一个标记,
不同的注解是不同的标记,旨在告诉springboot框架在读到这些标记后要做些什么是
@SpringBootApplication底层使用了组件扫描启动类标记
@Mapper被此标记的类或接口需要被mybatis管理
@Service
@Compont
@Controller以上三个被修饰的类会被spring管理,他们的对象有spring创建和管理
@Autowired自动装配依赖注入
@Qualifier后接参数,一般用于描述创建指定参数的对象
@RequestMapping路径映射
@ResponseBody指定返回的是字符串
@PathVariable是用来赋予请求url中的动态参数,即:将请求URL中的模板变量映射到接口方法的参数上
以及dao层用注解方式写sql语句的那些注解。
还有lombok的注解会在后面讲解。

2.业务流程
此处讲解讲解建立在视图层采用thymeleaf而不是ajax的基础上。
MVC三层架构
image.png
在此图中pojo,service,以及service.impl属于M层有实体model和业务model, dao稍微特殊一点,如果你以三层架构的方式理解就将其理解为model层,或者可以理解为独立于三层架构的持久层。
controller是控制层,在template文件夹下的html页面属于V视图层。
image.png

给你一个增删改查的任务,你该如何下手。从任务执行上来说
C->M->dao->V 但是从写代码的逻辑角度却有些不同,暂时不考虑界面。则需要先写dao,增删改查需要定义相应的方法,dao直接访问数据库所以方法需要在dao层写。sql映射有2中方式xml配置和注解形式,但是一个方法只能用一种映射。(对了在此之前需要先写pojo对象封装数据类型)完成后,转入model业务层,定义接口,定义实现类
接口中需要包含dao层所定义的方法,实现类重写。同时依赖注入,属性是dao的实现类对象类型。这样业务实现类就和持久层发生关系。
写完之后,转入控制层首先需要依赖注入,属性是业务接口实现类的对象类型。定义方法执行业务。注意其映射路径和返回值。映射路径是执行该方法的路径,一般会在视图层被表单或者按钮或者其他跳转路径所用到。而控制层方法返回值一般是页面,这写页面用的是视图层的html页面。再说视图层,需要根据控制层的方法(有时候会通过model带数据给页面)作出相应页面调整。这里不再多说可以自己去看项目。

3插件总结
这里就按照老师在进阶阶段所说的三个插件来总结。
3.1健康检查
在spring boot框架中可以添加健康检测这一功能,此插件能检测整个项目的运行状态及其相关属性。首先需要在pom.xml添加有关actuator的依赖。添加成功之后输入localhost:8080/actuator/health

即可查看整个项目的状态。正常状态是status up,在配置文件下输入
management.endpoints.web.exposure.include=*后 可以查看更多资源的健康信息(具体内容参照手册),为了更好的查看可以在谷歌上安装一个jsonview插件。除了输入网址这种查看方式还可以在boot dashboard上右击show properties查看。点进之后有许多选项可以查看健康信息。
3.2热部署配置

在springboot框架中当修改类服务端代码后需要重启服务器才能正确的进行两端通讯。但有时需要频繁的修改服务端代码,此时为了不手动的重启服务器可以导入devtools等依赖。但是此种方法会导致频繁重启服务器而造成的cpu浪费。所以可以在项目中将自动刷新选项取消掉,在改完所有代码后重新构建项目后会重启一次服务器。热部署的

3.3lombok
第三方插件,在创建pojo对象时有时候模块很多,pojo对象也很多,这样需要重复并大量的写起get set以及tostring等等方法。引入lombok可以有效解决这一问题。现在pom文件引入lombok,然后根据文件所在磁盘位置找到lombok.jar文件,用cmd在java环境下打开并安装至sts。之后就能用其功能。但注意新建项目后,需要在新项目的配置文件在引入lombok依赖即可(不需要再次安装了)。常用的lombok注解有@Data @Setter @Getter @ToString等
坑:image.png
image.png
如果第二个图中配置路径不对或者包含中文或其他特殊字符
会导致sts打不开。需要修改这里的配置。

4.Ajax基础
Ajax 全称Asynchronous JavaScript and XML,是一种web应用技术。主要特点是异步请求和局部刷新。
试想一下一个界面在不使用Ajax的条件下,只有一个主线程解析页面。当发送请求后,该线程需要等待
服务器处理结束才能执行后续解析工作。等待的时间就会造成页面阻塞。这样用户体验非常不好。而现在,
使用Ajax后,主线程会开一个分线程给Ajax引擎,让Ajax引擎去请求服务器,而主线程去加载剩余页面。
image.png
image.png
Ajax工作流程 4步:
image.png
上例是发送的get请求,如果是post请求,还需要在open后send前添加此句: xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
同时send中还需要添加发送过去的参数。
5.Ajax进阶
虽然说是Ajax进阶,其实是js的进阶。Ajax的发送就是上面提到的那四步。但是当发送的Ajax不止一个,有多个时,会造成html结构混乱,代码可读性差,以及不利于维护。所以需要对Ajax进行封装。封装的具体细节这里不再赘述(其实我自己本身暂时还没有完全掌握还需要再花点时间再看看),但最后实现的效果是将Ajax封装在一个独立的js文件中(可以是封装进函数里,也可以是对象里,建议用对象进行封装),需要用到的时候在html页面引入js文件。直接以对象.方法的形式来调用Ajax。
如果封装的过程是造车的话,现阶段不需要我们完全掌握。那么调用的过程就是开车的过程,这是我们把握的重点。
这里用jquery和axios来举例说明调用Ajax。
当引入jquery后,可以
image.png
如果是get请求需要将type类型改为GET。

axios一个js编写的基于promise的http库,一般用来发送get,post请求。
image.png
这是axios发送get请求
image.png
这里有坑,最好将参数封装进对象去发送和返回不让会出现返回为null的结果。
6.错误总结
6.1springboot阶段错误总结
常见错误类型:400,404,500,未实现需要的结果。
400 参数类型不匹配 根据错误提示检查要求的参数和输入的值类型,数量是否匹配,在现阶段着重看日期。
500 服务器的错误,这种错误会在服务端console里有提示,大家根据错误的类型,以及结合老师上课时的讲解来查询。
404 浏览器资源找不到,这种一般不会有错误提示,但是一般集中在路径错误,可以检查映射路径是否匹配。
未实现需要的效果,最笨最直接的方法是把老师代码copy过来一行一行对。其他方式,检查控制台输出的日志结合个人理解先将未实现效果的地方缩小。然后打断点调试,有时候打着打着就能直接看出代码哪里写错了。
6.2 Ajax阶段错误总结
这一阶段主要写了许多前段代码,但是前段代码错误提示功能太少,不利于我们排错。很多时候都是每个单词写错了或者某个括号多加或少加了。
同样的发生上面这些错误后404 检查路径等,500看错在哪一行。如果这些不能检查出来就用老师的三个方法:
日志,debbuger,排除法
日志是console.log一般写在方法里对关键步骤打桩输出语句,如果某一个日志输出的信息不是我们想要的那么就锁定错误元了基本上。
debbuger在方法上写下这个代码,运行后在界面按f12进入debuge模式,此时可以打断点调试。
排除法,在js代码里先去掉一部分代码当然需要记住这些被去掉的代码执行的什么功能。运行看结果,是否与自己预想的一样,循环此操作找出与自己预想不一样的地方锁定错误源。

阅读 1.7k
7 声望
3 粉丝
0 条评论
7 声望
3 粉丝
文章目录
宣传栏