前言
记录学习过程
前面已经完成了SSM框架的搭建
现在来实现一个登录验证功能
步骤
- 在数据库建一个login表
输入几个用户数据:
- 根据数据库属性创建实体类loginUser;
package com.ssm.entity;
public class loginUser {
private int id;
private String loginName;
private String loginPwd;
public loginUser(){};
public loginUser(int id, String loginName, String loginPwd) {
this.id = id;
this.loginName = loginName;
this.loginPwd = loginPwd;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getLoginName() {
return loginName;
}
public void setLoginName(String loginName) {
this.loginName = loginName;
}
public String getLoginPwd() {
return loginPwd;
}
public void setLoginPwd(String loginPwd) {
this.loginPwd = loginPwd;
}
@Override
public String toString() {
return "LoginUser{" +
"id=" + id +
", loginName='" + loginName + '\'' +
", loginPwd='" + loginPwd + '\'' +
'}';
}
}
- 在pom.xml里配置运行需要的包
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>com.ssm</groupId>
<artifactId>ssm</artifactId>
<packaging>war</packaging>
<version>1.0-SNAPSHOT</version>
<name>ChatRobot Maven Webapp</name>
<url>http://maven.apache.org</url>
<properties>
<!-- 设置项目编码编码 -->
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<!-- spring版本号 -->
<spring.version>4.3.5.RELEASE</spring.version>
<!-- mybatis版本号 -->
<mybatis.version>3.4.1</mybatis.version>
</properties>
<dependencies>
<!-- java ee -->
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-api</artifactId>
<version>7.0</version>
</dependency>
<!-- 单元测试 -->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.12</version>
</dependency>
<!-- 实现slf4j接口并整合 -->
<dependency>
<groupId>ch.qos.logback</groupId>
<artifactId>logback-classic</artifactId>
<version>1.2.2</version>
</dependency>
<!-- JSON -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.8.7</version>
</dependency>
<!-- 数据库 -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.41</version>
<scope>runtime</scope>
</dependency>
<!-- 数据库连接池 -->
<dependency>
<groupId>com.mchange</groupId>
<artifactId>c3p0</artifactId>
<version>0.9.5.2</version>
</dependency>
<!-- MyBatis -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>${mybatis.version}</version>
</dependency>
<!-- mybatis/spring整合包 -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>1.3.1</version>
</dependency>
<!-- Spring -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-core</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-beans</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-tx</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-web</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>${spring.version}</version>
</dependency>
<dependency>
<groupId>commons-beanutils</groupId>
<artifactId>commons-beanutils</artifactId>
<version>1.9.4</version>
</dependency>
<dependency>
<groupId>commons-collections</groupId>
<artifactId>commons-collections</artifactId>
<version>3.2</version>
</dependency>
<dependency>
<groupId>commons-lang</groupId>
<artifactId>commons-lang</artifactId>
<version>2.5</version>
</dependency>
<dependency>
<groupId>commons-logging</groupId>
<artifactId>commons-logging</artifactId>
<version>1.2</version>
</dependency>
</dependencies>
<build>
<finalName>ChatRobot</finalName>
<plugins>
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<configuration>
<!-- 设置JDK版本 -->
<source>1.8</source>
<target>1.8</target>
</configuration>
</plugin>
</plugins>
</build>
</project>
Maven会自动帮我们装配好,等待下载
- 写好了实体类,再完成持久层Dao
创建持久层的接口LoginUserDao:
@Param注解声明参数,与mapper属性对应
package com.ssm.dao;
import com.ssm.entity.LoginUser;
import org.apache.ibatis.annotations.Param;
import org.springframework.stereotype.Repository;
@Repository
public interface LoginUserDao {
public LoginUser login(@Param("loginName") String loginName,
@Param("loginPwd") String loginPwd);
}
在mapper包下创建LoginDao.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.ssm.dao.LoginUserDao">
<!-- 设置为loginUserDao接口方法提供sql语句配置 -->
<select id="login" resultType="LoginUser" parameterType="String">
select * FROM login where loginName=#{loginName} and loginPwd=#{loginPwd}
</select>
</mapper>
到这里对数据库的操作已经完成,接下来就是运用数据库取出的数据
- 业务层Servcie
创建接口LoginService
package com.ssm.service;
import com.ssm.entity.LoginUser;
public interface LoginService {
public LoginUser login(String loginName, String loginPwd);
}
以及它的实现类:LoginServiceImpl
package com.ssm.service.impl;
import com.ssm.dao.LoginUserDao;
import com.ssm.entity.LoginUser;
import com.ssm.service.LoginService;
import org.springframework.stereotype.Service;
import javax.annotation.Resource;
@Service("loginService")
public class LoginServiceImpl implements LoginService {
//注入loginUserDao的bean
@Resource
private LoginUserDao loginUserDao;
@Override
public LoginUser login(String loginName, String loginPwd) {
return loginUserDao.login(loginName,loginPwd);
}
}
业务层的意思是将输入的LoginName和LoginPwd注入持久层
- 测试类测试底层逻辑
@Autowired
private LoginUserDao loginUserDao;
@Test
public void testLogin(){
String loginName="zhangsan";
String loginPwd="111";
LoginUser loginUser=loginUserDao.login(loginName,loginPwd);
System.out.print(loginUser.toString());
}
测试:
结果可知业务层、持久层逻辑正确,根据LoginName、LoginPwd可以得到一个LoginUser对象
- 编写控制层UserController
通过控制层接收前端发来的请求,并响应给前端
@RequestMapping(value = "/login",produces = {"text/plain;charset=utf-8", "text/html;charset=utf-8"})
@ResponseBody
public String login(@RequestParam("loginName") String loginName,
@RequestParam("loginPwd") String loginPwd, HttpServletResponse response) throws IOException{
//根据请求中的数据得到LoginUser对象
LoginUser result=this.loginService.login(loginName,loginPwd);
//响应编码UTF-8
response.setCharacterEncoding("UTF-8");
//如果得到的对象不为空,发出true
if (result!=null){
return "true";
}
else return "false";
}
控制层完成,它向前端发送了true或false
- 前端-表现层
index,jsp实现前后端结合
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>test</title>
</head>
<script>
function selectUser() {
//ajax实现前后端结合
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("test").innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open("POST", "user/showUser", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.send("id=1");
}
</script>
<body>
<p id="test">Welcome</p>
<button type="button" onclick="selectUser()">onclick test</button><br>
<form>
loginName:<input type="text" id="loginName"><br>
loginPwd:<input type="text" id="loginPwd"><br>
<input type="button" onclick="login()" value="提交">
</form>
<script>
function login() {
var loginName=document.getElementById("loginName").value;
var loginPwd=document.getElementById("loginPwd").value;
//ajax实现前后端结合
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "/user/login", true);
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xmlhttp.onreadystatechange = function () {
//如果响应成功
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
//得到响应数据
var data=xmlhttp.responseText;
var obj=JSON.parse(data);
if(obj==true)
alert("登录成功")
else
alert("登录失败")
}
}
xmlhttp.send("loginName="+loginName+"&loginPwd="+loginPwd);
}
</script>
</body>
</html>
- 测试
成功!!