22. Ajax 시작하기

ajax는 jquery를 임포트한 페이지에서만 작동한다.

 

예를들어

 

내가 만든 이 사이트에서는 ajax를 이용 가능하지만,

구글과 같은 사이트에서는 ajax를 이용 불가하다 ...

그렇다면 ajax란 무엇인가?

 

AJAX (Asynchronous Javascript And XML)

AJAX란, JavaScript의 라이브러리중 하나이며 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자이다. 브라우저가 가지고있는 XMLHttpRequest 객체를 이용해서 전체 페이지를 새로 고치지 않고도 페이지의 일부만을 위한 데이터를 로드하는 기법 이며 JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 XML 데이터를 주고받는 기술이다.

즉, 쉽게 말하자면 자바스크립트를 통해서 서버에 데이터를 요청하는 것이다.

 

비동기 방식이란?

비동기 방식은 웹페이지를 리로드하지 않고 데이터를 불러오는 방식이며 Ajax를 통해서 서버에 요청을 한 후 멈추어 있는 것이 아니라 그 프로그램은 계속 돌아간다는 의미를 내포하고 있다.

 

출처: velog.io/@surim014/AJAX%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80

AJAX란 무엇인가?

 

 

쉽게 말해서 사이트를 리로드 하지 않고 서버에 접근해서 프로그램이 사이트가 동적으로 변화하면서 변화를 주게 하는 경우를 의미한다.

 

그렇다면 이전에 했던 서울시openapi에 접근하기위해서 사용한 url을 이용한 ajax를 이용해보자.!

 

위와 같이 url 부분에다가 GET타입(데이터 조회할때 주로 이용)을 이용하는 서울시 openapi를 집어넣고 그에 대한 결괏값으로 response를 넣는다. 즉 response가 곧

이거라고 생각하면 쉽다.

 

그렇다면 각 값(value)에 어떻게 접근해야 할까?

 

 

위와 같이 response["RealtimeCityAir"]라는 값에서 row값을 rows에 반환한다. 그리고 각 rows[i]["각 value"]로 접근한다.!