inblog logo
|
keepgoing
    SpringBoot

    [Springboot] 24 아이디 중복체크

    김호정's avatar
    김호정
    Sep 17, 2024
    [Springboot] 24 아이디 중복체크
     
    중복체크 버튼을 클릭하지 않고 회원가입을 클릭하면 못넘어가게 해야한다.
     
    notion image
    onsubmit
     
    submit을 클릭해서 액션이 일어나면,
     
    submit 이 일어나면 onsubmit의 함수를 먼저 실행한다.
    return을 true로 하면
    return을 false로 하면
    notion image
    notion image
    form 안에 버튼 만들어주기
    → type은 button으로 해줘야한다. (submit으로 하면 form이 전송되고 리로드 됨)
    notion image
    자바스크립트 변수는 타입을 모르니까
    boolean 타입인 경우 변수명을 is_ 를 붙여서 지어주면 좋다.
    ( → 이름만 보고도 어떤 타입인지 알 수 있도록 ! )
     
    <script> 바로 아래에 변수 isSameUsername = true 로 설정해 두었기 때문에 이 회원가입 form에 들어오면 무조건 true로 자동 설정된다.
     
    그리고 vaild 함수는 “중복체크버튼을 클릭했는지 검사”하는 역할을 한다. → 중복체크버튼 클릭 없이 회원가입 버튼을 클릭하는 경우를 막기 위한 것.
     
    notion image
    중복체크 버튼을 누르지 않고 회원가입을 누르면
    지금 isSameUsername의 default 값이 true 이기 때문에
    위의 alert 창이 뜬다.
     
     
    통신. 컨트롤러 작성하기
    notion image
    userController
     
     
    notion image
    쿼리는 기존에 있는거 쓰면 됨
     
    notion image
    받으면서 무조건 throw 날리면 안 됨. 못찾은 경우에도 return 해줘야하니까!!!!!
     
    자 이제 컨트롤러에 와서 받은 boolean 값을 return 하면 되는데 지금
     
    @GetMapping("/user/samecheck") public ResponseEntity<?> sameCheck(@RequestParam("username")String username){ boolean isSameUsername = userService.유저네임중복되었니(username); // 영어로 하면 isUsernameDuplicated 이런식으로 짓기 return ResponseEntity.ok(Resp.ok(isSameUsername)); }
    이 코드에서는 Resp를 body에 담아서 return 하면
    200, “성공”, false
    200, “성공”, true
    이렇게 return 된다.
     
    “성공”이라고 return 하기보다 좀 더 정확한 메시지를 주고 싶으면
    ok 매서드를 “오버로딩” 해서 return 할 때 직접 메시지도 적을 수 있게 해주는게 좋다!
     
    notion image
    기존 매서드를 복사해서
     
    notion image
    오버로딩해서 하나 더 만들어주고 msg도 받아서 만들어 준다.
    notion image
    return 부분 삼항연산자를 사용해서
    중복됐을때, 안됐을때 메세지를 구분해서 보낼 수 있도록 코드를 수정한다!
    // http://localhost:8080/user/samecheck?username=hello @GetMapping("/user/samecheck") public ResponseEntity<?> sameCheck(@RequestParam("username") String username) { boolean isSameUsername = userService.유저네임중복되었니(username); // isSameUsername? 유저네임중복체크 이런식으로 매서드 이름짓지 말기 // true는 중복된거, false는 중복되지 않은거 // 팀원들이랑 정해야함 return ResponseEntity.ok(Resp.ok(isSameUsername, isSameUsername ? "중복되었어요" : "중복되지않았어요")); // front가 true받으면 중복된거, false받으면 중복안된거 }
     
     
    ++

    Limit, Offset

    페이징 처리할때 쓰는 limit
    select * from board_tb order by id desc limit 0, 3; select * from board_tb order by id desc limit 3, 3; select * from board_tb order by id desc limit 0*3, 3;
    notion image
    [MYSQL] 📚 LIMIT / OFFSET 쿼리
    limit 결과 중 처음부터 몇개만 가져오기 SELECT * FROM 테이블명 LIMIT 10; -- 처음 부터 10개만 출력하기 (1 ~ 10) SELECT * FROM 테이블명 LIMIT 100, 10; -- 100번째부터 그 후 10개 출력하기 (101 ~ 110) offest 어디서 부터 가져올지 SELECT * FROM 테이블명 ORDERS LIMIT 20 OFFSET 5; -- 5번째 행 부터 25행 까지 출력 (6 ~ 25) -- limit 5, 20 과 같다고 보면 된다. SELECT * FROM 테이블명 ORDERS LIMIT 5, 20 페이징 처리하기 사이트를 만들다보면 무조건 최소 한번은 Paging 을 처리해야하는 화면이 있다. Mysql 에서는 Limit 과 offset 을 제공하..
    [MYSQL] 📚 LIMIT / OFFSET 쿼리
    https://inpa.tistory.com/entry/MYSQL-📚-LIMIT-OFFSET
    [MYSQL] 📚 LIMIT / OFFSET 쿼리
    나중에 할거임
     
     
     
    notion image
    notion image
    notion image
    username가져올때 $("input[name=username]") // 이런거 쓰지말고 id를 사용해라
     
     
     
    근데 쿼리스트링 날리는 문법을 모르겠다.
    fetch에서 쿼리스트링 전송법
    이라고 구글에 검색해서 찾기 : )
     
     
    notion image
    어음을 받으면 then then 방식으로 받는다.
    ()안에 행위가 들어와야 한다.
    돈을 받을 때 첫번째 then이 때려진다.
    그리고 파싱해야한다.
    → 이거보면 그냥 프로미스 방식을 쓰는구나 만 알면되고
     
    이거말고 그냥 await async 쓰기
     
    notion image
     
    notion image
    완성
     
    <script> // 1. bool 타입은 is를 붙여서 만든다. let isSameUsername = true; // 이 페이지 열릴때 뜬다. f5누르면 true로 다시 refresh 된다. 일단 true로 보고 시작! async function sameCheck() { // 1. username 가져오기 //$("input[name=username]") // 이런거 쓰지말고 id를 사용해라 let username = $("#username").val(); // 2. fetch로 통신하기 (get요청임, url 모름) let response = await fetch(`/user/samecheck?username=${username}`); let responseBody = await response.json(); // 3. 중복됐으면 -> !isSameUsername = true -> 트리거. -> 느낌표붙이면 역치?가 된다. // 4. 중복안됐으면 -> isSameUsername = false; -> username input을 readOnly로 바꿔야함. -> 다시 못적게 if (responseBody.body) { isSameUsername = true;haha alert("중복된 유저네임이에요"); } else { isSameUsername = false; alert("사용할 수 있는 유저네임이에요"); $("#username").attr("readOnly", true); } }; function valid() { if (isSameUsername) { alert("중복체크가 필요합니다."); return false; } else { return true; } } </script>
     
     
     
     
     
    master 에 그대로 push 했는데,
     
    오늘 push 한 것 이전 코드에서 오늘 내용을 복습하고 싶어서 이전 커밋을 돌아가는 걸 검색해봤다.
     
     
    Git 특정 버전으로 되돌렸다가 돌아오기(혹은 아예 되돌리기)
    이전 버전 보고 돌아오기 이전 커밋의 소스를 확인하고 싶을 경우, 두 가지 방법이 있다. 커밋 메시지 보고 특정 커밋으로 되돌리기 git log - 명령 입력 후, 위 아래 방향키로 원하는 버전 커밋 찾기 - 'commit' 문구 뒤의 해시코드 앞에서 4자리 이상 복사 git checkout 복사한 4자리 이상 해시코드 - 현재 소스가 해당 버전으로 돌아간다. git checkout 브랜치 이름 - 되돌아오기(해당 브랜치의 최신 커밋으로 돌리기) 단계별로 되돌아가기 git checkout head~1 - 최신 커밋으로부터 한단계 전으로 되돌린다. - 1에 해당하는 부분을 바꿔서 원하는 단계만큼 지정할 수 있다. git checkout 브랜치 이름 - 되돌아오기(해당 브랜치의 최신 커밋으로 돌리기) 이전 ..
    Git 특정 버전으로 되돌렸다가 돌아오기(혹은 아예 되돌리기)
    https://mintaku.tistory.com/12
    Git 특정 버전으로 되돌렸다가 돌아오기(혹은 아예 되돌리기)
     
    돌아가서 오늘 배운 아이디 중복체크를 연습했는데,
     
    다시 master로 돌아오려니
     
    notion image
     
    error 가 났다.
     
    지피티한테 물어보니 변경 코드(연습한 코드)를 다 버리거나
     
    일시적으로 저장하라고(stash) 했음. 그래서 거기서 stash 해고 master로 checkout 함
     
    → 나중에 복원하려면 git stash pop 하면 됨
    notion image
     
    Share article

    keepgoing

    RSS·Powered by Inblog