아이디와 이메일 중복 확인

세피·2021년 5월 18일
0

아이디와 이메일 중복 확인

<하고 싶은거>

  1. //응답 받을 데이터 타입을 설정합니다(XML, TEXT, HTML, JSON 등) json말고 다른 데이터 타입들은 어떻게 쓰는건지 알아보자

  2. mapper에서 count로 다 가져왔는데 String으로 한번 가져와보자

Ajax로 아이디 중복, 이메일 중복 확인을 했다. ajax를 쓰지 않는다면? 중복확인을 하는 순간 회원가입시 입력했던 모든 내용이 날아가버린다. Ajax를 잘 활용하자 (비동기 방식)

  1. Jsp
    var emoverChk = false;
   	$("#emoverlay").click(function(){
   		var email = $("#email").val();
   			$.ajax({
   				type:'post'
                   //통신 타입을 설정합니다(post 또는 get 방식으로 선택합니다).
   				,url:'emoverlay'
                   //요청할 url을 설정합니다.
   				,data:{'email' : email }
                   //서버에 요청할 때 보낼 매개변수를 설정합니다
   				,dataType:'JSON'
                   //응답 받을 데이터 타입을 설정합니다(XML, TEXT, HTML, JSON 등).
   				,success:function(obj){
                       //요청 및 응답에 성공했을 때 처리 구문을 설정합니다.
   					console.log(obj);
   					if(obj.use2 != 1){ //값이 0이면
   						alert('사용할 수 있는 이메일 입니다.');
   						emoverChk= true;
   					}else{
   						alert('이미 사용중인 이메일 입니다.');
   						
   					}
   				}
   				,error:function(e){
                       //요청 및 응답에 실패했을 때 처리 구문을 설정합니다.
   					console.log(e);
   				}
   			});				
   		});	
   	
   	 var overChk = false;
   		$("#overlay").click(function(){
   			var id = $("#member_id").val();
   				$.ajax({
   					type:'post'
   					,url:'overlay'
   					,data:{'id' : id }
   					,dataType:'JSON'
   					,success:function(obj){
   						console.log(obj);
   						if(obj.use != 1){
   							alert('사용할 수 있는 아이디 입니다.');
   							overChk= true;
   						}else{
   							alert('이미 사용중인 아이디 입니다.');
   							
   						}
   					}
   					,error:function(e){
   						console.log(e);
   					}
   				});				
   			});	

ajax에서는 json 이라는 데이터 타입의 형태를 쓰는데 이걸 받으려면 hashmap을 써야한다. (json과 hashmap은 비슷한 형태이다.)

물론 응답 받을 데이터 타입으로는 [Json I xml I text I jsonp] 여러가지가 존재한다.

하지만 우리는 json 형태를 쓸것이다.

json이란?

요청 페이지의 결과를 서버에서 처리한 후 다시 JSON을 통해 원래 요청 페이지로 전송함.(페이지 이동X)

name/value 쌍으로 이루어진 데이터 객체를 전달하기 위해 인간이 읽을 수 있는 텍스트를 사용하는 개방형 표준 데이터 형식이다. 비동기 방식을 위해 사용하는 데이터 전송 형식중 하나

과거에 MVC 패턴 공부할떄, gson.jar라는 라이브러리를 사용했었다.

Gson 이란? Java Object를 JSON으로 변환하거나 JSON을 Java Object로 변환하는데 사용할 수 있는 Java 라이브러리입니다.다시 풀어서 !!! 자바 객체를 json으로 바꿔주는거

  1. pom.xml에 추가
<!-- jackson-core -->

<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-core -->

<dependency>

  <groupId>com.fasterxml.jackson.core</groupId>

  <artifactId>jackson-core</artifactId>

  <version>2.10.2</version>

</dependency>

 

<!-- jackson-databind -->

<!-- https://mvnrepository.com/artifact/com.fasterxml.jackson.core/jackson-databind -->

<dependency>

  <groupId>com.fasterxml.jackson.core</groupId>

  <artifactId>jackson-databind</artifactId>

  <version>2.10.2</version>

</dependency>

@ResponseBody 사용하면 java 객체를 json으로 안바꿔줘도 됨 (즉 gson이 필요없어졌다.)

@ResponseBody 를 이용하면 자바객체 그대로 반환하여 사용 가능.

@Controller 대신 @RestController 를 쓰면 @ResponseBody를 선언하지 않아도 arraylist, hashmap,object를 쓸 수 있다.

조건((spring 버전이 4 이상이어야 한다. ))

  1. 컨트롤러
//아이디 중복확인
@RequestMapping(value = "/member/overlay",  method = RequestMethod.POST)
	public @ResponseBody HashMap<String, Object> overlay( Model model, @RequestParam String id) {
		logger.info("고객이 입력한 아이디 : "+id);
		 return service.overlay(id);
	}

//이메일 중복확인
@RequestMapping(value = "/member/emoverlay",  method = RequestMethod.POST)
	public @ResponseBody HashMap<String, Object> emoverlay( Model model, @RequestParam String email) {
		logger.info("고객이 입력한 이메일 : "+email);
		return service.emoverlay(email);
	}
  1. 서비스
public HashMap<String, Object> overlay(String id) {
		HashMap<String, Object> map = new HashMap<String, Object>();
		int use = dao.overlay(id);
		map.put("use", use); //아이디가 존재하면 1, 없으면 0
		return map;
	}

	public HashMap<String, Object> emoverlay(String email) {
		HashMap<String, Object> map = new HashMap<String, Object>();
		int use2 = dao.emoverlay(email);
		map.put("use2", use2); //이메일이 존재하면 1, 없으면 0
		return map;
	}
  1. DAO
int overlay(String id);
int emoverlay(String email);
  1. mapper
	<!--아이디 중복 검사 -->
	<select id="overlay" parameterType="String" resultType="Integer">
	        SELECT COUNT(*) FROM member WHERE member_id=#{member_id} OR(member_id=#{member_id} AND withdraw='1')
	</select>
	
	<!--이메일 중복 검사 -->
	<select id="emoverlay" parameterType="String" resultType="Integer">
	      SELECT COUNT(*) FROM member WHERE email = #{email} 
	</select>
profile
세피의 블로그입니다

0개의 댓글