SpringMVC03 基础操作续与几个简单的交互

这篇具有很好参考价值的文章主要介绍了SpringMVC03 基础操作续与几个简单的交互。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前文

第一篇

第二篇

基础操作

上篇博客我们知道了如何获取Session内容以及传输数组,json,对象,集合等的传送和获取

这节课我们可以从上篇的结束开始,其实Spring对Session进行了进一步的封装,我们可以使用其他的方式也可以读取和设置Session(更简洁的方式)

1.直接使用HTTPSession

@RequestMapping("/r16")
    public String getR(HttpSession session) {
        String name = (String) session.getAttribute("name");
        return "name:"+name;
    }

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

2.使用注解方式

@RequestMapping("/r17")
    public String getR2(@SessionAttribute("name")String name) {
        return "name:"+name;
    }

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

3.获取Header信息

 @RequestMapping("/r18")
    public String getHeader(HttpServletRequest request){
        String UserAgent = request.getHeader("User-Agent");
        return "获取信息UserAgent:"+UserAgent;
    }

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

4.@Controller与@RestController的区别与演示

我们可以理解为@RestController = @Controller + @ResponseBody

这里我们又要谈到MVC的事情了

我们知道这里的C指的是Controller

@RestController是一个复合注解  

@Controller 含义是定义一个控制器,交给Spring管理

@ResponseBody 表示返回的是一个非视图内容,可以是html/text内容

我们可以理解为Controller默认是返回一个视图html页面

然后加上@ResponseBody注解时返回一个html/text内容

所以我们之前使用@RestController返回的就是一个text内容

我们可以先尝试一下

我们如果直接使用RequestController来修饰类,这里显示就是默认使用text表示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
  <h1>这是一个测试</h1>
</body>
</html>
@RequestMapping("/r19")
    public String getIndex(){
        return "index_test.html";
    }

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

这里如果我们去掉@RequestBody这里就可以看到一个正常的html页面

@Controller
public class RequestController1 {

    @RequestMapping("/r20")
    public String hello() {
        return "/index_test.html";
    }

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

这里如果使用的@Controller就是直接返回一个html页面,如果找不到文件就直接报错

@Controller
public class RequestController1 {

    @RequestMapping("/r20")
    public String hello() {
        return "/idex_test.html";
    }
}

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

我们只是将文件名修改了一下,并没有返回字符串而是直接报错了

注:这里如果放的是html代码也会被识别

5.返回json对象

@RequestMapping("r21")
    @ResponseBody
    public HashMap<String,String>  getJson() {
        HashMap<String,String> map = new HashMap<>();
        map.put("a","b");
        map.put("c","d");
        map.put("e","f");
        return map;
    }

注意:这里的@RequestBody一定要加上

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

这里是我们抓包的结果

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

6.设置状态码

其实我们可以看到平常200OK的页面情况可以转成任意的状态码

这里我们也可以侧面知道状态码是不一定靠谱的

这里其实是设置成功的,却返回了这个内容

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

这也就意味着我们设置header中的任何字段其实都是可以获取的

2.简单前后端交互小练习

1.加法器

开始是这个页面

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

<!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>

我们希望可以得到返回一个结果的页面

这里涉及到的最重要的就是设计URL,设计参数等等,也就是接口设计

我们这里设计URL为 /calc/sum

参数则是两个Integer数字,接下来我们开始从后端实现接口

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

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

2.实现登录页面的跳转

设计接口

后端只负责返回数据

首先我们这里是为了实现一个html页面的跳转,设置账号密码都是admin,最后来进行跳转

输入成功则

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

输入失败则

SpringMVC03 基础操作续与几个简单的交互,Spring,spring,java-ee,前端

我们先来实现后端代码

1.设计接口

对于第一个前端页面

设置url : /user/login

参数 userName,password

返回 true false  表示密码正确或者失败

对于第二个前端页面

url:/user/index

无参数

返回值是userName

2.编写代码

后端主要是获取两个输入框中的值进行判断,然后提供一个用户名信息

所以这里我们使用session来进行传递,session进行获取就行

后端代码

@RestController
@RequestMapping("/user")
public class UserController {
    @RequestMapping("/login")
    public Boolean login(String userName, String password, HttpSession session){
        if(!StringUtils.hasLength(userName) || !StringUtils.hasLength(password)) {
            return false;
        }
        //判断账号密码是否正确
        if("admin".equals(userName) && "admin".equals(password)) {
            //设置Session
            session.setAttribute("userName",userName);
            return true;
        }
        return false;
    }

    @RequestMapping("/index")
    public String getUserName(@SessionAttribute("userName") String userName) {
        return userName;
    }
}
<!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"
          }else {
            alert("用户名或密码错误");
          }

        }
      });
    }

  </script>
</body>

</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 (result){
                $("#loginUser").text(result)
            }
        });
    </script>
