原生Ajax+springBoot实现用户登录

思路：用户输入登录信息——信息传到后台——数据库查询——比较查询结果——返回登录信息（成功/失败）

html页面代码：

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>login</title>

     <script type="text/javascript" src="http://localhost:8080/ajax.js"></script>

 </head>

 <body>

 <form>

     <span>用户ID：</span><input style="margin:2px;" id="id" name="id"><br>

     <span>密码：</span><input type="password" style="margin:2px;" id="password" name="password"><br>

     <button style="margin:2px;" type="button" onclick="sumbit_name_sex()">登录</button>&nbsp;

     <button style="margin:2px;" type="reset">取消</button><br>

 </form>

 </body>

 </html>

外部ajax.js代码：

 function sumbit_name_sex() {

     var id=document.getElementById("id").value;

     var password=document.getElementById("password").value;

     var user={

         id:id,

         password:password,

     }

     //步骤一:创建异步对象s

     var ajax = new XMLHttpRequest();

     //步骤二:设置请求的url参数,参数一是请求的类型,参数二是请求的url,可以带参数,动态的传递参数starName到服务端

     ajax.open("post", "http://localhost:8080/login",true);

     ajax.setRequestHeader("Content-type","application/json; charset=utf-8");

     //步骤三:发送请求

     ajax.send(JSON.stringify(user));

     //步骤四:注册事件 onreadystatechange 状态改变就会调用

     ajax.onreadystatechange = function () {

         if (ajax.readyState == 4 && ajax.status == 200) {

             //步骤五 如果能够进到这个判断 说明 数据 完美的回来了,并且请求的页面是存在的

             console.log(ajax.responseText);//输入相应的内容

             if(ajax.responseText.length>=3){

                 alert("登录成功");

             }else{

                 alert("登录失败");

             }

             //window.location.href="";

         }else{

         }

     }

 }

后台controller层的代码：

 package com.jhc.taskmanage.controller;

 import com.alibaba.fastjson.JSONObject;

 import com.jhc.taskmanage.model.User;

 import com.jhc.taskmanage.service.UserService;

 import org.springframework.beans.factory.annotation.Autowired;

 import org.springframework.stereotype.Controller;

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

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

 import javax.servlet.http.HttpServletRequest;

 import java.io.InputStreamReader;

 import java.util.List;

 @Controller

 @RestController

 public class UserController {

     @Autowired

     private UserService userService;

     @RequestMapping("/login")

     public List<User> login(HttpServletRequest request){

         InputStreamReader inputStreamReader= null;

         String json="";

         try{

             inputStreamReader=new InputStreamReader(request.getInputStream(),"utf-8");

             char[] buff=new char[1024];

             int length=0;

             while((length=inputStreamReader.read(buff))!=-1){

                 String json_temp=new String(buff,0,length);

                 json+=json_temp;

             }

         }catch (Exception ex){

         }

         JSONObject jsonObject=JSONObject.parseObject(json);

         String id=(String)jsonObject.get("id");

         String password=(String)jsonObject.get("password");

         return userService.login(id,password);

     }

 }

service层:

 package com.jhc.taskmanage.service;

 import com.jhc.taskmanage.model.User;

 import java.util.List;

 public interface UserService {

     List<User> login(String id,String password);

 }

 package com.jhc.taskmanage.service.impl;

 import com.jhc.taskmanage.dao.UserDao;

 import com.jhc.taskmanage.model.User;

 import com.jhc.taskmanage.service.UserService;

 import org.springframework.beans.factory.annotation.Autowired;

 import org.springframework.stereotype.Service;

 import java.util.List;

 @Service

 public class UserServiceImpl implements UserService {

     @Autowired

     private UserDao userDao;

     @Override

     public List<User> login(String id,String password){

         return userDao.login(id,password);

     }

 }

dao层：

 package com.jhc.taskmanage.dao;

 import com.jhc.taskmanage.model.User;

 import org.springframework.beans.factory.annotation.Autowired;

 import org.springframework.stereotype.Repository;

 import java.util.List;

 @Repository

 public interface UserDao {

     List<User> login(String id,String password);

 }

 package com.jhc.taskmanage.dao.impl;

 import com.jhc.taskmanage.dao.UserDao;

 import com.jhc.taskmanage.model.User;

 import org.springframework.beans.factory.annotation.Autowired;

 import org.springframework.jdbc.core.JdbcTemplate;

 import org.springframework.stereotype.Repository;

 import java.util.ArrayList;

 import java.util.List;

 import java.util.Map;

 @Repository

 public class UserDaoImpl implements UserDao {

     @Autowired

     private JdbcTemplate jdbcTemplate;

     @Override

     public List<User> login(String id,String password){

         String sql="select id, name, sex, age from user where id='"+id+"' and password='"+password+"';";

         List<Map<String,Object>> list=jdbcTemplate.queryForList(sql);

         List<User> userArrayList=new ArrayList<>();

         for(Map<String,Object> map:list){

             User user=new User();

             user.setId(map.get("id").toString());

             user.setName(map.get("name").toString());

             user.setSex(map.get("sex").toString());

             user.setAge(Integer.valueOf(map.get("age").toString()));

             user.setPassword("***********************");

             userArrayList.add(user);

         }

         return userArrayList;

     }

 }

model层：

 package com.jhc.taskmanage.model;

 import org.springframework.stereotype.Component;

 @Component

 public class User {

     private String id;

     private String name;

     private String sex;

     private int age;

     private String password;

     public User(){

     }

     public String getId() {

         return id;

     }

     public void setId(String id) {

         this.id = id;

     }

     public String getName() {

         return name;

     }

     public void setName(String name) {

         this.name = name;

     }

     public String getSex() {

         return sex;

     }

     public void setSex(String sex) {

         this.sex = sex;

     }

     public int getAge() {

         return age;

     }

     public void setAge(int age) {

         this.age = age;

     }

     public String getPassword() {

         return password;

     }

     public void setPassword(String password) {

         this.password = password;

     }

 }

spring boot启动类：

 package com.jhc.taskmanage;

 import org.springframework.boot.SpringApplication;

 import org.springframework.boot.autoconfigure.SpringBootApplication;

 @SpringBootApplication

 public class TaskmanageApplication {

     public static void main(String[] args) {

         SpringApplication.run(TaskmanageApplication.class, args);

     }

 }

配置文件application.properties:

 server.port=8080

 server.servlet.context-path=/

 #spring.mvc.static-path-pattern=/

 spring.resources.static-locations=classpath:/resources/,classpath:/static/,classpath:/js,classpath:/css,classpath:/image

 spring.mvc.view.prefix=/WEB-INF/jsp/

 spring.mvc.view.suffix=.jsp

 spring.datasource.url=jdbc:mysql://localhost:3306/myproject?useUnicode=true&characterEncoding=utf-8&serverTimezone=UTC

 spring.datasource.username=root

 spring.datasource.password=mysql

 spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver

 #spring.datasource.max-idle=10

 #spring.datasource.max-wait=10000

 #spring.datasource.min-idle=5

 #spring.datasource.initial-size=5

 #server.session.timeout=10

 server.tomcat.uri-encoding=UTF-8

运行截图：

欢迎纠错，不喜勿喷

巴特西

原生Ajax+springBoot实现用户登录

最新文章

热门文章