공공데이터 API 활용하기 ①: 활용 신청·인증키 발급·첫 연결

오늘 목표

6주차에서는 사용자가 직접 입력한 데이터를 웹툴이 검색·집계했습니다.
이번 주에는 웹툴이 나라장터 API에 자료를 요청하고, 응답에서 필요한 값을 찾아 화면에 표시하게 만듭니다.

코드를 만들기 전에 공식 API 문서를 AI로 정리하고, 브라우저 주소창에서 가장 간단한 GET 요청부터 직접 확인합니다.

• 공공데이터 API의 요청·응답 흐름 이해하기
• 공공데이터포털 개발계정 활용신청하기
• 공공데이터포털 서비스키 발급 여부 확인하기
• 공식 API 참고문서에서 사용할 기능만 AI로 추출하기
• 요청변수와 출력값의 영문 이름 확인하기
• 브라우저 주소창에서 GET 요청 실행하기
• 인증키와 공고번호를 입력하는 HTML 웹툴 만들기
• API 응답과 웹툴 결과를 대조하기

목표 결과물

• 공공데이터포털 서비스키(일반 인증키)
• 나라장터 용역 입찰공고 조회용 API 작업문서
• 브라우저에서 성공한 GET 요청
• 나라장터공고조회기_v0.1.html

준비물

• ChatGPT 또는 Claude
• Chrome 또는 Microsoft Edge
• 공공데이터포털 계정 또는 회원가입에 사용할 이메일
• Windows 메모장 또는 사용할 수 있는 코드 편집기

오늘 순서

1. API 개념 및 흐름 이해하기
2. 공공데이터포털 가입·로그인·활용신청하기
3. 인증키와 공식 API 참고문서 확보하기
4. AI로 우리가 사용할 부분만 정리하기
5. 브라우저 주소창에서 GET 요청하기
6. 응답 JSON에서 원하는 값 찾기
7. 공고번호 단건 조회 웹툴 만들기
8. 두 개의 공고번호로 결과 테스트하기

오늘 만들 도구

나라장터 용역 입찰공고 단건 조회기

사용자가 인증키와 입찰공고번호를 입력하고 공고 조회 버튼을 누르면 나라장터 API에 GET 요청을 보냅니다.
정상 응답을 받으면 다음 네 가지 값을 화면에 표시합니다.

• 입찰공고번호
• 공고명
• 수요기관
• 개찰일시

핵심 개념

1. API란?

API는 데이터를 요청하는 창구입니다. 사람이 나라장터 웹사이트를 열고 공고를 검색할 수도 있지만, 프로그램은 API라는 창구를 통해 데이터를 요청합니다.

1. 웹툴에서 → API라는 창구를 통해 공공데이터포털에 원하는 데이터를 요청합니다.
2. 공공데이터포털에서 응답 해준 데이터를 받아 → 웹툴에 출력합니다.

예시) 민원실
서류 보관실에 직접 들어가 캐비닛을 하나씩 열어보는 것이 '사람이 웹사이트를 보는 방식'입니다.
창구에 신청서를 내밀고 "26년 8월에 올라온 공고 목록 주세요"라고 요청해 받아오는 것이 'API 방식'입니다. 보관실이 어떻게 정리되어 있는지 몰라도, 신청서 쓰는 법만 알면 됩니다.

오늘 배우는 것은 결국 신청서를 정확하게 쓰는 법 하나입니다.

2. API 요청

공공데이터 API 요청을 위해서는 크게 4가지가 필요합니다.

1) 요청방식 2) 엔드포인트 3) 요청변수 4) 인증키

신청서 한 장에 대응시키면 이렇습니다.

(1) 요청방식

데이터를 가져올 것인지, 보낼 것인지를 알려주는 동사입니다.

• 공공데이터 조회 API는 대부분 GET 형식 입니다. 이번 교안에서는 GET만 사용합니다.
• GET은 주소 하나로 완결되기 때문에, 완성된 주소를 브라우저 주소창에 그대로 붙여넣으면 결과를 바로 눈으로 확인할 수 있습니다.
  코드를 만들기 전에 이 방법으로 먼저 검증합니다.

(2) 엔드포인트

데이터를 요청할 정확한 주소입니다. 창구 번호에 해당합니다.

