728x90

유효성 검사

join.jsp

form taglib 추가

 

 

form 태그 작업

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> <!-- URI 수정 -->
<c:set var="root" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>우리반 화이팅~~! 아쟉!♥</title>
    <link rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
</head>
<body>
<c:import url="/WEB-INF/views/include/top_menu.jsp"/>
<div class="container" style="margin-top: 100px">
    <div class="row">
        <div class="col-sm-3"></div>
        <!-- 부트스트랩 그리드 옵션 -->
        <div class="col-sm-6">
            <div class="card shadow">
                <div class="card-body">
                    <form:form action="${root}/user/join_pro" method="post" modelAttribute="joinBean">
                        <form:hidden path="existId"/>
                        <div class="form-group">
                            <form:label path="user_name">Name</form:label>
                            <form:input type="text" class="form-control" path="user_name"/>
                            <form:errors path="user_name" style="color:red"/>
                        </div>

                        <div class="form-group">
                            <form:label path="user_id">ID</form:label>
                            <div class="input-group">
                                <form:input class="form-control" path="user_id" onkeypress="resetUser()"/>
                                <div class="input-group-append">
                                    <button type="button" class="btn btn-dark" onclick="chexistId()">
                                        Duplicate Check
                                    </button>
                                </div>
                            </div>
                            <form:errors path="user_id" style="color:red"/>
                        </div> <!-- form-group 닫기 -->

                        <div class="form-group">
                            <form:label path="user_pw">Password</form:label>
                            <form:password path="user_pw" class="form-control"/>
                            <form:errors path="user_pw" style="color:red"/>
                        </div>

                        <div class="form-group">
                            <form:label path="user_pw2">Password Check</form:label>
                            <form:password path="user_pw2" class="form-control"/>
                            <form:errors path="user_pw2" style="color:red"/>
                        </div>

                        <div class="form-group">
                            <div class="text-right">
                                <button type="submit" class="btn btn-dark">Join</button>
                            </div>
                        </div>
                    </form:form>
                </div>
            </div>
        </div>
    </div>
</div>

<c:import url="/WEB-INF/views/include/bottom_menu.jsp"/>
</body>
</html>

 

User

에 유효성 검사 추가

package kr.bit.beans;

import lombok.Getter;
import lombok.Setter;

import javax.validation.constraints.Pattern;
import javax.validation.constraints.Size;

@Getter
@Setter
public class User {

    private int user_idx;

    @Size(min=2, max=4)
    @Pattern(regexp = "[가-힣]*")
    private String user_name;

    @Size(min=4, max=10)
    @Pattern(regexp = "[a-zA-Z0-9]*")
    private String user_id;

    @Size(min=4, max=10)
    @Pattern(regexp = "[a-zA-Z0-9]*")
    private String user_pw;

    @Size(min=4, max=10)
    @Pattern(regexp = "[a-zA-Z0-9]*")
    private String user_pw2;

    private boolean existId;
}

UserController (비즈니스 로직)

package kr.bit.controller;

import kr.bit.beans.User;
import kr.bit.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.*;

import javax.validation.Valid;

@Controller
@RequestMapping("/user")
public class UserController {

//    @Autowired
//    private UserService userService; //컨트롤러 전후 단계 = 비즈니스 로직(Service)


    @GetMapping("/modify")
    public String modify() {
        return "user/modify";
    }

    @GetMapping("/logout")
    public String logout() {
        return "user/logout";
    }

	@GetMapping("/login")
	public String loginGet() {

		return "user/login";
	}

    @PostMapping("/login")
    public String loginPost() {
        return "user/login";
    }


    @GetMapping("/join")
    public String join(@ModelAttribute("joinBean") User joinBean) {  //상단메뉴 - 회원가입
        return "user/join";
    }
    @PostMapping("/join_pro")
    public String join_pro(@Valid @ModelAttribute("joinBean") User joinBean, BindingResult result) {
        if(result.hasErrors()){
            return "user/join";
        } // 에러있음 - 원래 회원 가입 폼

//        userService.addUser(joinBean);


        return "user/join_success";
    }
}

 

유효성검사 실행 화면

error.properties

# user_name errors
Size.joinBean.user_name=Please enter between 2 and 4 characters.
Pattern.joinBean.user_name=Please use only Korean characters.

# user_id errors
Size.joinBean.user_id=Please enter between 4 and 10 characters.
Pattern.joinBean.user_id=Please use only alphanumeric characters.

