springboot入门（四）：ajax实现登录

前言：博主写的时候发现，ajax请求时，url设置了doLogin不起作用，还是跳的login这个地址。后来发现拦截器是因为拦截器的原因，把doLogin这个地址拦截了。以后还是应该最后再写拦截器。好了，进入今天的主题。

配置json
因为我们运用到了json对数据进行处理，所以需要在pom文件中引入包的依赖。

<dependency><groupId>net.sf.json-lib</groupId><artifactId>json-lib</artifactId><version>2.4</version><classifier>jdk15</classifier></dependency>

书写一个User的pojo类，属性为username和password。

package com.luffykaiyuan.hello.pojo;public class User {private String username;private String password;public void setUsername(String username) {this.username = username;}public void setPassword(String password) {this.password = password;}public String getUsername() {return username;}public String getPassword() {return password;}
}

在login.jsp中添加js代码，实现ajax验证。（注意这里在以前的代码基础上修改了jQuery的地址、from表单、button的type）

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head><title>登录界面</title>
</head>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script>function login () {var username = $("#username").val().trim();var password = $("#password").val().trim();var userInfo = {username:username, password:password}$.ajax({type: 'POST',url: '/doLogin',data: {userInfo: JSON.stringify(userInfo)},dataType: 'text',error: function () {window.alert("系统错误");},success: function (data) {if (data == "success"){window.location.href = "../index";}else if(data == "fail"){window.alert("账号密码错误");}}})}
</script>
<body>
<div class="container"><div class="row clearfix"><div class="col-md-12 column"><form><div class="form-group"><label for="username">账号</label><input class="form-control" id="username" name="username"/></div><div class="form-group"><label for="password">密码</label><input type="password" class="form-control" id="password" name="password"/></div><button type="button" onclick="login()" class="btn btn-default">登录</button></form></div></div>
</div>
</body></html>

重写doLogin方法。

@RequestMapping("/doLogin")@ResponseBodypublic String ajaxLogin(@RequestParam("userInfo") String userInfo, HttpServletRequest request){JSONObject jsonObject = JSONObject.fromObject(userInfo);User user = (User) JSONObject.toBean(jsonObject, User.class);if ("123".equals(user.getUsername()) && "123".equals(user.getPassword())){HttpSession session=request.getSession();session.setAttribute("name", user.getUsername());return "success";}else {return "fail";}}

springboot入门（四）：ajax实现登录相关推荐

SpringBoot入门（四）——自动配置
本文来自网易云社区 SpringBoot之所以能够快速构建项目,得益于它的2个新特性,一个是起步依赖前面已经介绍过,另外一个则是自动配置.起步依赖用于降低项目依赖的复杂度,自动配置负责减少人工配置的工 ...
php ajax loading图片居中显示,PHP语言入门之PHP+ajax实现登录按钮加载loading效果
本篇教程探讨了PHP语言入门之PHP+ajax实现登录按钮加载loading效果,希望阅读本篇文章以后大家有所收获,帮助大家对相关内容的理解更加深入. < php+ajax实现登录按钮加载loa ...
视频教程-SpringBoot实战教程：SpringBoot入门及前后端分离项目开发-Java
SpringBoot实战教程:SpringBoot入门及前后端分离项目开发十三,CSDN达人课课程作者,CSDN 博客作者,现就职于某网络科技公司任职高级 Java 开发工程师,13blog.sit ...
【Springboot 入门培训】#18 SpringBoot Cache 缓存实现
目录 1 EhCache3 1 执行环境设置 2 Ehcache3 应用 3 Ehcache3 xml设置 2 Caffeine 3 Infinispan 1 SpringBoot嵌入式缓存 2 Ja ...
【Springboot 入门培训】# 17 WebJars + BootStrap5 常用JS组件应用
在传统的前后一体项目开发中,大部分人会使用到BootStrap加其它JS组件的配合方式来完成页面UI功能的实现.下面介绍几种常用的JS库的使用方法.代码例子下载目录 1 树形组件 1.1 TreeJ ...
【Java】SpringBoot入门学习及基本使用
SpringBoot入门及基本使用 SpringBoot的介绍我就不多说了,核心的就是"约定大于配置",接下来直接上干货吧! 本文的实例: github-LPCloud,欢迎sta ...
springboot 入门详细教程源码
转载知乎文章 gitee官方教程+开源项目 Gitee 已认证的官方帐号 1,303 人赞同了该回答推荐以 Spring Boot 教程与 Spring Cloud 教程的详细开源项目 &quo ...
SpringBoot入门建站全系列（二十七）WebSocket做简单的聊天室
SpringBoot入门建站全系列(二十七)WebSocket做简单的聊天室一.概述 WebSocket 是一种网络通信协议.RFC6455 定义了它的通信标准. WebSocket 是 HTML5 ...
SpringBoot入门到精通-SpringBoot启动流程(七)
定义自己的starter SpringBoot入门到精通-Spring的注解编程(一) SpringBoot入门到精通-SpringBoot入门(二) SpringBoot入门到精通-Spring的基 ...
SpringBoot入门（二）——起步依赖
本文来自网易云社区在前一篇我们通过简单几步操作就生成了一个可以直接运行的Web程序,这是因为SpringBoot代替我们做了许多工作,概括来讲可以分为起步依赖和自动配置.这一篇先来看看起步依赖. 项 ...

springboot入门（四）：ajax实现登录

springboot入门（四）：ajax实现登录相关推荐

最新文章

热门文章