📡 API의 개념과 사용법
웹 개발을 공부하다 보면 반드시 만나게 되는 용어 중 하나가 바로 **API(Application Programming Interface)**입니다.
이 글에서는 API의 개념부터 실제 사용 예시인 카카오 책 검색 API, 그리고
jQuery AJAX로 API를 호출하는 방법까지 쉽게 설명해 드릴게요!
🖥 프론트엔드와 백엔드의 역할
웹사이트의 게시판 기능을 예로 들어 볼까요?
- 프론트엔드는 사용자에게 보이는 화면을 담당합니다.
게시판의 틀, 제목의 위치, 텍스트의 색상·크기·애니메이션 등 시각적인 요소를 구성하죠. - 백엔드는 실제 데이터를 처리하는 부분입니다.
예를 들어, 게시판 글의 제목, 본문, 작성자, 작성일, 조회수 같은 정보를 데이터베이스와 연결해 처리합니다.
🔄 프론트엔드가 백엔드와 통신하는 법
만약 사용자가 게시판에서 어떤 글을 클릭하면,
- 프론트엔드는 백엔드에게 해당 글의 정보를 요청합니다.
- 백엔드는 데이터베이스를 조회한 뒤, 제목·내용·날짜·조회수 등의 데이터를 가져와서 프론트엔드에 전달합니다.
- 프론트엔드는 이 데이터를 화면에 표시합니다.
이때 프론트엔드가 백엔드에 정보를 요청할 때는 반드시 정해진 규칙을 따라야 합니다.
이 요청·응답 규칙을 정리한 것이 바로 API입니다.
🔓 오픈 API란?
**Open API(공개 API)**는 기업이나 서비스 제공자가 백엔드 기능을 외부에 공개한 것입니다.
주소와 규칙만 알고 있다면 누구나 사용할 수 있죠!
예를 들어:
- 카카오 API는 책 검색, 번역, 지도, 이미지 등 다양한 기능을 제공합니다.
- OpenAI API는 챗봇, 텍스트 생성, 번역, 이미지 생성 등을 가능하게 해줍니다.
📘 카카오 책 검색 API로 알아보는 구조
📮 요청 (Request)
웹사이트에서 카카오 API 서버에 "이 책에 대한 정보를 주세요!"라고 요청하면,
📤 응답 (Response)
카카오 API 서버는 책 제목, 표지, 소개글 등의 정보를 JSON 형식으로 반환합니다.
📑 API 가이드란?
API를 사용하려면 각 항목마다 요청 방식, 주소, 파라미터, 응답 형식 등을 알아야 합니다.
이런 정보를 정리해 둔 문서를 **API 가이드(API 문서)**라고 해요.
예를 들어 카카오 책 검색 API의 가이드를 보면:
- 요청 주소: https://dapi.kakao.com/v3/search/book
- 요청 방식: GET
- 필수 파라미터: query (검색어)
- 선택 파라미터: sort, page, target 등
- 응답 형식: JSON
{
"title": "나미야 잡화점의 기적",
"authors": ["히가시노 게이고"],
"thumbnail": "http://example.com/image.jpg",
"contents": "수수께끼 편지에 답을 해주는 가게 이야기..."
}
💡 jQuery AJAX로 API 호출하기
API 요청과 응답을 처리할 때는 **AJAX(Asynchronous JavaScript And XML)**를 사용합니다.
하지만 순수 자바스크립트로 작성하면 어렵기 때문에, jQuery를 사용하면 더 간단하게 구현할 수 있어요.
✅ 기본 형식
$.ajax({
method: "GET",
url: "https://dapi.kakao.com/v3/search/book",
headers: { Authorization: "KakaoAK [REST_API_KEY]" },
data: { query: "해리포터" }
})
.done(function(response) {
alert(response.documents[0].title);
});
✅ 설명
- method: 요청 방식 (GET, POST 등)
- url: 요청을 보낼 API 주소
- headers: 인증 정보 (카카오 API는 Authorization 필요)
- data: 검색어 등 요청에 필요한 데이터
- .done(): 요청이 완료되었을 때 실행할 콜백 함수
🔐 Open API는 아무나 쓸 수 있을까?
Open API라고 해서 무조건 누구나 아무 제한 없이 사용할 수 있는 건 아닙니다.
API는 남용을 막기 위해 "접근 권한"을 제어합니다.
예를 들어, 누군가 무한대로 API 요청을 보내면 서버에 부하가 걸릴 수 있기 때문이죠.
그래서 대부분의 Open API는 "API 키"를 발급받은 사용자만 사용할 수 있게 되어 있습니다.
🔑 카카오 API 키 발급 방법
카카오의 API를 사용하려면 먼저 개인용 API 키를 발급받아야 합니다.
- 카카오 개발자 사이트에 접속합니다.
- 회원가입 및 로그인 후, 내 애플리케이션 메뉴로 이동합니다.
- 애플리케이션 추가 버튼을 클릭해 새 앱을 생성합니다.
이때 "애플리케이션"이란, 쉽게 말해 카카오 API를 사용하는 프로그램 단위 하나입니다.
🗂️ 애플리케이션별로 키를 구분하는 이유
카카오 개발자 사이트에서는 애플리케이션 단위로 API 키를 구분해서 발급합니다.
이렇게 하면 아래와 같은 이점이 있어요:
- 애플리케이션마다 사용량 통계를 따로 확인할 수 있습니다.
- 각 앱마다 필요한 기능(API 권한)을 따로 설정할 수 있습니다.
- 만약 하나의 키가 유출되거나 이상 활동이 감지될 경우, 해당 앱의 키만 비활성화할 수 있습니다.
예를 들어, 책 검색 API만 사용하는 앱과 로그인 API를 사용하는 앱이 있다면, 이 둘을 분리해 관리할 수 있는 것이죠.
이번 글에서는 API의 기본 개념부터 Open API의 구조, 카카오 책 검색 API의 활용 방식,
그리고 jQuery AJAX로 API를 호출하는 실습 예시까지 차근차근 살펴보았습니다.
특히 Open API는 누구나 사용할 수 있지만, 남용을 방지하기 위해 발급받은 API 키를 사용하는 구조라는 점
카카오처럼 다양한 기능을 제공하는 API 플랫폼에서는 개발자 사이트를 통해 애플리케이션을 등록하고,
키를 관리하며 사용량을 확인하는 등 체계적인 관리가 가능하답니다.
웹 개발을 하면서 다양한 데이터를 활용하고 싶다면, 공개된 API를 잘 활용하는 것이 큰 무기가 될 수 있어요.
앞으로 실습 프로젝트나 포트폴리오를 만들 때 실제 API를 활용한 기능 구현에 꼭 도전해 보시길 바랍니다!