기관 하나에 창구가 여러 개라는 점이 중요합니다. 같은 나라장터라도 공사 / 용역 / 물품 공고는 서로 다른 주소를 씁니다. 주소를 잘못 고르면 인증키와 조건이 모두 맞아도 원하는 데이터가 나오지 않습니다.

http://apis.data.go.kr/1230000/BidPublicInfoService/getBidPblancListInfoServc
└──────────┬─────────┘└──┬───┘└─────────┬────────┘└────────────┬──────────┘
        서버 주소       기관코드      서비스(입찰공고)        업무(용역 목록 조회)

(3) 요청변수

창구에 내미는 검색 조건입니다. 주소 뒤에 ?를 붙이고, 이름=값 형태로 적으며, 여러 개일 때는 &로 잇습니다.

...getBidPblancListInfoServc  ?  inqryDiv=1  &  numOfRows=100  &  type=json
                              ↑              ↑
                        조건 시작 표시    조건 사이 구분

나라장터 용역 공고 조회에서 자주 쓰는 변수입니다.

• 요청변수에는 필수와 선택이 있습니다. 필수 변수 하나만 빠져도 데이터 대신 에러가 돌아옵니다.
• 날짜 형식처럼 값의 모양이 정해진 변수가 많습니다. 2026-08-01이 아니라 202608010000입니다.

(4) 인증키

내가 누구인지 증명하는 회원증입니다. 공공데이터포털에서 해당 API를 '활용신청'하면 발급됩니다.

• 다른 요청변수와 똑같이 serviceKey=발급받은키 형태로 주소에 함께 실어 보냅니다.
• 포털은 인증키를 Encoding 키 / Decoding 키 두 가지로 보여줍니다. 둘을 바꿔 넣는 것이 실습 중 오류 1순위 원인입니다.
  하나로 안 되면 다른 하나로 바꿔서 한 번 더 시도해 봅니다.
• 인증키는 본인 것입니다. 화면 공유·업로드·블로그 게시 시 반드시 가려주세요.
• 하루 요청 횟수(트래픽) 제한이 있습니다. 개발용은 보통 하루 1,000건 수준이며, 테스트를 반복할 때는 numOfRows를 작게 두고 확인합니다.

조립하면 이렇게 됩니다

엔드포인트                              ?  요청변수들 (인증키 포함)
─────────────────────────────────────────────────────────────────
http://apis.data.go.kr/1230000/BidPublicInfoService/getBidPblancListInfoServc
  ?serviceKey=발급받은키
  &inqryDiv=1
  &inqryBgnDt=202608010000
  &inqryEndDt=202608312359
  &pageNo=1
  &numOfRows=100
  &type=json

이 한 줄이 곧 "요청방식 GET으로, 이 창구에, 이런 조건으로, 이 회원증을 들고 요청한다"는 뜻입니다.

3. API 응답

요청을 보내면 서버는 정해진 형식의 데이터 덩어리로 답합니다.

(1) 응답형식 — JSON

응답은 보통 JSON 또는 XML로 받을 수 있고, 우리는 다루기 쉬운 JSON을 씁니다.
JSON은 "이름": 값 쌍을 모아 놓은 형태로, 항목마다 이름표가 붙어 있는 목록이라고 보면 됩니다.

(2) 응답 구조 — header 먼저, body 나중

공공데이터 응답은 대부분 아래 구조를 따릅니다.

response
├─ header   … 요청이 잘 처리됐는지 알려주는 영수증
│   ├─ resultCode  처리 결과 코드 (00 이면 정상)
│   └─ resultMsg   결과 메시지
└─ body     … 우리가 원한 실제 데이터
    ├─ totalCount  조건에 맞는 전체 건수
    ├─ numOfRows / pageNo
    └─ items       공고 목록 (한 건씩 반복)

데이터가 안 보인다고 당황하기 전에 header의 resultCode부터 확인하는 것이 순서입니다.

(3) JSON 응답 예시

{
  "response": {
    "header": { "resultCode": "00", "resultMsg": "NORMAL SERVICE." },
    "body": {
      "totalCount": 213,
      "numOfRows": 100,
      "pageNo": 1,
      "items": [
        {
          "bidNtceNo": "20260812345",
          "bidNtceNm": "○○시 홈페이지 개편 용역",
          "ntceInsttNm": "○○시청",
          "bidNtceDt": "2026-08-03 10:00:00",
          "bidClseDt": "2026-08-13 10:00:00"
        }
      ]
    }
  }
}

