Spring Security 회원가입

회원가입 step1 1)회원약관 동의

header.jsp

<!-- 익명의 사용자의 경우, 로그인 하지 않은 경우 해당 -->
<sec:authorize access="isAnonymous()">
<div class="nav p-2 ${logoutvis} d-flex" style="justify-content: center; flex-wrap: nowrap;">
<a class="btn btn-primary mx-2 text-nowrap" href="/ycc/login">로그인</a>
<a class="btn btn-outline-primary text-nowrap" href="/ycc/signin/agree">회원가입</a>
</div>
</sec:authorize>

MemberController.java

// 회원약관동의
@GetMapping("/signin/agree")
public String siagree(Model m) throws Exception{

AdminDto adminDto = adminService.select();

try {
    m.addAttribute("adminDto",adminDto);
}catch(Exception e) {
    e.printStackTrace();
}

return "member/siAgree";
}

siAgree.jsp

<h4 class="pt-5">회원가입약관</h4><hr>
<form action="siForm.jsp" id="form_check" method="post">
<label for="memberInfo" class="col control-label pt-2 pb-3 fw-bold fs-5">이용약관</label>

<div class="row">
      <div class="col">
        <textarea class="form-control" rows="8" style="width: 100%;" readonly="readonly">${adminDto.join_terms }</textarea>
        <input class="inputcheck" type="checkbox" id="check1" name="check" value="check1" onclick="checkSelectAll()" />(필수)동의합니다<br />
      </div>
    </div>

    <div class="form-group">
      <label for="memberInfo" class="col control-label pt-5 pb-3 fw-bold fs-5">개인정보취급방침</label>
        <div class="col" id="memberInfo">
            <textarea class="form-control" rows="8" style="width: 100%;" readonly="readonly">${adminDto.join_privacy_terms }</textarea>
                  <input class="inputcheck" type="checkbox" id="check2" name="check" value="check2" onclick="checkSelectAll()" />(필수)동의합니다<br />
              <input class="inputcheck" type="checkbox" id="selectall" name="selectall" value="selectall" onclick="selectAll(this)" /> <b>모든 약관에 동의합니다.</b>
            </div>

      <div class="row">
        <div class="col text-center">
          <input type="button" id="button"  class="btn btn-primary" value="확인" onclick="/member/siForm">
          <a href="/ycc/" class="btn btn-secondary" role="button">취소</a>
        </div>
      </div>
</div>
</form>

siAgree.jsp


<script type="text/javascript">
$(document).ready(function(){

//모든약관을 체크해야 넘어가도록 동작
$("#button").click(function(){    
    if($("#selectall").is(":checked") == false){
        alert("필수 약관에 동의 하셔야 다음 단계로 진행 가능합니다.");
        return false;
    } 
    else if($("#selectall").is(":checked") != false){
        $(location).attr('href', '<c:url value='/signin/form'/>');
        return true;
    }
})

})


2. **회원가입 step2**
    1)회원정보 입력

