ajax와 form(submit)의 차이점

ajax

ajax는 서버와 통신하는 비동기적인 방법이다.

예를들어 좋아요를 누르거나 댓글을 달면 페이지가 reload 되지 않고 좋아요와 댓글이 생긴다.

이런 것을 비동기 통신이라고 한다.

ajax에서 서버에 data를 날리면 서버는 data와 db를 통해 return값을 넘겨준다.

그 리턴값을 success 부분에서 html,css,js,jquery를 통해 처리해주면 좋아요나 댓글이 reload되지 않고 바뀌는 것이다.

나는 멍청하게 ajax로 보내놓고 success msg만 리턴해주었고  ajax단에서 window.location.reload로 전체글을 다시 긁어오는 식으로 처리를 해주어야 했다. 왜 좋아요를 누를때마다 새로고침이 필요했는지 만들어놓고 코드를 리뷰해보면서 알 수 있었다. 다음부터는 멍청한 실수는 하지말자.

 

form

form은 ajax와 달리 서버와 통신하는 동기적인 방법이다.

예를들어 로그인을 성공하면 당연하게 페이지가 홈페이지로 이동하게 된다.

물론 ajax를 통해서도 페이지 이동을 할 수 있지만 form을 통해서도 할 수 있다.

이런 것을 동기 통신이라고 한다.

form은 action을 통해 전달할 url을 설정하고 data를 날려주고 서버는 그 데이터를 db와 함께 잘 처리하여 rendertemplate을 리턴한다.  html이 전달되면 action의 url로 이동하게 된다. url에서는 html을 rendering해주어 페이지는 나타나게 해준다!