Spring) 1편 : ajax로 DTO 받아서 회원가입 만들고 싶었던 사람...

 

ajax로 DTO클래스를 받아서 DB에 저장하고

DB에 들어가면 -> 가입 성공!

DB에 안 들어가면 -> 가입 실패!

하는 기능을 만들어보고 싶었다

 

 

첫시도

 

	@ResponseBody
	@PostMapping("/signUp") // /hi/signUp
	public String signUpTest(@RequestBody MemberDto dto) throws Exception {
		
		//1.sql문으로 insert
		int num = service.signUp(dto);
		if(num==1)
			return "redirect:/";
		//2.중복이면 다시
		return "signUp";

	}

 

      var id = form.id.value;
      var pwd = form.pwd.value;
      var name = form.name.value;
      var email = form.email.value;
      var birth = form.birth.value;

      var data = {"id":id, "pwd":pwd, "name":name, "email":email, "birth":birth};

      $.ajax({
        type: 'POST', //요청한 메서드
        url: '/signUp', //요청하는 url
        header: {"content-type":"application/json"}, //요청 헤더(내가 JSON으로 보내는 거야)
        dataType: 'text', //전송할 데이터의 타입은 이거야
        data: JSON.stringify(data), //서버를 전송할 데이터, 직렬화(문자열화) 필요해서 stringify()
        success: function (data) { //서버로부터 응답(data)가 도착하면 호출될 함수
          alert("가입이 완료되었습니다!");
        },
        error: function () { //응답 실패하면 호출될 내용
          alert("가입 실패");
        }
      });

 

별쌩쑈를 다해보다가

혹시 dto로 값이 안 들어가는 건 아닌가? 싶어서

컨트롤러에서 String 으로 값을 받아와봤다

 

 

	@ResponseBody
	@PostMapping("/signUp") // /hi/signUp
	public String signUpTest(String id, String pwd,String name, String email,String birth) throws Exception {

		System.out.println("id = " + id);
		System.out.println("pwd = " + pwd);
		System.out.println("name = " + name);
		System.out.println("email = " + email);
		System.out.println("birth = " + birth);
//		//1.sql문으로 insert
//		int num = service.signUp(dto);
//		if(num==1)
//			return "redirect:/";
//		//2.중복이면 다시
		return "signUp";

	}

 

 

 

잉...한글로 안 불러와진다

그래도 값이 들어왔으니 괜찮은 건가?

혹시 몰라서 영어로 써봤다

 

 

응 안돼~

 

 

 

DTO로 값이 들어와지는지 확인해봤다

 

	@ResponseBody
	@PostMapping("/signUp") // /hi/signUp
	public String signUpTest(@RequestBody MemberDto dto) throws Exception {

		System.out.println("dto.getId() = " + dto.getId());

		//1.sql문으로 insert
		int num = service.signUp(dto);
		if(num==1)
			return "redirect:/";
		//2.중복이면 다시
			return "signUp";

	}

 

dto의 getId()를 호출해보자

가입실패가뜨고

 

415 에러가 떴지만

 

 

미동도 없는 컨트롤러

 

 

 

아하!

DTO로 값이 안 들어와지는 게 문제였구나~^.^

 

 

 

사실 String 으로 값을 받아와서

DTO 객체에 값을 일일히 넣어줘도 되는 일이지만

 

1.컨트롤러를 지저분하게 만들기 싫음

2.DTO로 받아보고 싶은 도전정신

 

이 두 가지가 날 자극했다............

 

 

 

그런데 이 고민을 말하니까

 

 

 

 

슨배님의 조언을 토대로

일단 동작을 하는 것을 목표로 달려보자...