- siForm.jsp
```html
<form action='<c:url value="/signin/form" />' name="signinform" method="post">
    <!-- 회원정보 입력 table -->
    <h2 class="mt-5">회원정보입력</h2>
        <hr>
            <table class="table">
                <colgroup>
                  <col width="20%">
                  <col width="60%">
                </colgroup>
                <thead>
                <!--아이디 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">아이디</th>
                        <td class="col-auto px-3"> 
                            <div class="row">
                                <input type="text" class="form-control onlyAlphabetAndNumber" id="user_id"  name="user_id"
                                  placeholder="4~15자, 영문+숫자 입력" maxlength="20" style="width: 340px;">
                                <input type="button" id="idCheckBtn" name="idCheckBtn" class="btn btn-outline-primary mx-1" value="중복확인" style="width: 100px;">
                                <!-- 중복체크 검사결과  -->
                                <span id="result"></span>  
                            </div>
                          </td>
                            </tr>

                <!-- 이름 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">이름</th>
                        <td>
                            <input type="text" class="form-control onlyHangul" id="user_name" name="user_name" placeholder="한글입력"
                            maxlength="10">
                            <span id="name_result"></span>  
                         </td>
                     </tr>

                <!-- 비밀번호 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">비밀번호</th>
                        <td>
                            <input type="password" class="form-control" id="user_pw" name="user_pw" 
                              placeholder="8~15자, 영문+숫자 입력" maxlength="20">
                            <span id="pw_result"></span> 
                        </td>
                </tr>

                <!-- 비밀번호확인 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">비밀번호확인</th>
                        <td> 
                            <input type="password" class="form-control"  id="passwordCheck" name="passwordCheck" maxlength="20">
                            <span id="pwCheck_result"></span> 
                        </td>
                </tr>

                <!-- 성별 -->
                <tr>
                <th class="col" style="vertical-align: middle !important;">성별</th>
                    <td>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="user_gender" id="radioBtnM" value="M">
                            <label class="form-check-label" for="inlineRadio1">남자</label>
                        </div>
                        <div class="form-check form-check-inline">
                            <input class="form-check-input" type="radio" name="user_gender" id="radioBtnW" value="W">
                            <label class="form-check-label" for="inlineRadio2">여자</label>
                        </div>
                            <span id="gender_result"></span> 
                    </td>
                </tr>

                <!-- 생년월일 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">생년월일</th>
                        <td class="col-auto px-3" >
                            <div class="row" id="birth_select">
                                <select class="form-select col-3 mx-1" id="birthYear" name="birthYear"  onchange="javascript:lastday();" style="width: 130px; " ></select >
                                <select class="form-select col-3 mx-1" id="birthMonth" name="birthMonth"  onchange="javascript:lastday();" style="width: 100px;" ></select>
                                <select class="form-select col-3 mx-1" id="birthDay" name="birthDay" style="width: 100px;" ></select>
                <!--            <input type="hidden" id="totalBirth" name="user_birth_date"> -->
                            </div>
                        </td>
                </tr>
                <!-- 이메일 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">이메일</th>
                       <td>
                          <div class="row mx-0">
                                <input type="text" class="form-control " style="width: 180px;"  name="email" id="email" maxlength="40">
                                <p class="col-auto fs-6" id="m_email">@</p>
                                <select class="form-select col-4 " style="width: 180px;" name="email" id="detailEmail" aria-label="Default select example">
                                  <option selected></option>
                                  <option value="naver.com">naver.com</option>
                                  <option value="gmail.com">gmail.com</option>
                                  <option value="hanmail.net">hanmail.net</option>
                                </select>
                                <button type="button" id="Auth_num" name="Auth_num" class="btn btn-outline-primary mx-1" style="width: 130px;">
                                인증번호 받기</button>
                                <!-- 이메일 합치는 자바스크립트 결과 받는 input --> 
                                <!-- 지우면 email값 못 받아옴  -->
                            <input type="hidden" id="totalEmail" name="user_email">
                            </form>
                           </div>
                            <span id="email_result"></span> 
                      </td>
                    </tr>

                <!-- 이메일인증 -->
                <tr>
                    <th class="col" style="vertical-align: middle !important;">이메일인증</th>
                      <td>
                            <input type="text" class="form-control" id="emailCheck" name="emailCheck" data-rule-required="true" placeholder="인증번호6자리"
                             maxlength="10">
                            <span id="emailCheck_result"></span> 
                         </form>
                    </td>
                </tr>
            <!-- 휴대폰 -->
            <tr>
                <th class="col" style="vertical-align: middle !important;">휴대폰</th>
                <td>
                  <input type="tel" class="form-control onlyNumber" id="phoneNumber" name="user_phone_number" 
                    placeholder="-를 제외하고 숫자만 입력하세요." maxlength="11">
                  <div class="eheck_font" id="phone_check"></div>
                  <span id="pNum_result"></span> 
                </td>
             </tr>

            <tr>
                <th class="col" style="vertical-align: middle !important;">주소</th>
                <td>
                    <div class="row mx-0">
                        <input type="text" class="col-lg-2 form-control" style="width: 180px;" id="sample6_postcode" name="user_postcode" placeholder="우편번호" required readonly="readonly">
                        <input class="btn btn-outline-primary mx-1" onclick="sample6_execDaumPostcode()" type="button" style="width: 150px;" value="우편번호검색">
                        <input type="text" class="col-lg-2 form-control" id="sample6_address" name="user_rNameAddr" placeholder="도로명주소" required readonly="readonly">
                        <input type="text" class="col-lg-2 form-control" id="sample6_detailAddress" name="user_detailAddr" placeholder="상세주소를 입력해주세요.">
                        <input type="hidden" class="col-lg-2 form-control" id="sample6_extraAddress" placeholder="참고항목.">
                    </div>
                        <span id="add_result"></span> 
                </td>
            </tr>
            </thead>
        </table>
            <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}">  
        <!-- 회원가입 & 취소 버튼 -->
        <div class="row">
            <div class="col text-center pt-5">
                <input type="button" id="button" class="btn btn-primary" onclick="nullCheck()" value="회원가입" >
                <a href="/ycc/"  class="cancle btn btn-secondary" role="button">취소</a>
            </div>
        </div>
</form>

MemberController.java


// 회원가입
@PostMapping("/signin/form")
public String siform(MemberDto dto, String user_id) {

try {
    // 비밀번호 암호화
    String inputPass = dto.getUser_pw();
    String pwd = passwordEncoder.encode(inputPass);
    dto.setUser_pw(pwd);
    //비밀번호 업데이트
    memberService.signinMember(dto);

    // 권한 insert
    memberService.insertAuth(user_id);
} catch (Exception e) {
    e.printStackTrace();
}

return "member/siComple";

}


- 비밀번호 업데이트 로직

- MemberServiceImpl.java
```java
//회원 가입
@Override   
public void signinMember(MemberDto dto) throws Exception {
    String year = dto.getBirthYear();
    String month = dto.getBirthMonth();
    String day = dto.getBirthDay();

    Date birth = Date.valueOf(year +"-"+ month +"-"+ day);
    dto.setUser_birth_date(birth);

    memberDao.signinMember(dto);
}

