21.1.5 TIL - ajax통신 이유

※본 포스팅은 데어프로그래밍님 스프링부트 블로그프로젝트 강의 수강 후 작성한 내용입니다.

 

뒤늦게 쓰는 TIL

 

이날은 강의를 듣긴 했으나 화면 구성하면서 bootstrap과 javascript를 사용했는데 다뤄본적도 없고 큰 설명없이 정말 강의를 따라하기만 한 느낌이라서 머리에 남은게 없어서 TIL을 쓰지 않았었다. 근데 그것마저 안쓰니까 진짜 머리에 하나도 안남은거 같아서 설명해주신 ajax통신을 사용하는 이유에 대해서라도 써두려고한다.

 

이유1. 요청에 대한 응답을 html이 아닌 data를(우리 프로젝트의 경우 json) 받기 위함. 서버를 하나로 통일하기 위함이라고도 할 수 있다.

 

일반적으로 클라이언트는 브라우저로 요청하고 서버는 html로 응답한다. 예를들어 클라이언트가 회원가입을 요청했을 때 서버는 DB에 연결해서 회원가입을 수행하고 정상적으로 동작했다면 서버가 브라우저에게 메인화면(다른 화면일 수도 있음. 일반적으로 그렇다는것)을 응답한다. 즉, html을 응답한다는 것이다.

만약 요청하는것이 브라우저가 아니라 앱이라면 어떨까? 앱의 화면디자인은 자바코드이고 따라서 서버가 html을 리턴해줄 수 없다. 그리고 앱은 항상 요청해서 페이지를 받는게 아니라 이미 화면디자인이 되어있고 회원가입 요청에 대해 정상적인 응답을 받으면 앱 내부에서 넘어가야할 페이지로 넘어간다. 앱이 서버에게 회원가입을 요청하면 서버가 DB에 연결해서 회원가입을 수행하고 정상적으로 동작했다면 서버가 앱에게 회원가입에 성공했다는 의미로 데이터를 리턴해준다. 

즉, 웹과 앱의 리턴이 다르다. 따라서 서버를 두개 만들어야한다. 하지만 우리는 서버가 웹이든 앱이든 데이터를 리턴하게해서 하나의 서버를 만들어서 사용한다. 앱에서는 똑같이 해주면 되고, 웹에서는 그럼 바뀐리턴값을 어떻게 처리해주어야할까? 

웹에서 ajax로 회원가입을 요청하면 서버가 DB에 연결해서 회원가입을 수행하고 정상적으로 동작했다면 서버가 웹에게 data를 리턴해준다. 그러면 브라우저가 이 데이터를 받고 서버에게 다시 메인페이지르 보여줘 라고 요청한다. 웹은 매번 페이지를 요청해서 받기 때문! 그럼 이번에는 서버가 html을 리턴해준다. 

 

이유 2. 비동기 통신을 하기 위함.

일반적으로 프로그램은 원래 일의 순서에 맞게 순차적으로 일을 수행한다. 하지만 이럴경우 비효율성이 발생할 수 있다. 예를들어 cpu가 일을 수행하다가 I/O를 수행해야하는 일을 만나면 그 일이 다 끝날때 까지 cpu는 기다렸다가 다음 일을 수행하게 된다. 그러면 사용자 입장에서 기다리는 시간이 발생하고 이로인해 사용자 경험이 안좋아진다. 따라서 I/O를 수행하는동안 이 일은 그 일을 수행하는 기억장치+저장장치에게 맡기고 cpu는 그 다음일 (I/O가 하고있는것과 상관없는 일)을 실행한다. 그리고 I/O가 끝나면 cpu는 하고있던 일이 있으면 멈추고 I/O와 관련된 일을 처리하러 돌아간다. 이를 callback이라고 한다. 그리고 이렇게 일이 순차적으로 진행되지 않는 것을 비동기적이라고 한다.