# user_pw errors
Size.joinBean.user_pw=Please enter between 4 and 10 characters.
Pattern.joinBean.user_pw=Please use only alphanumeric characters.

# user_pw2 errors
Size.joinBean.user_pw2=Please enter between 4 and 10 characters.
Pattern.joinBean.user_pw2=Please use only alphanumeric characters.

 

ServletAppcontext

추가한 프로퍼티를 불러올 수 있도록 아래 코드 추가

@Bean
public ReloadableResourceBundleMessageSource messageSource() {
    ReloadableResourceBundleMessageSource res =
            new ReloadableResourceBundleMessageSource();
    res.setBasename("/WEB-INF/properties/error");
    return res;
}

error.properties가 적용된 모습

UserValidator

비밀번호 유효성 검사

package kr.bit.validator;

import kr.bit.beans.User;
import org.springframework.validation.Errors;
import org.springframework.validation.Validator;

public class UserValidator implements Validator {

    @Override
    public boolean supports(Class<?> clazz) {
        return User.class.isAssignableFrom(clazz);
    }

    @Override
    public void validate(Object target, Errors errors) {

        User user=(User)target;
    String beanName=errors.getObjectName();

    //join.jsp에서 폼에 데이터 입력 -> modelAttribute로 User클래스의 필드에 데이터 값이 저장되어 있는 상태

    if(beanName.equals("joinBean")) {

        if(user.getUser_pw().equals(user.getUser_pw2())==false) {
            errors.rejectValue("user_pw", "NotEqual");
            errors.rejectValue("user_pw2", "NotEqual");
        }

        //비밀번호와 비밀번호확인이 같아야된다. 유효성 검사하는 애노테이션이 따로 없음 -> 개발자가 정의해야함(커스터마이징)

    }

}
}

 

error.properties

비밀번호 유효성 에러 메세지 추가

# Password matching errors
NotEqual.joinBean.user_pw=Password and password confirmation do not match.
NotEqual.joinBean.user_pw2=Password confirmation and password do not match.

 

 

UserController

에 아래코드 추가

@InitBinder
public void initBinder(WebDataBinder binder) {
    
    UserValidator v1 = new UserValidator();
    binder.addValidators(v1);
}

 

@InitBinder

@InitBinder 애너테이션은 특정 컨트롤러 클래스의 메서드에 적용되어, 해당 컨트롤러에서 사용하는 바인더를 초기화할 때 사용된다.
주로 요청 파라미터를 특정 객체에 바인딩할 때, 바인딩 방식이나 유효성 검사기를 설정하는 데 사용된다.

 

 

아이디 유효성 검사

UserDao

package kr.bit.dao;

import kr.bit.mapper.UserMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Repository;

@Repository
public class UserDao {

    @Autowired
    private UserMapper userMapper;

    public String existId(String user_id) {
        return userMapper.existId(user_id);
    }

}

UserService

package kr.bit.service;

import kr.bit.dao.UserDao;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class UserService {

    @Autowired
    private UserDao userDao;

    public boolean existId(String user_id) {

        String user_name=userDao.existId(user_id);
        if(user_name==null) {
            return true; // 사용할 수 있는 아이디면
        }
        return false;
    }
}

컨트롤러에 RestTestController 추가

 

RestTestController

package kr.bit.controller;

import kr.bit.service.UserService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RestController;

//restAPI는 보통주소로 보냄
@RestController
public class RestTestController {

    @Autowired
    private UserService userService;

    @GetMapping("/user/chexistId/{user_id}")
    public String existId(@PathVariable String user_id) {

       boolean chk=userService.existId(user_id);
       return chk+"";

    }
}

Spring MVC에서 RESTful 웹 서비스를 구현한 예시이다.

RestTestController 클래스는 REST API 엔드포인트를 정의하고, 주어진 user_id가 존재하는지 확인하는 기능을 제공한다

실제로 aaaa를 만든적이 없지만 위와같이 확인하면 ID값이 확인이 가능하다

 

아이디 중복확인