MemberDaoImpl.java

//회원가입_INSERT
@Override
public void signinMember(MemberDto dto) throws Exception {

session.insert(namespace + "signinMember" , dto);
}

boardMapper.xml

<!-- 회원가입 : tb_user 테이블에 회원 추가-->
<insert id="signinMember" parameterType="MemberDto" >
INSERT INTO tb_user
                (user_id, user_name, user_pw, user_gender, user_birth_date, user_email, user_phone_number, 
                user_postcode, user_rnameaddr, user_detailaddr, user_regdate, user_grade, user_social_type)
VALUES (#{user_id} ,#{user_name}, #{user_pw}, #{user_gender} , #{user_birth_date} , #{user_email} , 
                #{user_phone_number} ,#{user_postcode}, #{user_rNameAddr}, #{user_detailAddr}, now(), '일반회원', '' )
</insert>

권한 insert 로직

MemberServiceImpl.java

//권한 insert
@Override   
public int insertAuth(String user_id) throws Exception {

return memberDao.insertAuth(user_id);
}

MemberDaoImol.java

//권한 insert
@Override
public int insertAuth(String user_id) throws Exception {

return session.insert(namespace + "insertAuth" , user_id) ;
}

memberMapper.xml

<insert id="insertAuth" parameterType="String">
INSERT INTO user_auth
(user_id, auth)
VALUES(#{user_id}, 'ROLE_MEMBER')
</insert>

회원가입 완료!

회원가입 step3

siComple.jsp

<!--회원가입완료문구  -->
<form action= "member/sicomple" name="signincomple" method="post">
<div class="container w-150 ">
<div class="bg-light p-5 rounded justify-content-center text-center">
  <img src="/ycc/resources/img/joinmember/check.png" style="width: 50px; height: 50px;">
    <p class="col display-5 fs-3 fw-bold text-primary pt-4 mb-0" id="name"></p>
    <p class="col display-5 fs-3 fw-bold ">회원가입이 완료되었습니다.</p>
    <p class="fs-5"> YOUNG문화센터 회원가입을 축하합니다.<br />로그인 후 서비스를 이용하실 수 있습니다. </p>
    <a class="btn btn-primary col-4" href="/ycc/login" role="button">로그인페이지로 이동 &raquo;</a>
</div>
</div>
</form>

Berry-G / YoungCultureCenter

Spring Security 회원가입 #119