[HTML,CSS] 2주차 Ajax

Ajax 시작에 앞서 서버→클라이언트 : "JSON" 이해하기

JSON은 Key : Value로 이루어져 있다.

클라이언트→서버 : GET 요청 이해하기

통상적으로! 데이터 조회(Read)를 요청할 때

 

GET 방식으로 데이터를 전달하는 방법

? : 여기서부터 전달할 데이터가 작성된다는 의미입니다.

& : 전달할 데이터가 더 있다는 뜻입니다.

 

https://movie.naver.com/movie/bi/mi/basic.nhn?code=161967

위 주소는 크게 두 부분으로 쪼개집니다. 바로 "?"가 쪼개지는 지점인데요.

"?" 기준으로 앞부분이 <서버 주소>, 뒷부분이 [영화 번호] 입니다.

* 서버 주소: https://movie.naver.com/movie/bi/mi/basic.nhn

* 영화 정보: code=161967

 

Ajax는 jQuery를 임포트한 페이지에서만 동작 가능합니다.

 

• Ajax 기본 골격

$.ajax({
  type: "GET", // GET 방식으로 요청한다.
  url: "", // 요청할 url
  data: {}, // 요청하면서 함께 줄 데이터 (GET 요청시엔 비워두세요)
/*리마인드
GET 요청은, url뒤에 아래와 같이 붙여서 데이터를 가져갑니다.
http://naver.com?param=value&param2=value2 

POST 요청은, data : {} 에 넣어서 데이터를 가져갑니다.*/
data: { param: 'value', param2: 'value2' },
  success: function(response){ // 서버에서 준 결과를 response라는 변수에 담음
    console.log(response) // 서버에서 준 결과를 이용해서 나머지 코드를 작성
  }
})