一、前后端链接简介
前端页面,通过Servlet、JSP等技术规范,和后端代码联系。其中,Tomcat已经封装了Servlet、JSP等技术规范,而SpringBoot又内置了Tomcat,启动SpringBoot时相当于自动部署好了Tomcat,于是使用SpringBoot就可以实现前后端链接。
总结前后端链接的逻辑就是:
前端页面-Servlet/JSP等技术规范-Tomcat封装这些技术规范-SpringBoot内置部署Tomcat-后端代码放入SpringBoot项目中
那么具体的技术细节是什么样的呢?是这样的:
前端页面交给浏览器展示,浏览器通过HTTP协议,发送请求和响应给Web服务器,而Servlet/JSP等技术规范就遵循HTTP协议,保证请求、响应的传输。Web服务器比如Tomcat就封装了解析这些请求、响应的技术,以便能展示给后端。而具体解析的一些过程,就由一些包实现。最终,SpringBoot项目实现了这些的包的统一管理。于是,SpringBoot成为了前后端链接实现中非常重要的一个框架。
具体总结就是:
(前端页面:浏览器)-(Servlet/JSP等技术规范:HTTP协议)-(Tomcat封装这些技术规范-SpringBoot内置部署Tomcat:前端控制器和后端控制器)-(后端代码放入SpringBoot项目中:前端控制器和后端控制器的代码)
可能具体还是有一些偏差,但大致可以这么理解。
Web服务器中,还可以细分为DispatcherSevlet等的前端控制器,以及处理这些前端控制器解析完的数据的后端控制器,比如什么XXXController。下面我们就将要使用DispathcerServlet中的HttpServletRequest对象,实现原始方式的简单参数在前后端中的传递。
二、原始方式解析简单参数,实现前后端链接
前面说过,DispatcherServlet包含了HttpServlet,即包含了HttpServletRequest、HttpServletResponse。我们就使用HttpServletRequest对象,来实现原始的接收简单参数。
1.写好SpringBoot中的后端代码
①首先在创建好的SpringBoot项目中,找一个与启动类不同位置下的包,写入我们的控制器类Controller。这样是避免报错。
②在类上加@RestController注解。
@RestController // 加上注解
public class RequestController {
}
③写一个加RequestMapping注解的方法。后面加上你要指定的地址。待会就通过这个访问具体的url链接地址。
@RestController
public class RequestController {
// 写入注解
@RequestMapping("/haha")
// 写入方法
public String simpleHaha() {
}
④在形参中写入HttpServletRequest对象,用于接收数据;在方法中写方法体,处理请求得到的数据。
注意:原始方式用getParameter方法只能得到字符串,必须进行转换才能得到想要的数据类型。
@RestController
public class RequestController {
@RequestMapping("/haha")
public String simpleHaha(HttpServletRequest request/*写入该对象用于接收数据*/) {
// 写入具体接收的参数
String name = request.getParameter("name");
String ageStr = request.getParameter("age");
//处理接收的参数
int age = Integer.parseInt(ageStr); // 转换格式
System.out.println(name + ":" + age); // 在后端控制台打印
}
⑤写入返回的响应。
@RestController
public class RequestController {
@RequestMapping("/haha")
public String simpleHaha(HttpServletRequest request) {
String name = request.getParameter("name");
String ageStr = request.getParameter("age");
int age = Integer.parseInt(ageStr);
System.out.println(name + ":" + age);
return "OK"; //写入返回的响应
}
2.使用Apifox写入前端传入的参数
①打开Apifox,在项目中新建接口,写入接口地址:
②写入参数。
③设置前置url。
在右上角点击弹出环境选择,点击管理环境。
把前置URL改为http://localhost:8080
选择改好的环境。(对一下你改的环境和选择的环境,不用我说吧)
点击保存。
界面变化如下。
3.进行测试
检查前端——Apifox
点击上图中的运行,查看结果。
与我们之前函数中写的return "OK";结果是一致的。
检查后端——Idea中运行的SpringBoot项目
再看控制台:
也和我们代码的逻辑符合。
System.out.println(name + ":" + age);
三、SpringBoot方法传递简单参数
其实这种方式还是复杂了,因为SpringBoot还有一个更简单的方式。具体后端代码如下:
@RequestMapping("/haha") // 注意不再传HttpServletRequest对象了
public String simpleHaha(String name, Integer age) { // 直接传入对应的参数
System.out.println(name + ":" + age);
return "OK";
}
注意事项1:前端传入的参数名字要和方法的形参名相同。
不同情况下的测试:
后端代码:
@RequestMapping("/haha")
public String simpleHaha(String username, Integer age) { // 注意这里改name为username了
System.out.println(username + ":" + age); // 注意这里改name为username了
return "OK";
}
前端传入:
报错如下:
前端没问题
后端介绍到的就是null了
如果名字不同,想要接收的情况下,可以使用@RequestParam参数进行转换。
后端代码:
@RequestMapping("/haha")
public String simpleHaha(@RequestParam(name = "name") String username, Integer age) {
System.out.println(username + ":" + age);
return "OK";
}
前端传入:
改后后端的显示情况:
但要注意,这样设置的参数,就是必须传入的。比如我这样传入后端数据:
那传入后结果如下:
前端:
后端:
这是因为,@RequestParam注解中,设置是否必须需要传入的参数required默认为true。我们设置为false后就不会这样了。
以上是注意事项2。
后端代码如下:
@RequestMapping("/haha")
public String simpleHaha(@RequestParam(name = "name", required = false) String username, Integer age) {
System.out.println(username + ":" + age);
return "OK";
}
前端传入情况如下:
得到结果:
前端:
后端:
四、总结
前后端链接需要有页面,比如Apifox模拟的;有传输,HTTP协议,具体的一套生态即实现了HTTP协议的Servlet、JSP技术,实现了Servlet、JSP等技术的Tomcat、内置部署了Tomcat的SpringBoot;有后端控制,放在SpringBoot中的Java代码。
用HttpServletRequest对象,可以实现原始方式下的简单参数传递。
用SpringBoot方法,也可以实现简单参数的传递。