https://www.kobis.or.kr/kobisopenapi/homepg/main/main.do
회원가입 후 open api 보기
URL 확인
요청 구조와 응답 구조 확인 , 응답구조(인터페이스) 만들기
( 필자는 typescript 사용 )
키 발급 받기
< 브라우저(url)로 json 확인 예제 >
react - service 구축 예제
[ 전체조회 , 상세조회 ]
< 주의점 >
발급받은 키(key)는 필수로 사용해야한다
// CinemaService.ts
// 영화진흥 위원회의 오픈 API 통신 함수들 정의
// 전체조회 또는 상세조회
import axios from "axios";
import { Console } from "console";
import ICinema from "../../types/shop/ICinema";
// 영화진흥 위원회 기본 주소
let baseUrl = "http://www.kobis.or.kr/kobisopenapi/webservice/rest";
// /boxoffice/searchDailyBoxOfficeList.json
// 발급 받은 api key 변수
let apiKey = "";
// 전체 조회
// 요청필드(조건)
// key : 위의 인증키 넣기(필수)
// targetDt : 조회하고자 하는 날짜를 yyyymmdd 형식(필수)
// repNationCd : “K: : 한국영화 “F” : 외국영화 ("" : 전체)
// itemPerPage : 결과 ROW 의 개수를 지정
// 변수 사용 : 쿼리스트링 방식 (?변수명=값&변수명2=값2...)
const getAll = (targetDt: string, repNationCd: string, itemPerPage:number) => {
// 주소 조합 : 기본주소 + 추가주소 + 변수명
let url = `${baseUrl}/boxoffice/searchDailyBoxOfficeList.json?key=${apiKey}&targetDt=${targetDt}&repNationCd=${repNationCd}&itemPerPage=${itemPerPage}`;
console.log("url", url);
return axios.get<Array<ICinema>>(url);
}
// 영화 상세조회(1건조회)
// ${baseUrl}/movie/searchMovieInfo.json
// 요청필드(조건) :
// key : 인증키(위에 있음) : 필수
// movieCd (영화코드)
const get = (movieCd: string) => {
// 기본주소 + 추가주소 + 변수명(쿼리스트링)
let url = `${baseUrl}/movie/searchMovieInfo.json?key=${apiKey}&movieCd=${movieCd}`;
return axios.get<ICinema>(url);
}
const CinemaService = {
getAll,
get
}
export default CinemaService;
'React > React' 카테고리의 다른 글
React - Pagenation (1) | 2023.12.17 |
---|---|
React - proxy 설정들 (0) | 2023.12.17 |
React - useParam (0) | 2023.10.20 |
React - 예제 1-2번 (수정/삭제) (0) | 2023.09.05 |
React - 예제 1번 (저장/조회) (0) | 2023.09.05 |