ajax

ajax란?

- Asynchronous Javascript And XML의 약자이다.

- 자바스크립트를 이용해서 비동기식으로 서버와 통신하는 방식으로 XML을 이용한다.

- 꼭 XML을 이용할 필요는 없고 최근에는 json을 더 많이 이용한다.

- 비동기식(Asynchronous)이란 여러가지 일이 동시적으로 발생한다는 뜻으로, 서버와 통신하는 동안 다른 작업을 할 수 있다는 의미이다.

  즉 서버와 통신은 백그라운드에서 진행되고 그동안 사용자는 여러가지 작업들을 할 수 있다.

"ajax를 사용할 때 사용하는 API는 $.ajax(settings)이며 인자로는 settings가 전달되며 객체이다."

- jQuery를 이용한 ajax통신의 가장 기본적인 API이다.

- 주요 속성(settings에 사용되는 것들)

• data : 서버에 전송할 데이터이며 데이터의 값은 key/value 형식의 객체
• dataType : 문자가 들어가며 서버가 리턴하는 데이터타입 (xml, json, script, html과 같은 값이 사용된다.)
• type : 서버로 전송하는 데이터의 타입(POST, GET) // type은 form의 속성 중에 method에 사용되는 것이며 dataType은 서버에 요                                                                    청하고 서버가 응답했을 때 서버가 전달하는 데이터가 어떠한 형식인지 지정                                                                      하는 것.
• url : 데이터를 전송할 URL
• success : ajax통신이 성공했을 때 호출될 이벤트 헨들러

[클라이언트]

- ajax API를 보면 key와 value 형식으로 이루어져있고 이름과 값의 구성으로 객체의 속성들이 만들어진다.

- url은 서버가 위치한 url을 적어준다

- dataType은 서버가 반환하는 타입의 형태를 적어준다. 현재 예제에서는 json의 데이터타입으로 반환한다.

- type을 통해 서버쪽으로 데이터를 전송할때의 형식을 적어준다. 현재 예제에서는 POST를 사용

- data는 서버에 전송될 데이터이며 객의 형태로 작성되어야한다.

- msg는 객체의 이름이며 $('msg').val()를 통해 id값이 msg인 엘리먼트의 값을 가져온 후 데이터객체에 셋팅한다.

- function(result)에서 result는 서버가 리턴해준 데이터이다.

[서버]

참고 : https://www.youtube.com/watch?v=fiqApu1t1Vc&list=PLrCCNh6y7w2g6U7RX_v-TOefyRPiO32jT&index=11