前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >spring boot 登录注册 demo (三) -- 前后端传递

spring boot 登录注册 demo (三) -- 前后端传递

作者头像
千往
发布2018-01-24 10:57:19
1.4K1
发布2018-01-24 10:57:19
举报
文章被收录于专栏:不想当开发的产品不是好测试

前端页面通过thymeleaf渲染

代码语言:javascript
复制
    <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

前后端的传递关键在html上面,请看代码:

代码语言:javascript
复制
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8" />
<title>Insert title here</title>
<link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css" />
</head>
<body>
    <div class="container">
    <div class="row clearfix">
        <div class="col-md-3 column">
            <form role="form" method="POST" th:action="@{/userLogin}" th:object="${user}">

                     <label for="username">Name</label><input type="text" class="form-control" id="username" th:field="*{name}" />
      
                     <label for="password">Password</label><input type="password" class="form-control" id="password" th:field="*{password}" />
       

           <button type="submit" class="btn btn-default">Sign in</button>
            </form>
            
            <ul class="nav nav-pills">
                 <li role="presentation"><a href="register.html" class="href" target="_blank">Sign up</a></li>
            </ul>
            
        </div>
    </div>
</div>
</body>
</html>

th:action="@{/userLogin}" 表示这个form表单的action会指向/userLogin

th:object="${user}" 表示form表单的内容会以user的形式传递

th:field:"*{name}" 表示该input输入的值,也就是前端的值存储在name中

如果你在前端输入name=jwen,password=1234,当这个表单提交的时候,就会把name=jwen,password=1234存放在user中传递给/userLogin

那么看看controller层怎么接接收这个的 

代码语言:javascript
复制
    @RequestMapping(value = "/userLogin", method = RequestMethod.POST)
    String userLogin(User user, Model model) {
        boolean verify = userService.verifyUser(user);
        if (verify) {
            model.addAttribute("name", user.getName());
            model.addAttribute("password", user.getPassword());
            return "result";
        } else {
            return "redirect:/notVerify";
        }

    }

requestMapping将/userLogin绑定给userLogin方法,该方法的入参是一个User的实例,一个Model的实例

而这个User的实例,就是我们从前端传递的,就是说你在userLogin方法,可以得到前端传递的东西;

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2017-07-14 ,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档