WEB - AJAX와 JSON

AJAX

 Asynchronous JavaScript and XML 의 약자. 페이지를 이동할 필요 없이 JS를 통해 HTTP 메시지를 송수신할 수 있는 기능이다.

사용법

let reque = new XMLHtttpRequest(); // 새로운 http 요청 객체 생성
reque.open("GET", "./data.txt"); // 뭘 어떻게 요청할 것인지를 설정
reque.send(); // 상소서 보내기

참고로 실행되지 않는 코드다. 프로토콜이 http가 아니라 ftp이기 때문...

XMLHttpRequest 객체

극히 일부만 소개함

메소드

• open("GET or POST or ...", "요청문", true/false);
   뭘 어떻게 요청할 것인지 설정한다.
   세 번째 인자값은 해당 요청을 받기 전까지 다른 일을 할건지에 대한 정보다. 비동기식으로 일을 처리하겠다는 뜻인데, true로 설정하면 요청을 보내고 응답이 오든 말든 다른 할 일을 시작한다. 아예 인자값을 넣지 않아도 된다.
• send();
   요청문을 서버에 보낸다.

속성

• readyState
   보낸 요청의 상태를 확인한다.
   0 - open 하지 않음, 1 - open 했으나 send 하지 않음
   2 - send 했고 서버로부터 응답을 받음
   3 - 응답에 따른 데이터를 받고 있는 중
   4 - 응답 완료
• status
   요청이 도착했을 때의 응답 종류를 확인한다. 404 Not Found의 404가 바로 이 status 속성에 저장된다.
   200 - OK
   404 - 못 찾음
   500 - 내부 오류
   다른 것들 - [ 여기 ] 에서 확인
• onreadystatechange
   readyState가 변경될 때마다 호출되는 콜백함수(즉, 덮어쓸 수 있다).

 

JSON

 JavaScript Object Notification의 약자. Js식 객체 문서화법이다. Js의 모든 자료는 이 JSON으로 문서화가 가능하다. 반대로 다른 데이터도 JSON으로만 잘 써주면 Js에서 읽어들일 수 있다! 함수같은 건 못 읽지만...
 앞에 JavaScript가 들어간 것답게 Js에서 JSON이라는 이름으로 기본적으로 지원한다.

사용법

let obj = { PI:3.14, num:1234, str:"말라리" }

let stred = JSON.stringify(obj); // 객체를 JSON 문자열로 변환한다
console.log(stred);

let parsed = JSON.parse(stred); // JSON 문자열을 객체로 변환한다
console.log(parsed);