SSM+AJAX+jsp实现登录功能

2021.4.13_SSM+AJAX开发,实现简单登录

  1. 建立User实体层

  2. UserMapper

    public interface UserMapper {
    
        //全查
        public List<User> selectAll();
    
        //登录
        public User loginCheck(@Param("username")String username,@Param("password")String password);
        
    }
    

    UserMapper.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.hy.mapper.UserMapper">
        <select id="selectAll" resultType="User">
            select * from user;
        </select>
    
        <select id="loginCheck" resultType="User">
            select * from user where username = #{username} and password =#{password};
        </select>
    
    </mapper>
    
    

    3.UserService

    public interface UserService {
    
        //全查
        public List<User> selectAll();
    
        //登录
        public User loginCheck(String username, String password);
    }
    
    

    UserServiceImpl

    package com.hy.service;
    
    import com.hy.entity.User;
    import com.hy.mapper.UserMapper;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Service;
    import java.util.List;
    
    @Service
    public class UserServiceImpl implements UserService {
    
        @Autowired
        private UserMapper userMapper;
    
        //全查
        @Override
        public List<User> selectAll() {
            List<User> users = userMapper.selectAll();
            return users;
        }
    
        //登录
        @Override
        public User loginCheck(String username, String password) {
            return userMapper.loginCheck(username,password);
        }
    }
    

    4.UserController

    package com.hy.controller;
    
    import com.hy.entity.User;
    import com.hy.service.UserService;
    import net.minidev.json.JSONObject;
    import org.springframework.beans.factory.annotation.Autowired;
    import org.springframework.stereotype.Controller;
    import org.springframework.web.bind.annotation.PathVariable;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.bind.annotation.RequestMethod;
    import org.springframework.web.bind.annotation.ResponseBody;
    import org.springframework.web.servlet.ModelAndView;
    import javax.servlet.http.HttpServletRequest;
    import javax.servlet.http.HttpServletResponse;
    import java.io.PrintWriter;
    import java.util.List;
    
    @Controller
    @RequestMapping("/user")
    public class UserController {
    
        @Autowired
        private UserService userService;
    
        //页面通用跳转方法
        @RequestMapping("/{page}")
        public String toPage(@PathVariable()String page){
            return page;
        }
    
        //全查
        @RequestMapping("/all")
        public ModelAndView selectAll(){
            ModelAndView mv = new ModelAndView();  //创建ModelAndView对象
            List<User> users = userService.selectAll();
            mv.addObject("li", users); //把查询出来的结果passenger存入ModelAndView对象中
            mv.setViewName("main"); //跳转main页面 本质是/WEB-INF/jsp/main.jsp
            return mv;
        }
    
        //登录
        @ResponseBody
        @RequestMapping("/loginCheck")
        public String loginCheck(String username,String password){
            User user = userService.loginCheck(username, password);
            if(user != null) {
                return "1";
            }
            else {
                return "0";//用户不存在
            }
        }
    }
    

    5.jsp页面

    <%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <html>
    <head>
        <title>login</title>
        <link rel="stylesheet" href="${pageContext.request.contextPath}/static/bootstrap/css/bootstrap.css">
        <script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.0.0/jquery.js"></script>
    
    </head>
    <body>
    <form class="form-horizontal">
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">用户名:</label>
            <div class="col-sm-10">
                <input type="text" class="form-control" id="inputEmail3"  name="username" >
            </div>
        </div>
        <p></p>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">密码:</label>
            <div class="col-sm-10">
                <input type="password" class="form-control" id="inputPassword3" name="password">
            </div>
        </div>
        <p></p>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" class="btn btn-default" onclick="login()">Sign in</button>
            </div>
        </div>
    </form>
    </body>
    <script>
        function login() {
            var username = $("#inputEmail3").val();
            var password = $("#inputPassword3").val();
            if (username == ""){
                alert("请输入用户名");
                return false;
            }
            else if(password == ""){
                alert("请输入密码");
             return false;
            }
            $.ajax({
                type:"post",
                url:"/user/loginCheck",
                data:{username:username,password:password},
                dataType:"json",
                success:function (msg){
                    if(msg == "1"){
                        window.location.href="/user/all";
                    }
                    else if(msg == "0"){
                        alert("用户名或密码错误");
                    }
                }
            })
        }
    </script>
    </html>
    
    
  • 3
    点赞
  • 13
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
以下是基于SSM+Shiro+Ajax+MD5的登录的详细代码: 1. 前端页面代码 login.jsp ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>登录</title> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> </head> <body> <h1>登录</h1> <form id="loginForm"> <div> <label>用户名:</label> <input type="text" name="username" required> </div> <div> <label>密码:</label> <input type="password" name="password" required> </div> <div> <label>验证码:</label> <input type="text" name="captcha" required> <img id="captchaImg" src="/captcha.jpg" alt="验证码" onclick="this.src='/captcha.jpg?'+Math.random()"> </div> <div> <input type="submit" value="登录"> </div> </form> <script> $(function() { $('#loginForm').submit(function(event) { event.preventDefault(); var formData = $(this).serialize(); $.ajax({ url: '/login', type: 'POST', data: formData, dataType: 'json', success: function(result) { if (result.success) { window.location.href = '/home'; } else { alert(result.message); $('#captchaImg').click(); } }, error: function() { alert('服务器错误,请稍后再试!'); } }); }); }); </script> </body> </html> ``` 2. 后端代码 UserController.java ```java @Controller public class UserController { @Autowired private UserService userService; @RequestMapping("/login") @ResponseBody public Result login(@RequestParam("username") String username, @RequestParam("password") String password, @RequestParam("captcha") String captcha, HttpSession session) { // 验证码校验 String realCaptcha = (String) session.getAttribute("captcha"); if (!captcha.equalsIgnoreCase(realCaptcha)) { return new Result("验证码错误!", false); } // 用户名密码校验 User user = userService.findByUsername(username); if (user == null) { return new Result("用户不存在!", false); } String md5Password = MD5Util.md5(password, user.getSalt()); if (!md5Password.equals(user.getPassword())) { return new Result("密码错误!", false); } // 登录成功,将用户信息保存到Session中 session.setAttribute("user", user); return new Result("登录成功!", true); } } ``` UserService.java ```java @Service public class UserServiceImpl implements UserService { @Autowired private UserMapper userMapper; @Override public User findByUsername(String username) { return userMapper.findByUsername(username); } } ``` UserMapper.xml ```xml <mapper namespace="com.example.mapper.UserMapper"> <select id="findByUsername" parameterType="java.lang.String" resultType="com.example.entity.User"> select * from user where username=#{username} </select> </mapper> ``` UserMapper.java ```java public interface UserMapper { User findByUsername(String username); } ``` MD5Util.java ```java public class MD5Util { public static String md5(String str, String salt) { try { MessageDigest md5 = MessageDigest.getInstance("MD5"); byte[] bytes = md5.digest((str + salt).getBytes("utf-8")); StringBuilder sb = new StringBuilder(); for (byte b : bytes) { String hex = Integer.toHexString(b & 0xff); if (hex.length() == 1) { sb.append("0"); } sb.append(hex); } return sb.toString(); } catch (Exception e) { throw new RuntimeException(e); } } } ``` ShiroConfig.java ```java @Configuration public class ShiroConfig { @Autowired private UserService userService; @Bean public ShiroFilterFactoryBean shiroFilterFactoryBean(SecurityManager securityManager) { ShiroFilterFactoryBean shiroFilterFactoryBean = new ShiroFilterFactoryBean(); shiroFilterFactoryBean.setSecurityManager(securityManager); shiroFilterFactoryBean.setLoginUrl("/login"); shiroFilterFactoryBean.setUnauthorizedUrl("/403"); Map<String, String> filterChainDefinitionMap = new LinkedHashMap<>(); filterChainDefinitionMap.put("/login", "anon"); filterChainDefinitionMap.put("/logout", "logout"); filterChainDefinitionMap.put("/**", "authc"); shiroFilterFactoryBean.setFilterChainDefinitionMap(filterChainDefinitionMap); return shiroFilterFactoryBean; } @Bean public SecurityManager securityManager() { DefaultWebSecurityManager securityManager = new DefaultWebSecurityManager(); securityManager.setRealm(realm()); return securityManager; } @Bean public UserRealm realm() { UserRealm realm = new UserRealm(); realm.setCredentialsMatcher(credentialsMatcher()); return realm; } @Bean public HashedCredentialsMatcher credentialsMatcher() { HashedCredentialsMatcher credentialsMatcher = new HashedCredentialsMatcher(); credentialsMatcher.setHashAlgorithmName("MD5"); credentialsMatcher.setHashIterations(1); return credentialsMatcher; } public class UserRealm extends AuthorizingRealm { @Override protected AuthorizationInfo doGetAuthorizationInfo(PrincipalCollection principals) { SimpleAuthorizationInfo authorizationInfo = new SimpleAuthorizationInfo(); return authorizationInfo; } @Override protected AuthenticationInfo doGetAuthenticationInfo(AuthenticationToken token) throws AuthenticationException { UsernamePasswordToken upToken = (UsernamePasswordToken) token; String username = upToken.getUsername(); User user = userService.findByUsername(username); if (user == null) { throw new UnknownAccountException("用户不存在!"); } SimpleAuthenticationInfo authenticationInfo = new SimpleAuthenticationInfo(user.getUsername(), user.getPassword(), ByteSource.Util.bytes(user.getSalt()), getName()); return authenticationInfo; } } } ``` 3. 实体类代码 User.java ```java public class User implements Serializable { private Long id; private String username; private String password; private String salt; // getter/setter方法省略 } ``` 4. 配置文件代码 application.properties ```properties server.port=8080 spring.datasource.url=jdbc:mysql://localhost:3306/test?useUnicode=true&characterEncoding=utf-8&serverTimezone=Asia/Shanghai spring.datasource.username=root spring.datasource.password=root spring.datasource.driver-class-name=com.mysql.jdbc.Driver mybatis.mapper-locations=classpath:mapper/*.xml mybatis.type-aliases-package=com.example.entity shiro.loginUrl=/login ``` 以上是基于SSM+Shiro+Ajax+MD5的登录的详细代码,其中包括了前端页面代码、后端代码、实体类代码和配置文件代码。该代码实现了基本的登录功能,包括了用户名密码校验、验证码校验、MD5加密等功能。可以根据需求进行修改和扩展。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

[猫玖]

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值