items 안의 이름표(bidNtceNm 등)가 웹툴 화면의 각 열이 됩니다. 화면에 "공고명"을 띄우려면 그 값이 실제로 어떤 이름표에 담겨 오는지를 알아야 합니다.

(4) 자주 만나는 응답

코드가 안 될 때 가장 빠른 해결책은 완성된 요청 주소를 브라우저에 붙여넣어 실제 응답을 눈으로 보는 것입니다.

4. API 문서는 처음부터 끝까지 읽는 문서가 아닙니다

실제 API 참고문서에는 여러 업무구분, 요청변수, 수십 개의 출력값이 함께 들어 있습니다.
전체를 외우는 대신 오늘 할 일에 필요한 부분만 찾아 작업문서로 바꿔 사용합니다.

공식 참고문서
→ 용역 공고번호 조회 부분만 선택
→ 요청변수와 출력값을 AI로 정리
→ 공식 문서와 다시 대조
→ 코드 제작에 사용

작업문서로 옮길 때 챙길 것은 다섯가지 입니다.

• 엔드포인트 주소 (업무구분에 맞는 것)
• 필수 요청변수와 값의 형식
• 인증키를 싣는 변수명
• 화면에 쓸 출력값의 이름표
• 응답 예시 1건

5. 요약

6. 예시

나라장터 GET 요청 — 인증키가 붙은 형태

이 주소를 브라우저 주소창에 붙여넣으면, 코드를 한 줄도 쓰지 않고 응답을 확인할 수 있습니다.
( <인증키> 부분에 발급받은 공공 API 인증키 입력 필요)

https://apis.data.go.kr/1230000/ad/BidPublicInfoService/getBidPblancListInfoServc?serviceKey=<인증키>&inqryDiv=1&inqryBgnDt=202608010000&inqryEndDt=202608312359&pageNo=1&numOfRows=100&type=json

→ 인증키가 없을 경우 아래와 같이 응답이 나오게 됩니다.

AI는 API 문서를 읽기 쉽게 정리하지만, 변수명의 정확성은 공식 문서와 실제 응답으로 다시 확인합니다.

준비 - 7주차 폴더 만들기

1. 6주차 폴더와 같은 위치에 새 폴더를 만듭니다.
2. 폴더 이름을 7주차_API로 지정합니다.
3. 오늘 다운로드하는 공식 문서와 완성하는 HTML을 이 폴더에 저장합니다.

7주차_API/
  조달청_OpenAPI참고자료_나라장터_입찰공고정보서비스_1.2.docx
  나라장터_API_작업문서.txt
  나라장터공고조회기_v0.1.html

인증키를 별도 파일로 만들어 이 폴더에 저장하지 않습니다.

실습 1 - 공공데이터 API 활용신청과 인증키 받기

사용할 API 활용신청을 가장 먼저 진행합니다.

1. 회원가입과 로그인

1. Chrome 또는 Edge에서 공공데이터포털을 엽니다.

2. 계정이 없으면 회원가입을 완료합니다.

3. 로그인합니다.

   

2. 정확한 API 찾기

1. 검색창에 아래 이름을 그대로 입력합니다.

   복사

   조달청_나라장터 입찰공고정보서비스
   

2. 검색결과에서 데이터 유형이 Open API인 항목을 선택합니다.

   

   조달청_나라장터 입찰공고정보서비스 바로가기

이름이 비슷한 나라장터 공공데이터개방표준서비스는 오늘 사용할 API가 아닙니다.

3. 개발계정 활용신청

1. API 상세페이지의 활용신청을 누릅니다.

   

2. 활용목적은 용도에 맞게 작성합니다.

   

3. 신청을 완료하고 승인 상태를 확인합니다.

   

이 API는 개발단계 자동승인 대상이며, 개발계정의 신청 가능 트래픽은 일 1,000건입니다.

4. 인증키 확인

1. 마이페이지 를 누르고 나오는 화면 중간에서 아래와 같이 인증키를 확인할 수 있습니다.
2. Encoding 인증키와 Decoding 인증키를 안전한 곳에 저장합니다.

인증키는 API 마다 새로 받는 것이 아닙니다. 기존 인증키가 있으면 계속 사용 가능합니다

