Spring Boot入门指南：轻松构建高效Spring应用（五）

最新推荐文章于 2024-07-26 12:28:02 发布

小李同学_LHY

最新推荐文章于 2024-07-26 12:28:02 发布

阅读量947

点赞数 12

文章标签： java 开发语言 spring boot intellij-idea

本文链接：https://blog.csdn.net/LHY537200/article/details/140679756

版权

一.响应

1.返回静态页面

在我们前⾯的代码例⼦中，都已经设置了响应数据,Http响应结果可以是数据,也可以是静态⻚⾯,也可以针对响应设置状态码,Header信息等.

1.新建ResponseController类

2.添加静态页面（hhh.html）

3.编写后端代码，返回这个静态页面.

为什么没有返回页面内，而是返回字符串呢？

我们尝试换一个注解

响应成功。

Q:那为什么使用注解不同则会有影响呢？

A:使用@Controller表示该类被Spring管理，默认返回视图。

使用@ResponseBody,默认返回数据.

随着互联⽹的发展,⽬前项⽬开发流⾏"前后端分离"模式,Java主要是⽤来做后端项⽬的开发,所以也就不再处理前端相关的内容了。

MVC的概念也逐渐发⽣了变化,View不再返回视图,⽽是返回显⽰视图时需要的数据.所以前⾯使⽤

@RestController的其实是返回的数据.

@Controller:定义⼀个控制器,Spring框架启动时加载,把这个对象交给Spring管理.

@ResponseBody:定义返回的数据格式为⾮视图,返回⼀个text/html信息

然后我们打开@RestController源码查看

发现@Controller是被包含在里面的，它们的关系可以这么理解

如果想返回视图的话,只需要把@ResponseBody,去掉就可以了,也就是@Controller.

使用这两个注解等同使用@RestController

使用区别：

两个注解同时使用，才可以返回数据。

强调一下。

@ResponseBody如果修饰类，则返回这个类的所有方法的数据。

如果修饰的是方法，则仅返回这个方法的数据

如果单单使用 @Controller注解，则返回不了数据

在这个方法加上@ResponseBody注解

返回数据成功。

2.返回HTML代码片段

后端返回数据时,如果数据中有HTML代码,也会被浏览器解析

通过Fiddler观察响应结果,Content-Type为text/html。

响应中的Content-Type常⻅取值有以下⼏种:

如果请求的是js⽂件,SpringMVC会⾃动设置Content-Type为application/javascript

如果请求的是css⽂件,SpringMVC会⾃动设置Content-Type为 text/css。

3.返回JSON

SpringMVC也可以返回JSON

后端⽅法返回结果为对象。

4.设置状态码

SpringMVC会根据我们⽅法的返回结果⾃动设置响应状态码,程序员也可以⼿动指定状态码通过SpringMVC的内置对象HttpServletResponse提供的⽅法来进⾏设置.

注意：状态码不影响⻚⾯的展⽰. 比如状态码404，你也可以让他正常跳转。

5.设置Header(了解)

Http响应报头也会向客⼾端传递⼀些附加信息,⽐如服务程序的名称,请求的资源已移动到新地址等,如:Content-Type,Local等.

这些信息通过@RequestMapping注解的属性来实现

先来看@RequestMapping的源码:

6.设置Content-Type

我们通过设置produces属性的值,设置响应的报头Content-Type 。

通过Fiddler来观察设置的结果:

如果不设置produces,⽅法返回结果为String时,SpringMVC默认返回类型,是text/html.

7.设置指定get请求

使用get请求

使用post请求

二.加法计算器

需求:输⼊两个整数,点击"点击相加"按钮,显⽰计算结果。

1.先写一个前端代码

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
     <form action="calc/sum" method="post">
        <h1>计算器</h1>
        数字1：<input name="num1" type="text"><br>
        数字2：<input name="num2" type="text"><br>
        <input type="submit" value=" 点击相加 ">
    </form>
</body>

</html>

2.写后端逻辑：

代码：

package com.example.demo;

import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

@RestController
@RequestMapping("/calc")
public class CalcController {
    @RequestMapping("/sum")
    public String sum(Integer num1,Integer num2){
        Integer sum = num1+num2;
        return "返回计算结果:"+ sum;
    }
}

3.在浏览器运行

期间注意的问题：

在编写后端代码时，不是自己想怎么写就怎么写，而是需要根据和前端达成的规范进行编写。

遇到问题如何解决：

三.用户登录

编写注册登陆页面，返回一个页面。

规范要求：

作为后端开放人员，我们只负责处理数据，例如我们拿到了用户验证正确需要跳转页面，我们只负责判断用户是否为true，如果是true，则返回true，跳转页面的这个过程交给前端（代码写在前端里）。

1.先定义好两个HTML问文件（index.html和login.html）

2.编写后端代码:(login接口和index接口)

代码：

package com.example.demo;

import ch.qos.logback.core.util.StringUtil;
import jakarta.servlet.http.HttpSession;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.SessionAttribute;

@RequestMapping("/user")
@RestController
public class loginController {
    @RequestMapping("/login")
    public Boolean login(String username, String password, HttpSession session){
        //参数校验
        /*检查传入的字符串str是否不为null且长度大于0。如果字符串为null或者长度为0，该方法返回false；否则，返回true。*/

//        if(username == null||username.length() == 0
//        ||password == null||password.length() == 0){
//            return false;
//        }
        //注释代码可以用下面这段代码，作用一样但更简洁。
        if(!StringUtils.hasLength(username) || !StringUtils.hasLength(password)){
            return false;
        }
        //判断密码是否正确
        //
        //使用admin参数名，以上代码虽然已经做了判空处理，username不会为null，但是要还是要养成防止为null的情况
        if("lhy".equals(username) &&"0407".equals(password)){
            //设置session,意思时如果验证成功了就需要返回当前登录的用户名
            //用户从session拿用户名
            session.setAttribute("username",username);
            return true;
        }
        return false;
    }
    @RequestMapping("/index")
    public String index(@SessionAttribute("username") String usernaem){
        //从session拿到用户名
        return usernaem;
    }


}

3.postman测试后端接口是否有问题。

4.测试没问题，编写负责页面跳转的前端代码。

5.编写index.html，后端返回true跳转index.html页面，返回false弹出警告框

login.html代码：

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>登录页面</title>
</head>

<body>
  <h1>用户登录</h1>
  用户名：<input name="userName" type="text" id="userName"><br>
  密码：<input name="password" type="password" id="password"><br>
  <input type="button" value="登录" onclick="login()">
  
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
  <script>
    function login() {
      $ajax({
        url:"/user/login",
        type:"post",
        data:{
          username:$("#username").val(),
          password:$("#password").val()
        },
        //Http响应成功
        success:function(result){
          if(result == true){
            location.href = "index.html";
            //location.assign("index.html")
          }else{
            alert("密码错误")
          }
        }
      });
    
    }
  </script>
</body>

</html>

输入错误登录：

输入正确登录：

6.编写index.html代码，登录后跳转到这个页面。

index.html代码：

<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>用户登录首页</title>
</head>

<body>
    登录人: <span id="loginUser"></span>

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
    <script>
        $.ajax({
            url:"/user/index",
            type:"get",
            success:function(loginName){
                 $("#loginUser").text(loginName);
            }
        });
    </script>
</body>

</html>

重点：