엠마의 개발공부일지

"ajax 400에러" 원인과 해결방법 (Failed to load resource: the server responded with a status of 400() 본문

Stack/대환장 오류 모음집

"ajax 400에러" 원인과 해결방법 (Failed to load resource: the server responded with a status of 400()

Emmababy 2021. 1. 8. 20:33
728x90

 

 

📑현재상황

스프링 MVC환경에서 서버구동시 출력되는 페이지에

ajax를 사용해 컨트롤러부터 값을 받아와 상황에 맞게 다른버튼을 구현해야한다.

여기서 핵심은 버튼을 눌렀을때 ajax가 실행되는게아니고, 처음부터 ajax가 실행되어야한다.

 

이 부분을 해결하기위해서는 script내부에 

  1. ajax문법을 바로 써도되고
  2. $(document).ready(function(){})로 감싸줘도되고
  3. IIFE(Immediately Invoke Function Expressions)를 써도된다(작성즉시 호출되는 함수)

이번 포스팅에서는 1번으로 해결했다. 

 

 

 

 

 

⚠오류내용

ajax 400에러는 통신을 받는쪽에서 제대로 못받기 때문이다(@RequestBody확인하기)

해당코드

[header.jsp]  보낼데이터가 없는데 data칸을 썼다. 이부분이 잘못되었다.(안쓸꺼면 빼줘야함)

<script> 
	$.ajax({
		url: '/carshop/receive',
		type : 'get',
		dataType : "json",
	    contentType: "application/json; charset=utf-8",
 	    data : JSON.stringify({
	
 	    	}),
		success:function(data){
			if(data){
				console.log("if완료완료");
			}else {
				console.log("else완료");
				$('.nav-logout').attr("style","show");
				$('.nav-login').attr("style","hidden");
			}
		},
		error :function(){
			console.log("실패함");
		},
		complete : function(){
			alert("ajax호출 완료 시 실행");
		}
	});
</script>

 

[LoginController.java]

@GetMapping("/receive")
	@ResponseBody
	public boolean receive(HttpServletRequest request, HttpSession session) {
		boolean result = false;
		request.getSession(false);
		System.out.println("session  " + request.getSession(false));

		if(session != null) result = true;
		else result = false;
		
		return result;
	}

 

 

 

 

📌원인과 해결

1. ajax에 보낼 데이터가 없으면 data부분을 아예 제거해야한다.들어갈 값이 없다고 값만 안쓰면 소용없다.(주석처리부분)

<script> 
	$.ajax({
		url: '/carshop/receive',
		type : 'get',
		dataType : "json",
	    contentType: "application/json; charset=utf-8",
// 	    data : JSON.stringify({
	
// 	    	}),
		success:function(data){
			if(data){
				console.log("if완료완료");
			}else {
				console.log("else완료");
				$('.nav-logout').attr("style","show");
				$('.nav-login').attr("style","hidden");
			}
		},
		error :function(){
			console.log("실패함");
		},
		complete : function(){
			alert("ajax호출 완료 시 실행");
		}
	});
</script>

 

2. 받을 데이터가 없으니, 파라미터에 @RequestBody는 없는게 맞다.(receive메서드 파라미터)

	@GetMapping("/receive")
	@ResponseBody
	public boolean receive(HttpServletRequest request, HttpSession session) {
		System.out.println(" header ajax들어옴=========");
		boolean result = false;
		request.getSession(false);
		System.out.println("session  " + request.getSession(false));

		if(session != null) result = true;
		else result = false;
		
		return result;
	}

 

 

 

[참고] : ajax기본문법을 가장 깔끔하게 정리한듯한 블로그

java119.tistory.com/4

728x90
Comments