루카스모
4k
2020-10-26 14:16:34 작성 2020-10-26 15:28:24 수정됨
7
257

스프링 ajax 데이터 컨트롤러 보내고 데이터 받기 질문이요


안녕하세요 제가 스프링 프로젝트 진행중인데

login.jsp에서 ajax로 user_id를 /get_base64Data  컨트롤러로 보내서

컨트롤러에서 db 까지 가서

db에 있는 user_id와  ajax에서 보낸 user_id가 일치하면

db에 있는 base64data를 login.jsp의 에서 받아서 사용하려고 합니다.


현재 login.jsp 의 ajax에서 데이터를 보내고 받는 과정은

login.jsp의 특정 버튼을 클릭하면 onclick="doget_Base64Data();" 으로 함수가 실행됩니다.

<form id="formId" onsubmit="return formSubmit();">
	<button onclick="doget_Base64Data();">버튼클릭</button>
</form>

해당 버튼을 클릭하면 아래 doget_Base64Data() 함수를 실행시킵니다.


<script>
	var allow_submit = false;
	
	function formSubmit()
	{
		if (!allow_submit) return false;
	}
</script>

<script>
	function doget_Base64Data(){
		var user_id = $("#user_id").val();

		$.ajax({
	        type: 'post',
	        url: "${root }user/get_base64Data",
	       	data : {"user_id" : user_id},
	       	datatype: 'json',
	        success: function (res) {
	       		if (res.code == 200) // 정상처리 됐다면
	        	{
	        		console.log('res.data : '+res.data);
	        		alert('정상처리');
	        		doMatchData();
	        		allow_submit = true;
	        	    $('#formId').trigger('submit');
	        	}
	        },
	        error: function (e) {
	        	alert(e.responseText);
	        	console.log(e.responseText);
	        }
	    });	
	}
</script>


그리고 get_base64Data 컨트롤러는 다음과 같습니다.

위에 @RequestMapping("/user") 더 있어서 user/get_base64Data로 잘들어갑니다.

@PostMapping("/get_base64Data")
public String get_base64Data(@RequestParam("user_id") String user_id , Model model) {
	String user_base64data = userService.getUserBase64Info(user_id);

	model.addAttribute("u_base64data",user_base64data);
	
	return user_base64data;
}


이렇게 제가 get_base64Data 컨트롤러에서

user_id가 잘 넘어가는걸 확인하고

그에 따라 user_base64data도 잘 받는걸 확인했습니다.

그런데 ajax의 에서 success 의 if (res.code == 200) 안으로 안들어오고

왜 error : function(e) 로 넘어가는걸까요?


참고로 console.log(e.responseText); 는


