Springboot WEB项目使用AJAX前端发送数据后台查询数据库并进行判断实现注册并登录功能！ |
您所在的位置：网站首页 › ajax显示数据库信息 › Springboot WEB项目使用AJAX前端发送数据后台查询数据库并进行判断实现注册并登录功能！ |
Springboot WEB项目使用AJAX前端发送数据后台查询数据库并进行判断实现注册并登录功能！
|
Springboot WEB项目使用AJAX前端发送数据后台查询数据库并进行判断实现注册并登录功能！
一，回顾 1，如何快速搭建一个Springboot Web项目：请点击这里 2，如何通过ajax发送数据实现后台数据库查询数据，并进行登录功能：请点击这里 二，功能实现简介 从标题就能知道，我们需要实现的是前端页面通过ajax发送数据到后台，然后后台进行数据库查询并进行逻辑判断用户是否存在，如果存在则不能进行注册并返回数据，不存在进行注册并返回数据，最后返回验证数据给前端，这时前端收到判断返回的验证数据，做出相应的动作（页面的跳转）。 三，实现注册展示，先看效果再看具体代码实现 1，此时我们的数据库User_Info表中数据为这样的，如下图 js代码 function register() { / var username =document.getElementById('username').value; if(null == username || "" == username) { alert("请输入用户名"); return; } var password =document.getElementById('password').value; if(null == password || "" == password) { alert("请输入密码"); return; } var pwd =document.getElementById('pwd').value; if(null == pwd || "" == pwd) { alert("请确定密码"); return; } $.ajax({ url : "/userRegister", type : "POST", data :{ "username":username, "password": password, "pwd":pwd}, dataType : "json", success : function(data) { //后台返回数据 if (data.status == "ok") { alert(data.message); //注册成功 window.location.href = "login.html"; }else { alert("注册失败"); } }, error:function (res) { alert("请求错误！",console.res) } }); }2,后台代码 pojo实体类和上篇一样的，不展示了，上篇链接在这里：看这篇的pojo实体类 dao层 package com.springboot.springboot.dao; import com.springboot.springboot.pojo.UserInfo; import org.springframework.data.jpa.repository.JpaRepository; import org.springframework.stereotype.Repository; import java.util.List; @Repository public interface UserDao extends JpaRepository { //定义通过用户名密码查询数据 public UserInfo findByUserNameAndPassword(String username,String password); //定义通过用户查询 public List findByUserName(String username); }Service层 package com.springboot.springboot.service; import com.springboot.springboot.dao.UserDao; import com.springboot.springboot.pojo.UserInfo; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; import java.util.List; @Service public class UserServiceImpl { @Autowired UserDao userDao; //实现通过用户名密码查询数据 public UserInfo getUser(String name,String pwd){ return userDao.findByUserNameAndPassword(name,pwd); } //实现通过用户名查询 public List getUserName(String name){ return userDao.findByUserName(name); } }最后看我们的controller层 这里我简单的介绍具体控制层的逻辑 1，获取用户发送来的数据 2，通过用户名查询数据库中表是否存在该用户名，这里用户名在表中是唯一的，存在则不能注册，不存在则可以注册。在通过用户名查询用户的时候，我用列表返回，通过返回列表的是否为空，从而判断该用户是否在表中，这里进行数据库交互的返回值非常重要，写数据访问时一定要向好返回值的类型。当然，我这里用的是列表返回可能效率不是那么的好，还有许多返回方法的。 3，通过列表判断用户是否有注册的行为，并将返回数据以josn格式返回。 4，前端做出判断，返回信息给用户。 5，over package com.springboot.springboot.controller; import com.springboot.springboot.dao.UserDao; import com.springboot.springboot.pojo.UserInfo; import com.springboot.springboot.service.UserServiceImpl; 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.RequestParam; import org.springframework.web.bind.annotation.ResponseBody; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpSession; import java.util.List; import java.util.Map; import com.alibaba.fastjson.JSON; import sun.plugin2.message.JavaReplyMessage; /** * @author ganxiang * IDE IntelliJ IDEA * @project_name and filename Springboot UserController * @date 2020/04/08 0008 14:15 */ @Controller public class UserController { @Autowired UserDao userDao; @RequestMapping("/userRegister") @ResponseBody public String userRegister(HttpServletRequest request, Map parameter,HttpSession session){ String name = request.getParameter("username"); String password = request.getParameter("password"); String pwd =request.getParameter("pwd"); System.out.println(name+":"+password+":"+pwd+password.equals(pwd)); UserInfo user =new UserInfo(); List list = userService.getUserName(name); System.out.println("查询的用户名为"+user.toString()); if (list.size()==0){ user.setUserName(name); user.setPassword(password); if (password.equals(pwd)) { session.setAttribute("userInfo", user); userDao.save(user); parameter.put("message", "注册成功"); parameter.put("status", "ok"); System.out.println("用户不存在，用户注册成功"); return JSON.toJSONString(parameter); } else { parameter.put("message", "注册失败，用户输入密码与确定密码不同"); parameter.put("status", "no"); System.out.println("用户输入密码与确定密码不同，请重新输入"); return JSON.toJSONString(parameter); } } else { parameter.put("message", "注册失败，用户存在"); parameter.put("status", "no"); System.out.println("用户存在"); return JSON.toJSONString(parameter); } } }如果觉得有帮助的，点个赞再走呗🤞🤞🤞 |
2，验证表中存在数据不能进行注册，此时输入用户名：gan 密码：123，不能注册 
同时控制台打印 
3，验证表中不存在数据不能进行注册，这里以 输入用户名：jack 密码：123456 为例，注册成功 
控制台打印信息 
此时再来刷新我们的数据库中表的数据，看数据已经注册到我们的表中了 
四，看我们的实现代码，分前端代码和后端代码 1，前端代码 HTML【本文地址】
今日新闻 |
推荐新闻 |