ajax를 사용해서 아이디 중복사용 체크

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> <!-- URI 수정 -->
<c:set var="root" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>우리반 화이팅~~! 아쟉!♥</title>
    <link rel="stylesheet"
          href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
    <script> function chexistId(){
        let user_id =$("#user_id").val()

        if(user_id.length==0){
            alert("Please enter your ID")
            return
        }
        $.ajax({
            url:'${root}/user/chexistId/'+user_id,
            type:'get',
            dataType:'text',
            success:function(result){
                if(result.trim()=='true'){
                    alert('You can use this ID')
                    $('#existId').val('true')
                }
                else{
                    alert('You can not use this ID')
                    $('#existId').val('false')
                }
            }
        })
    }
    </script>
</head>
<body>
...

<c:import url="/WEB-INF/views/include/bottom_menu.jsp"/>
</body>
</html>

중복확인 알림창 출력

User에 아래 코드 추가

    public User() {
        this.existId = false; // 중복검사 미실시 한것으로 초기화 해줌
    }
}

 

UserValidator 에 아래 코드 추가

   }
    if(beanName.equals("joinBean")){
        if(user.isExistId()==false){
            errors.rejectValue("user_id", "NotCheck");
        }
    }
}
}

 

error.properties 에 에러메세지 추가

NotCheck.joinBean.user_id=Please check for duplicate ID.

 

아이디 중복확인을 위한 function 추가

join.jsp

<script> function chexistId(){
    let user_id =$("#user_id").val() //입력한 아이디 가져옴

    if(user_id.length==0){
        alert("Please enter your ID")
        return
    }
    $.ajax({
        url:'${root}/user/chexistId/'+user_id,
        type:'get',
        dataType:'text',
        success:function(result){
            if(result.trim()=='true'){
                alert('You can use this ID')
                $('#existId').val('true')
            }
            else{
                alert('You can not use this ID')
                $('#existId').val('false')
            }
        }
    })
    
    function resetUser(){
        $('#existId').val('false')
    }
}
</script>

 


DB에 data 저장하기

UserMapper

package kr.bit.mapper;

import kr.bit.beans.User;
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Select;

public interface UserMapper {

    @Select("select user_name from user_table where user_id=#{user_id}")
    String existId(String user_id);

    //db에 삽입
    @Insert("insert into user_table(user_name, user_id, user_pw) values(#{user_name}, #{user_id}, #{user_pw})")
    void addUser(User joinBean);

}

UserDao

맨 밑 코드 추가

package kr.bit.service;

import kr.bit.beans.User;
import kr.bit.dao.UserDao;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

@Service
public class UserService {

    @Autowired
    private UserDao userDao;

    public boolean existId(String user_id) {

        String user_name=userDao.existId(user_id);
        if(user_name==null) {
            return true; // 사용할 수 있는 아이디면
        }
        return false;
    }

    public void addUser(User joinBean) {
        userDao.addUser(joinBean);
    }

}

 

 

UserController 에 주석처리 되어있던것들을 다시 활성화

package kr.bit.controller;

import kr.bit.beans.User;
import kr.bit.service.UserService;
import kr.bit.validator.UserValidator;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.WebDataBinder;
import org.springframework.web.bind.annotation.*;

import javax.validation.Valid;

@Controller
@RequestMapping("/user")
public class UserController {

    @Autowired
    private UserService userService; //컨트롤러 전후 단계 = 비즈니스 로직(Service)


    @GetMapping("/modify")
    public String modify() {
        return "user/modify";
    }

    @GetMapping("/logout")
    public String logout() {
        return "user/logout";
    }

    @GetMapping("/login")
    public String loginGet() {

       return "user/login";
    }

    @PostMapping("/login")
    public String loginPost() {
        return "user/login";
    }


    @GetMapping("/join")
    public String join(@ModelAttribute("joinBean") User joinBean) {  //상단메뉴 - 회원가입
        return "user/join";
    }
    @PostMapping("/join_pro")
    public String join_pro(@Valid @ModelAttribute("joinBean") User joinBean, BindingResult result) {
        if(result.hasErrors()){
            return "user/join";
        } // 에러있음 - 원래 회원 가입 폼

        userService.addUser(joinBean); //db에 삽입 (insert)
        return "user/join_success";
    }
    @InitBinder
    public void initBinder(WebDataBinder binder) {

        UserValidator v1 = new UserValidator();
        binder.addValidators(v1);
    }

}

join_success

<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> <!-- URI 수정 -->
<c:set var="root" value="${pageContext.request.contextPath}"/>

<script>
    alert("Success Join");
    location.href="${root }user/login";
</script>

 

728x90

+ Recent posts