<!doctype html><html lang="ko"><head><title>HTTP 상태 404 – 찾을 수 없음</title><style type="text/css">body {font-family:Tahoma,Arial,sans-serif;} h1, h2, h3, b {color:white;background-color:#525D76;} h1 {font-size:22px;} h2 {font-size:16px;} h3 {font-size:14px;} p {font-size:12px;} a {color:black;} .line {height:1px;background-color:#525D76;border:none;}</style></head><body><h1>HTTP 상태 404 – 찾을 수 없음</h1><hr class="line" /><p><b>타입</b> 상태 보고</p><p><b>메시지</b> 파일 [&#47;WEB-INF&#47;views&#47;BA907GDF0gsdfjkgLKSGd9psfdgsdfgOSFDOS79GFsfglsgf7lgsfugsfo79fgSDUGFSFSE76sdJIKGHF7ofhbSFDglfgf9GFU9Ofd

KAe6zo40qUQ45iBCuPylAaDe&#42;QE7yBkA.jsp  ( 노란색이 base64data값인데 이 값은 제가 임의로 쳤습니다. )]을(를) 찾을 수 없습니다.</p><p><b>설명</b> Origin 서버가 대상 리소스를 위한 현재의 representation을 찾지 못했거나, 그것이 존재하는지를 밝히려 하지 않습니다.</p><hr class="line" /><h3>Apache Tomcat/9.0.37</h3></body></html>

이런식으로 나옵니다.

0
  • 답변 7

  • 경민민
    73
    2020-10-26 14:24:12

    리턴할때 model값을 리턴해주시면 어떨까요

  • 퀘이사123
    552
    2020-10-26 14:26:44

    아작스부분의 dataType은 서버쪽에서 리턴하는 타입을 명시해야 합니다.


    객체류를 리턴한다면 json이고 String을 리턴한다면 text죠.


    서버쪽에서 String을 리턴하는데 json타입을 받는다고 명시해놓으셔서 에러뜨는거라고


    1차로 생각되고,


    그리고 success부분의 res는 서버쪽에서 리턴한 값이 나오는데


    그러면 res는 String이라는 문자일텐데 거거에 .code해봐야 에러만 뜨겟죠?


    서버에서 리턴할때 ResponseEntity라는게 있습니다. 검색해보세용

  • 루카스모
    4k
    2020-10-26 14:37:33 작성 2020-10-26 14:40:55 수정됨

    경민민

    감사합니다 참고하겠습니다. 지금 get_base64Data 컨트롤러를 void 형으로하고

    return을 안하고 model.addAttribute 한 u_base64data 를 login.jsp에서 사용할까 생각중입니다.

  • 루카스모
    4k
    2020-10-26 14:40:40 작성 2020-10-26 15:28:31 수정됨

    퀘이사123

    제가 결국 필요한건 user_base64data 인데

    어차피 base64data 값을 doMatchData() 함수에서 사용해줄 생각입니다.


    그러면
    /get_base64Data 컨트롤러로 반환할 필요없다면

    void 형으로하고 return 하지않고 다만

    model.addAttribute("u_base64data",user_base64data); 한

    u_base64data 값을  doMatchData() 함수에서만 사용하면 되려나요?


  • 퀘이사123
    552
    2020-10-26 14:49:11

    user_base64data 만 필요하신거면


    model에 넣을필요없이 


    컨트롤러쪽 해당 메서드위에 @ResponseBody 붙이시고(@PostMapping 위아래 아무데나)


    user_base64data  이거 리턴한다음에


    아작스쪽 dataType 'text'로 바꾸시면


    res가 user_base64data 이겁니다.


  • 루카스모
    4k
    2020-10-26 16:29:22 작성 2020-10-26 16:35:48 수정됨

    퀘이사123

    정말 감사합니다.

    ajax의 success 안에

    console.log(res) 로 출력해보니 base64data가 아주 잘 출력됩니다.


    만약 이 base64data를 doMatchData()에서 사용할꺼라면

    그러니까 정확히 말해서

    <form id="formId" onsubmit="return formSubmit();">
    	<button onclick="doget_Base64Data();">버튼클릭</button>
    </form>

    기존에는 "버튼클릭"을 누르면 

    /login_pro 컨트롤러로 user_id, user_pw 등이 전달되어 /login_pro 컨트롤러가 실행됩니다.


    새롭게 구현하려고 하는 것이  doget_Base64Data()를 통해서

    base64data를얻고  doMatchData() 함수에서 base64data를 받고

    doMatchData()실행하고 base64data통해  얻은 result 변수의 값이 1 이면

    /login_pro 컨트롤러를 실행하려고 합니다.


    그래서 success 바로위에

    async : false,  를 적어서 동기로 실행되게끔 하고

    doMatchData() 에서 값 잘받는데


    기존에 아래 코드처럼 있으면

    <form:form action="${root }user/login_pro" method='post' modelAttribute="tempLogUserBean">


    <c:if test = ~~ >

      <form:form action="${root }user/login_pro" method='post' modelAttribute="tempLogUserBean">

    </c:if>

    이런식으로 해야할것같은데 ( js에 있는 변수와 일치할때만 action  이 발생하도록  )

    "버튼클릭" 버튼이 해당 form 안에있어 전체 를 if문으로하면

    버튼 클릭도 안될것 같아서 어떻게 해야할지 고민이고



    또한 result 는 js에 있는 변수를 jsp에 서 사용하려면 어떤식으로 사용하면 될까요?

    js에 있는 변수를 jsp에서 사용하는건 검색해도 잘 안나와서 여쭤봅니다.


  • 루카스모
    4k
    2020-10-26 17:29:24

    successboy 

    https://okky.kr/article/803872

    댓글로 단질문이

    여기에 간략히 정리돼 있으니 한번 봐주시면 감사하겠습니다.

  • 로그인을 하시면 답변을 등록할 수 있습니다.