• Encoding 인증키와 Decoding 차이점

  주소를 직접 만드는 QueryString 방식은 Encoding,
  URLSearchParams가 주소를 만들 때는 Decoding 인증키를 사용합니다.

  주소창에 입력할때는 Encoding, 웹툴에선 Decoding 방식을 주로 사용합니다.

  사용 위치	오늘 사용할 키
  브라우저 주소창 GET 테스트	Encoding 인증키
  HTML의 URLSearchParams	Decoding 인증키

실습 2 - 공식 API 문서를 AI로 작업문서로 바꾸기

1. 공식 참고문서 다운로드

1. 활용신청 현황 에서 조달청_나라장터 입찰공고정보서비스 상세페이지를 엽니다.

   

2. 참고문서 영역에서 조달청_OpenAPI참고자료_나라장터_입찰공고정보서비스_1.2.docx를 다운로드합니다.

   

3. 7주차_API 폴더에 저장합니다.

2. AI에게 공식 문서 전달

1. ChatGPT 또는 Claude에서 새 대화를 시작합니다.
2. 다운로드한 공식 DOCX 파일을 첨부합니다.
3. 아래 프롬프트를 복사하여 붙여넣습니다.

복사 프롬프트 ① — 용역 공고번호 조회 부분만 정리

첨부한 문서는 조달청 나라장터 입찰공고정보서비스 공식 참고문서야.

용역 입찰공고를 입찰공고번호로 조회하는 데 필요한 부분만 아래 형식으로 정리해줘.

1. 사용할 상세기능명과 요청주소
2. 요청변수: 영문명 / 의미 / 사용할 값
3. JSON에서 resultCode, resultMsg, totalCount, items의 위치
4. 입찰공고번호, 공고명, 수요기관, 개찰일시의 영문 필드명
5. 직접 테스트 해볼수 있는 완성된 요청 URL (키값이나 입력이 필요한 변수는 표시)
6. 문서에서 직접 확인하지 못한 내용

조건
- 문서에 없는 내용은 추측하지 마.
- 공사·물품·외자 API를 섞지 마.
- 영문명은 번역하거나 바꾸지 마.
- 실제 인증키를 요청하지 마.

3. AI가 정리한 내용 검증

AI의 정리 결과를 아래 정답표와 비교합니다.
영문명이 한 글자라도 다르면 코드를 만들기 전에 수정합니다.

(1) 사용할 상세기능명과 요청주소

• 상세기능명

  구분	정답
  서비스	조달청_나라장터 입찰공고정보서비스
  업무구분	용역
  상세기능	입찰공고목록 정보에 대한 용역조회
  오퍼레이션	getBidPblancListInfoServc
  요청 방식	GET
  응답 형식	JSON

• 요청주소 : https://apis.data.go.kr/1230000/ad/BidPublicInfoService/getBidPblancListInfoServc

(2) 요청변수: 영문명 / 의미 / 사용할 값

inqryDiv=2는 입찰공고번호로 조회한다는 의미입니다.

(3) 응답 구조 (JSON에서 resultCode, resultMsg, totalCount, items의 위치)

response
├─ header
│  ├─ resultCode
│  └─ resultMsg
└─ body
   ├─ totalCount
   └─ items
      └─ [0]

공식 명세의 개념 모델과 실제 JSON 표시가 다르게 보일 수 있습니다.
이번 교안에서는 브라우저로 확인한 실제 JSON의 response.body.items 배열을 기준으로 사용합니다.

(4) 필요한 영문 필드명 (입찰공고번호, 공고명, 수요기관, 개찰일시)

(5) 직접 테스트 해볼수 있는 완성된 요청 URL

http://apis.data.go.kr/1230000/ad/BidPublicInfoService/getBidPblancListInfoServc?inqryDiv=2&bidNtceNo=[입찰공고번호]&pageNo=1&numOfRows=10&type=json&ServiceKey=[인증키]

4. 완료 확인

• 용역조회 오퍼레이션이 getBidPblancListInfoServc로 정리되었다.
• 요청주소가 공식 문서와 같다.
• serviceKey의 대소문자가 정확하다.
• inqryDiv=2와 bidNtceNo가 포함되었다.
• JSON 응답을 위해 type=json이 포함되었다.
• 표시할 네 개 필드의 영문명을 공식 문서와 대조했다.
• AI가 다른 업무구분 API를 섞지 않았다.
• 직접 테스트 해볼수 있는 완성된 요청 URL이 포함되었다.

