jsp blog : ajax - id check

jspblog/src/main/java/com/example/jspblog/config/DB.java

@@ -5,6 +5,7 @@ import javax.naming.InitialContext;
 import javax.sql.DataSource;
 import java.sql.Connection;
 import java.sql.PreparedStatement;
+import java.sql.ResultSet;
 
 public class DB {
 
@@ -30,4 +31,14 @@ public class DB {
             e.printStackTrace();
         }
     }
+
+    public static void close(Connection conn, PreparedStatement pstmt, ResultSet rs) {
+        try {
+            if (rs != null) rs.close();
+            if (pstmt != null) pstmt.close();
+            conn.close();
+        } catch (Exception e) {
+            e.printStackTrace();
+        }
+    }
 }

jspblog/src/main/java/com/example/jspblog/domain/user/UserDao.java

@@ -5,6 +5,7 @@ import com.example.jspblog.domain.user.dto.JoinReqDto;
 
 import java.sql.Connection;
 import java.sql.PreparedStatement;
+import java.sql.ResultSet;
 
 public class UserDao {
 
@@ -42,4 +43,27 @@ public class UserDao {
     public void findById() { // 회원정보보기
 
     }
+
+    public int findByUsername(String username) {
+        String sql = "select * from user where username=?";
+
+        Connection conn = DB.getConnection();
+        PreparedStatement pstmt = null;
+        ResultSet rs = null;
+        if (conn != null) {
+            try {
+                pstmt = conn.prepareStatement(sql);
+                pstmt.setString(1, username);
+                rs = pstmt.executeQuery();
+                if (rs.next()) {
+                    return 1;
+                }
+            } catch (Exception e) {
+                e.printStackTrace();
+            } finally {
+                DB.close(conn, pstmt, rs);
+            }
+        }
+        return -1;
+    }
 }

jspblog/src/main/java/com/example/jspblog/service/UserService.java

@@ -1,15 +1,11 @@
 package com.example.jspblog.service;
 
-import com.example.jspblog.config.DB;
 import com.example.jspblog.domain.user.User;
 import com.example.jspblog.domain.user.UserDao;
 import com.example.jspblog.domain.user.dto.JoinReqDto;
 import com.example.jspblog.domain.user.dto.LoginReqDto;
 import com.example.jspblog.domain.user.dto.UpdateReqDto;
 
-import java.sql.Connection;
-import java.sql.PreparedStatement;
-
 public class UserService {
     private final UserDao userDao;
 
@@ -18,8 +14,7 @@ public class UserService {
     }
 
     public int 회원가입(JoinReqDto dto) {
-        int result = userDao.save(dto);
-        return result;
+        return userDao.save(dto);
     }
 
     public User 로그인(LoginReqDto dto) {
@@ -30,7 +25,7 @@ public class UserService {
         return -1;
     }
 
-    public int 아이디중복체크(String username) {
-        return -1;
+    public int 유저네임중복체크(String username) {
+        return userDao.findByUsername(username);
     }
 }

jspblog/src/main/java/com/example/jspblog/web/UserController.java

@@ -10,7 +10,9 @@ import javax.servlet.annotation.WebServlet;
 import javax.servlet.http.HttpServlet;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
+import java.io.BufferedReader;
 import java.io.IOException;
+import java.io.PrintWriter;
 
 @WebServlet("/user")
 public class UserController extends HttpServlet {
@@ -54,6 +56,16 @@ public class UserController extends HttpServlet {
             } else {
                 Script.back(response, "회원가입실패");
             }
+        } else if (cmd.equals("usernameCheck")) {
+            BufferedReader br = request.getReader();
+            String username = br.readLine();
+            int result = userService.유저네임중복체크(username);
+            PrintWriter out = response.getWriter();
+            if (result == 1) {
+                out.print("ok");
+            } else {
+                out.print("fail");
+            }
         }
     }
 }

jspblog/src/main/webapp/test/ajaxtest.jsp

@@ -12,7 +12,6 @@
         // const xhttp = new XMLHttpRequest();
         // xhttp.onreadystatechange = function() {
         //     if (this.readyState === 4 && this.status === 200) {
-        //         // document.getElementById("demo").innerHTML = this.responseText;
         //         const box = document.querySelector("#box");
         //         if (this.responseText === 'OK'){
         //             box.innerHTML = "아이디 중복"
@@ -28,7 +27,10 @@
         //     alert(data);
         // })
 
-        fetch("http://localhost:8080/jspblog/ajax").then(v => v.text()).then(v => alert(v));
+        fetch("http://localhost:8080/jspblog/ajax").then(v => v.text()).then(v => {
+            const box = document.querySelector("#box");
+            box.innerHTML = v === 'OK' ? "아이디 중복" : "아이디 사용 가능";
+        });
     }
 </script>
 </body>

jspblog/src/main/webapp/user/joinForm.jsp

@@ -3,7 +3,10 @@
 <%@ include file="../layout/header.jsp"%>
 
 <div class="container">
-    <form action="${pageContext.request.contextPath}/user?cmd=join" method="post">
+    <form action="${pageContext.request.contextPath}/user?cmd=join" method="post" onsubmit="return valid()">
+        <div class="d-flex justify-content-end">
+            <button type="button" class="btn btn-info" onclick="usernameCheck()">중복체크</button>
+        </div>
         <div class="form-group">
             <label for="username">Username:</label>
             <input name="username" type="text" class="form-control" placeholder="Enter username" id="username" required>
@@ -30,6 +33,33 @@
     </form>
 </div>
 <script>
+    let isChecking = false;
+
+    function valid() {
+        if (isChecking === false) {
+            alert("아이디 중복체크를 해주세요");
+        }
+        return isChecking;
+    }
+
+    function usernameCheck() {
+        const username = $("#username").val();
+        $.ajax({
+            type: "POST",
+            url: "/jspblog/user?cmd=usernameCheck",
+            data: username,
+            contentType: "text/plain; charset=utf-8",
+            dataType: "text"
+        }).done(data => {
+            if(data === 'ok') {
+                alert("중복되었습니다.");
+                isChecking = false;
+            } else {
+                alert("사용가능합니다.")
+                isChecking = true;
+            }
+        })
+    }
 
     function goPopup(){
         const pop = window.open("/jspblog/user/jusoPopup.jsp","pop","width=570,height=420, scrollbars=yes, resizable=yes");