</body>

</html>

然后我们就可以得到想要的结果了文章来源地址https://www.toymoban.com/news/detail-842075.html

到了这里,关于SpringMVC03 基础操作续与几个简单的交互的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • SpringMVC-03

    开发模式:前后端分离 【重点】 可以在多个端打开 混合开发 一般只用浏览器打开 返回视图 转发和重定向 返回json数据 //@RestController 作用相当于@Controller 和 @ResponseBody 写了这个就不用写这两个 返回静态资源处理

    2024年02月03日
    浏览(31)
  • C++OpenCV(3):基础交互(视频与鼠标操作)

    🔆 文章首发于我的个人博客:欢迎大佬们来逛逛 🔆 OpenCV项目地址及源代码:点击这里 openCV中使用鼠标的交互的函数是: setMouseCallback 可以使得 激活 对 winname 为标题的窗口进行 onMouse 回调函数执行的鼠标交互操作,并且可以传递用户自定义变量给 userdata 关于MouseCallBack回调

    2024年02月16日
    浏览(35)
  • 《QT从基础到进阶·十六》QT实现客户端和服务端的简单交互

    QT版本:5.15.2 VS版本:2019 客户端程序主要包含三块:连接服务器,发送消息,关闭客户端 服务端程序主要包含三块:打开消息监听,接收消息并反馈,关闭服务端 1、先打开服务端监听功能 2、点击客户端connect连接服务端 3、在客户端输入消息点击send发送到服务端 4、在服务

    2024年02月03日
    浏览(36)
  • Js水几个基础知识点:数组的操作,字符串和数组之间的互转,持续补充,欢迎关注

    一、插入 / 删除元素: 我们就不从创建开始讲了,那个太基础了,js创建数组一般都直接let arr = […,…,…],有部分仁兄喜欢new Array(…, …, …),这样看起来可能高级点,结果是一样的哈。 这里我们直接来讨论插入元素: 1、在末尾插入 / 删除元素(push / pop,操作原数组)

    2024年02月09日
    浏览(59)
  • 100天精通Python丨基础知识篇 —— 03、Pycharm快捷操作和配置指南(磨刀不误砍柴工)

    工欲善其事,必先利其器。  -- 鲁迅 西红柿先为大家介绍 pycharm的 基本配置、快捷键、import包等 ,然后再正式开始知识学习。 目录 🍅 一、Pycharm 常用快捷键 ♣ 二、Pycharm 骚操作

    2024年02月03日
    浏览(61)
  • SpringMVC | SpringMVC中的 “JSON数据交互“ 和 “RESTful设计风格“

    作者简介 :一只大皮卡丘,计算机专业学生,正在努力学习、努力敲代码中! 让我们一起继续努力学习! 该文章 参考学习教材 为: 《Java EE企业级应用开发教程 (Spring + Spring MVC +MyBatis)》 黑马程序员 / 编著 文章以课本知识点 + 代码为主线,结合自己看书学习过程中的理解和

    2024年04月10日
    浏览(48)
  • SpringMVC06:Json交互处理

    目录 一、什么是JSON? 二、代码测试 1、新建一个module,SpringMVC-05-json,添加web支持和lib包 2、在index.jsp中编写测试内容 3、配置tomcat,启动项目,在浏览器中打开,查看控制台输出  4、controller返回JSON数据 5、代码优化 1、乱码统一解决 2、返回json字符串统一解决 六、测试集合

    2024年02月08日
    浏览(44)
  • Linux简单基础操作指令

           这个显示的是当前系统的有效用户,通俗来说等同于查看当前登录系统的人是谁        这个命令重点在于查看当前有哪些用户登录到了本台机器上。它会列出所有登录用户的相关信息。(由于我的系统是用的Ubuntu虚拟机,所以就没有别的登录人员信息)     

    2024年02月08日
    浏览(40)
  • 【SpringMVC】集成Web、MVC执行流程、数据响应、数据交互

    SpringMVC确实很麻烦,零碎的点太多 在Spring的学习中,我们知道在IOC容器中获取Bean时要通过获取上下文的方式 (new ClasspathXmlApplicationContext),这样我想在不同的地方获取Bean我得重新加载配置文件,应用上下文的对象也被创建了多次, 造成所谓的“硬编码”问题。 如何解决?

    2023年04月27日
    浏览(37)
  • opencv进阶03-图像与鼠标的交互示例

    在处理图像时,可能需要与当前正在处理的图像进行交互。OpenCV 提供了鼠标事件,使用户可以通过鼠标与图像交互。鼠标事件能够识别常用的鼠标操作,例如:针对不同按键的单击、双击,鼠标的滑动、拖曳等。 例如,用户单击鼠标,我们就画一个圆。通常的做法是,创建

    2024年02月12日
    浏览(65)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包