AI가 정리한 내용을 정답표에 맞게 바로잡은 뒤 저장합니다.

나라장터_API_작업문서.txt

주의) 작업문서에는 실제 인증키를 넣지 않습니다.

실습 3 - 브라우저 주소창에서 GET 요청하기

HTML을 만들기 전에 API 요청 자체가 정상적으로 작동하는지 먼저 확인합니다.
이 단계가 성공하면 인증키, 요청주소, 요청변수, 공고번호까지는 올바르다는 뜻입니다.

1. GET 요청주소 준비

실습 2 에서 확인한 직접 테스트 해볼수 있는 완성된 요청 URL 을 참고하여 진행합니다.

https://apis.data.go.kr/1230000/ad/BidPublicInfoService/getBidPblancListInfoServc?serviceKey=[**Encoding인증키]**&pageNo=1&numOfRows=10&type=json&inqryDiv=2&bidNtceNo=**R26BK01340148**

1. Encoding 인증키 전체를 자신의 Encoding 인증키로 교체합니다.
2. 대괄호 [ ]와 안내 문구가 남지 않게 합니다.

2. 주소창에서 실행

1. Chrome의 시크릿 창 또는 Edge의 InPrivate 창을 엽니다. (브라우저에서 키보드 단축키 Ctrl + Shift + N)
2. 완성된 한줄의 GET 요청주소를 주소창에 붙여넣고 엔터버튼을 누릅니다.
3. JSON 형식의 긴 응답값이 표시되는지 확인합니다.

3. 응답값에서 필요한 값만 찾기

긴 JSON 전체를 처음부터 읽을 필요는 없습니다.
Ctrl+F를 눌러 아래 영문명을 하나씩 검색합니다.

resultCode
resultMsg
totalCount
bidNtceNo
bidNtceNm
dminsttNm
opengDt

정상 응답 정답

JSON에 위 값이 있다면 API 요청 자체는 성공한 것입니다.

브라우저 GET 테스트 완료 확인

• JSON으로 응답되었다.
• resultCode가 00이다.
• totalCount가 1이다.
• 입찰공고번호·공고명·수요기관·개찰일시가 정답표와 같다.

여기까지 성공하기 전에는 HTML 코드를 만들지 않습니다. 먼저 API 요청을 성공시키면, 이후 문제가 API 설정인지 HTML 코드인지 구분하기 쉬워집니다.

실습 4 - 웹툴 요구사항 확인하기

6주차에서 연습한 방식을 그대로 이어갑니다.
바로 코드를 요청하지 않고, 웹툴이 어떤 입력을 받아 어떤 요청을 보내고 무엇을 표시할지 먼저 확인합니다.

이번 주 기능범위

복사 프롬프트 ② — 웹툴 요구사항 확인

공식 API 문서를 정리한 같은 AI 대화에 아래 프롬프트를 복사합니다.

방금 정리한 API로 로컬 HTML 웹툴을 만들 거야.

입력은 인증키와 입찰공고번호야.
조회 버튼을 누르면 용역 공고번호 조회 API를 GET으로 한 번 호출해.
결과에서 입찰공고번호, 공고명, 수요기관, 개찰일시를 화면에 보여줘.

이번에는 결과가 1건인 테스트 공고만 사용할 거야.
다중 차수, 상세항목, 복잡한 오류처리는 추가하지 마.

아직 코드는 작성하지 말고,
이해한 입력·처리·출력과 확인이 필요한 부분만 짧게 정리해줘.

AI 답변 확인

AI의 답변에서 다음을 확인합니다.

• 인증키와 공고번호를 사용자가 입력한다.
• getBidPblancListInfoServc를 GET으로 호출한다.
• inqryDiv=2를 사용한다.
• 응답에서 지정한 네 가지 값을 읽는다.
• 요청하지 않은 일괄조회·다중 차수·저장 기능을 추가하지 않았다.

이해한 내용이 다르면 코드를 요청하기 전에 짧게 바로잡습니다.

실습 5 - 나라장터 공고 단건 조회 웹툴 만들기

복사 프롬프트 ③ — 나라장터공고조회기_v0.1 만들기

