Web basic - 04,05 jQuery로 JSON 형식 데이터 받기, Open API

Web basic - 04,05 jQuery로 JSON 형식 데이터 받기, Open API

 

 

• 프로토콜
  • 데이터 통신을 위한 통신 방법을 명시해야 한다.
  • web기본은 http://
• 프로토콜://서버쪽컴퓨터의 IP:웹서버프로그램의 포트번호/프로젝트명/프로그램명
• http://ip주소:port번호/bookSearch/search
• 데이터 전송 방식
  • 1) GET 방식
    • URL을 이용하여 데이터를 넘겨주는 방법 이용
    • ?key=value&key=value&key=value
  • 2) POST
    • Request Header를 이용해서 데이터를 넘겨주는 방법 이용
• AJAX로 비동기식으로 JSON 받아오기
  • JavaScript가 가지고 있는 서버쪽 프로그램과의 통신 기능
  • 그러나 JavaScrip로 AJAX를 구현하면 힘들기 때문에 jQuery로 편하게 기능 이용 
  • 제공된 서버 프로그램을 이용하어 클라이언트 사이드에서 프로그램 처리 

 

$.ajax({
    asynce : true, // 비동기식 방식 호출 (default)
    url: "http://ip주소:port번호/bookSearch/search",
    data: {
        keyword: $("input[type=text]").val()
    },
    type: "GET",
    timeout: 3000, // 3초
    dataType: "json",  // 결과 JSON을 JavaScript 객체로 변환
    
    success: function(result) {
        alert("서버 호출 성공)
    },
              
    error : function(error) {
        alert("서버 호출 실패)
    }         
})

 

• AJAX가 비동기일 때는 함수 리턴값 지정 못함, 동기로 수정
• 카카오 Rest API 이용
• AJAX 헤더에 인증용 key값 넣기
• JSON 값 없을 때 undefined나 null 처리 어떻게 하지

beforeSend : function(xhr){
    xhr.setRequestHeader("Authorization", "KakaoAK apkkey");
},

https://github.com/jhk828/02-HTML_Basic/blob/master/08_bookSearch.html