Spring boot kim's Shop/회원가입

Springboot Jwt+아이디 중복 검사! with XMLHttpRequest

디비드킴 2021. 7. 24. 12:32

새로운 토이 프로젝트!

회원가입부터 해보자!

크게 다를 건 없다

 

이전 jwt내용은 여기 있다

https://cordingmonster.tistory.com/category/Jwt

 

'Jwt' 카테고리의 글 목록

 

cordingmonster.tistory.com

 

아이디 중복 검사 로직

service

userService.java

회원이 존재하는지 찾는 함수

userDto findEmail(String email)

dao를 이용해 회원을 찾는다

return userDao.findByEmail(email);

값을 리턴한다

없다면 null이 리턴됨

 

판별하는 함수

public boolean confrimEmail(String email)

값을 판별한다

if(findEmail(email)==null)

없다면 true 있다면 false 리턴한다

 

restcontroller

restcontroller.java

js

js

전역 변수로 xmlhttprequest선언

var xhr = new XMLHttpRequest();

id가 이메일인 태그 값가 져 오기 

let data=document.getElementById('email');

전송 형태 지정

xhr.open('POST','http://localhost:8080/auth/confrimEmail',true);
xhr.setRequestHeader("Content-Type",'application/x-www-form-urlencoded');

전송

xhr.send('email='+data.value);

 

결과 쪽을 보기 전

if(xhr.response=='true')

쓴 이유는

서버에서 bool을 줘도

자바스립트는 기본적으로 

문자열로 받고 false->bool로 바꿔도

true가 된다 

자바스크립트에서 false경우는 

https://curryyou.tistory.com/188

 

[JS] 자바스크립트 형변환 #3: number to boolean 등

# 불리언으로 타입변환 방법 2가지 숫자, 문자열, 객체 등은 불리언 타입으로 변환 가능하다. 1.  Boolean( 숫자 || 문자열 || 객체 || undefined || null ) : Boolean() 생성자 함수를 new 연산자 없이 호..

curryyou.tistory.com

여기 잘 써져있다

(그냥 j쿼리가 짱인거 같다 ㅋㅋㅋ)

 

존재하지 않다면

email칸 색을 바꿔준다

data.style.backgroundColor=color;

존재 안 하면 파랑으로

color='blue';

존재한다면 빨강으로

color='red';

 

메시지는 넣을까 하다가 

어차피 리액트 공부를 하려고 해서

디테일하게 표시는 안 하려고 한다

 

테스트

 

존재하지 않는 이메일 전송

http://localhost:3030

존재하는 이메일 전송

http://localhost:3030

이제 주소추가 로직을 만들어보자!