AJAX 와 APIs 데이터교환 XML / JSON

section 28 

 

AJAX(ASYNCHRONOUS JAVASCRIPT AND XML)

비동기식 자바스크립트와 XML

JS, HTML ,CSS > 사람을 위한 것 .. 사람들은 렌더링된 브라우저를 본다 . 

- JS를 사용해 앱을 만들 수 있다 . 데이터를 올리거나 꺼낼 수 있고 어디론가 보낼 수도 있다.

EX> 실시간 비트코인 가격을 보여주는 앱

JS로 만들면 새로고침을 하지 않고 타임아웃을 설정하면된다. 

X분마다 요청을 API에 할 수 있다.

 

 

 

 

 

APIs(APPLICATION PROGRAMMING INERFACE)

JS를 AJAX로 요청시 순수 데이터를 원함. 이때 필요한게 API이다.

 소프트웨어끼리 작용한다. 사람이 아닌 애플리케이션을 위한 인터페이스. 

웹에서 API를 이야기한다면 WebAPI이다. WebAPI는 웹, HTTP를 기반으로 하는 인터페이스이다.

다른 애플리케이션이나 데이터베이스로가는 입구이다.  

WebAPI는 HTTP에서 일어나는 인터페이스라는 것을 잊지말자. 

 

 

XML과 JSON

- XML과 JSON은 애플리케이션 간 데이터 교환에 사용되는 데이터 표현이다.

- 데이터 직렬화 . 이들 형식을 사용하면 표준화된 방식으로 다양한 애플리케이션, 플랫폼 또는 시스템간에 데이터 교환 가능

 

XML

- HTML과 비슷하게 생김

- 트리구조에 데이터 저장. 트리는 루트(상위)요소로 시작하고 이어서 하위 요소에 대한 정보 제공. 많은 변수와 동적 구성을 로드하는데 유용. 

- 태그를 사용하여 데이터 속성과 실제 데이터 구분

- 예전에 자주 쓰였음

- 데이터를 정의하는 규칙을 제동하는 마크업 언어

 

 

JSON(JAVA SCRIPT OBJECT NOTATION)

- JS객체문법

- 모든 키는 큰따옴표를 가지고있음

- JSON은 사람과 기계가 모두 읽을 수 있는 오픈 데이터 교환 형식

- 모든 프로그래밍 언어에 독립적이며 매우 다양한 애플리케이션의 일반적인 API 출력

- 키-값 페어사용한다. 맵과 유사한 구조. 키는 페어를 식별하는 문자열 / 값은 해당 키에 제공하는 정보

- 동일한 데이터를 더 작은 파일 크기로 표현하여 데이터 더 빠르게 전송 가능.

 

JSON.parse()

JSON을 JS객체로 변환 

변수로 저장하여 쓸 수 있다. 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

JSON.parse() - JavaScript | MDN

 

JSON.stringify()

JS를 JSON으로 변환

JSON 형식의 데이터를 받는 API정보를 보낼때 유용하다. JS 객체가 아닌 유요한 JSON으로 보내야한다. 

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify

JSON.stringify() - JavaScript | MDN

 

 

 

 ** 여러 데이터 유형을 여러 변수와 함께 저장하려는 경우는 XML을 사용하는 편이 더 낫다.

XML은 데이터를 기계가 읽을 수 있는 방식으로 저장하는데 중점을 두므로, 복잡한 데이터의 오류를 검사하는 데 있어서 JSON보다 더 효율적이다. 더 발전된 도구 및 라이브러리 세트를 갖추고 있으며 레거시 시스템에서 더 잘 작동

 

JSON은 데이터 교환을 목적으로 설계되었다. 더 간단하고 간결한 형식제공 .성능과 속도 향상.

 

JSON은 API, 모바일 앱 및 데이터 스토리지에 더 적합,

XML은 데이터 교환이 필요한 복잡한 문서 구조에 더 적합.