AI가 요구사항을 올바르게 이해했다면 이어서 아래 프롬프트를 입력합니다.

이해한 내용이 맞아. 이제 실행 가능한 HTML을 만들어줘.

필수 기능
- 비밀번호형 Decoding 인증키 입력칸, 입찰공고번호 입력칸, 공고 조회 버튼
- 요청주소: https://apis.data.go.kr/1230000/ad/BidPublicInfoService/getBidPblancListInfoServc
- URLSearchParams로 serviceKey, pageNo=1, numOfRows=10, type=json, inqryDiv=2, bidNtceNo 전달
- 인증키와 공고번호의 앞뒤 공백을 제거한 뒤 사용
- response.header.resultCode가 "00"이고 결과가 있으면 response.body.items[0]의 네 값 표시
- 표시할 필드: bidNtceNo, bidNtceNm, dminsttNm, opengDt
- 조회 전에 두 입력을 확인하고, 빈 입력이 있으면 API를 호출하지 않고 안내 표시
- 결과가 없거나 요청이 실패하면 원인을 세분화하지 말고 하나의 공통 안내 표시
- 인증키 입력칸에 autocomplete="off"를 적용하고 페이지를 열거나 새로고침할 때 값을 비우기

인증키는 HTML 코드에 미리 넣거나 브라우저에 저장하지 마.
외부 라이브러리나 CDN을 사용하지 마.
수정 없이 바로 저장해 실행할 수 있는 전체 HTML을 하나의 코드 블록으로 출력해줘.

HTML 파일로 저장·실행

1. AI 답변의 <!DOCTYPE html>부터 </html>까지 전체를 복사합니다.

2. 메모장에 붙여넣습니다.

3. 7주차_API 폴더에 아래 이름으로 저장합니다.

   복사

   나라장터공고조회기_v0.1.html
   

4. 파일 형식은 모든 파일, 인코딩은 UTF-8로 선택합니다.

5. 저장한 HTML을 더블클릭하여 Chrome 또는 Edge에서 엽니다.

코드에 인증키가 들어 있지 않은지 확인

1. HTML 파일을 메모장으로 다시 엽니다.
2. 자신의 인증키 앞부분 8자를 Ctrl+F로 검색합니다.
3. 검색 결과가 없어야 합니다.
4. HTML을 다시 브라우저로 엽니다.

실습 6 - 완성한 웹툴 테스트하기

테스트 1 - 정상 공고 A

1. 인증키 입력칸에 Decoding 인증키를 넣습니다.
2. 공고번호칸에 R25BK01099370 를 입력합니다.
3. 공고 조회 버튼을 한 번 누릅니다.
4. 아래 결과와 비교합니다.

테스트 2 - 다른 공고 B

첫 번째 공고의 값을 코드에 고정해 놓지 않았는지 확인합니다.

1. 공고번호를 R25BK01093927 로 변경합니다
2. 공고 조회 버튼을 다시 누릅니다.
3. 아래 결과와 비교합니다.

두 번째 결과가 보이고 첫 번째 공고값이 남아 있지 않아야 합니다.

완료 확인

• 두 개의 공고번호가 서로 다른 정보로 표시된다.
• 나중에 조회한 공고만 화면에 보인다.
• 입력이 빈 상태에서는 API를 호출하지 않는다.
• 새로고침하면 인증키가 사라진다.
• HTML 코드에 실제 인증키가 들어 있지 않다.

웹툴이 제대로 작동하지 않을 때

오류를 다시 설명하기 전에 브라우저 주소창 GET이 성공했는지부터 구분합니다.

Encoding·Decoding 키를 바꿔 사용한 경우

• 브라우저 주소창에서는 Encoding 키를 사용합니다.
• 이번 HTML에서는 Decoding 키를 입력합니다.
• Encoding 키를 URLSearchParams에 넣으면 % 기호가 다시 변환되어 인증에 실패할 수 있습니다.

AI에게 오류를 알릴 때

인증키를 빼고 아래 정보만 전달합니다.

브라우저 주소창 GET은 [성공 / 실패]했어.
HTML에서 공고번호 [사용한 번호]를 조회했어.
기대 결과는 [기대한 값]이고, 실제 결과는 [화면 문구]야.
실제 인증키는 제거했어.
원인을 짧게 설명하고 수정된 전체 HTML을 출력해줘.

[현재 HTML 전체]

오류 응답에 전체 요청 URL이 표시되면, AI에게 보내기 전에 serviceKey=부터 다음 & 전까지를 [삭제]로 바꿉니다.

인증키 발급이 지연되거나 API가 일시적으로 작동하지 않을 때

실습을 모두 중단하지 말고 다음까지 먼저 진행합니다.

1. 공식 API 참고문서를 다운로드합니다.
2. AI로 요청변수와 출력필드를 정리합니다.
3. 교안의 정답표와 대조합니다.
4. 7주차_정상응답_예시.json을 열어 JSON 구조와 네 개 필드의 위치를 확인합니다.
5. 인증키가 준비되면 실습 3의 브라우저 GET부터 다시 진행합니다.

제공된 JSON은 실제 응답에서 이번 주에 사용할 값만 남긴 교육용 축약본입니다. 이를 읽은 것은 응답 구조 확인이며, 실제 API 연결 성공으로 표시하지 않습니다.

결과물 저장하기

7주차_API 폴더에 다음 세 파일이 있는지 확인합니다.

7주차_API/
  조달청_OpenAPI참고자료_나라장터_입찰공고정보서비스_1.2.docx
  나라장터_API_작업문서.txt
  나라장터공고조회기_v0.1.html

• 공식 문서가 저장되어 있습니다.
• 검증한 API 작업문서가 저장되어 있습니다.
• 완성한 HTML을 열면 입력창·조회 버튼·결과 영역이 보입니다.
• HTML 코드에 인증키가 들어 있지 않습니다.
• 인증키는 별도 파일로 저장하지 않습니다.

심화 과제 — 인증키 자동 인식하기

기본 실습에서는 공고를 조회할 때마다 Decoding 인증키를 직접 입력했습니다. 심화 과제에서는 인증키를 별도 설정 파일에 저장하고, HTML이 이를 자동으로 불러오도록 개선해보세요.

인증키는 HTML 코드에 직접 작성하지 않고 api-key.js 파일에서 관리합니다.

완성 모습

구현 힌트

AI에게 다음과 같이 요청해보세요.

지금 첨부한 파일은 나라장터의 공고를 조회하는 HTML 웹툴인데, 인증키를 매번 입력하는 것이 번거로워서 개선하려고 해. 해당 HTML과 같은 폴더에 api-key.js 파일을 두고, 여기에 저장된 Decoding API Key를 자동으로 불러오게 수정해줘. 인증키가 설정되지 않았으면 안내 메시지를 보여주고, 기존 공고 조회 기능은 그대로 유지해줘.

완료 확인

• 화면에서 인증키 입력칸이 사라졌다.
• 입찰공고번호만 입력해 공고를 조회할 수 있다.
• 새로고침 후에도 인증키를 다시 입력할 필요가 없다.
• 인증키가 없으면 설정 안내가 표시된다.
• 실제 인증키 파일을 외부에 공유하지 않았다.

오늘 완료 확인

• 공공데이터포털 회원가입과 로그인을 완료했다.
• 조달청_나라장터 입찰공고정보서비스를 활용신청했다.
• Encoding·Decoding 인증키의 사용 위치를 구분했다.
• 공식 API 참고문서를 AI로 필요한 부분만 정리했다.
• AI가 정리한 오퍼레이션·요청변수·필드명을 공식 문서와 대조했다.
• 브라우저 주소창에서 GET 요청을 성공했다.
• resultCode=00, totalCount=1을 확인했다.
• Decoding 인증키와 공고번호를 입력하는 HTML을 만들었다.
• 두 개의 공고번호가 서로 다른 공고정보로 표시되는지 테스트했다.
• 브라우저 JSON과 HTML의 네 개 값을 대조했다.
• HTML·AI 대화·테스트 기록에 실제 인증키를 남기지 않았다.

공식 참고자료

• 공공데이터포털 공공데이터 활용방법
• 조달청_나라장터 입찰공고정보서비스
• 공공데이터포털 API 호출 URL 생성 가이드

오늘의 핵심

API 활용은 코드부터 시작하는 일이 아닙니다. 정확한 서비스를 신청하고, 공식 문서에서 요청변수와 출력값을 확인한 뒤, 가장 단순한 요청을 먼저 성공시켜야 안정적인 웹툴로 발전시킬 수 있습니다.