공공데이터포털 API 키 설명

공공데이터포털에서 제공하는 인증키를 사용하여 API를 호출하는 방법에 대해 설명드리겠습니다. 주어진 키를 통해 우편번호 검색 및 주소 변환을 구현하는 방법을 구체적으로 설명하고 수정하겠습니다.

공공데이터 포털 API키

1. 공공데이터포털 API 키 설명

공공데이터포털에서 제공하는 API 키는 두 가지 형식으로 제공됩니다:

• 인코더: URL 인코딩된 키 (Cu3dK7Tl6%2FIlpFbkeJfNkwRQc2Bb2Q92Fy1cRO3sqffMMnADmK%2BaHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw%3D%3D)
• 디코더: 디코딩된 키 (Cu3dK7Tl6/IlpFbkeJfNkwRQc+b2Q2Fy1cRO3sqffMMnADmK+aHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw==)

일반적으로 API 호출 시 URL 인코딩된 키를 사용합니다. 디코더 키는 인코딩된 키의 디코딩된 버전으로, 실제 사용 시에는 URL 인코딩된 키를 사용하는 것이 좋습니다.

2. API 엔드포인트와 키 사용 방법

1. 우편번호 검색 API:
   • 엔드포인트: https://api.odcloud.kr/api/15075657/v1/uddi:5e37e2a5-1e12-4129-91cf-e5d0eb0e8e0c
   • 인증키: serviceKey=Cu3dK7Tl6%2FIlpFbkeJfNkwRQc%2Bb292Fy1cRO3sqffMMnADmK%2BaHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw%3D%3D
2. 주소 변환 API:
   • 엔드포인트: https://api.encoding.example.com
   • 인증키: key=Cu3dK7Tl6%2FIlpFbkeJfNkwRQc%2Bb2Q9Fy1cRO3sqffMMnADmK%2BaHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw%3D%3D

3. 워드프레스 플러그인 

zipcode-converter.php 파일을 수정하여 실제 API 엔드포인트와 키를 사용하도록 변경하겠습니다.

3.1 zipcode-converter.php 파일 

php

코드 복사

<?php
/*
Plugin Name: Zipcode Converter
Description: 우편번호 검색 및 영어 주소 변환 기능을 제공하는 플러그인입니다.
Version: 1.0
Author: Your Name
*/

function zipcode_converter_shortcode() {
    ob_start();
    ?>
    <div id="zipcode-converter">
        <form id="zipcode-search-form">
            <input type="text" id="zipcode" name="zipcode" placeholder="우편번호를 입력하세요">
            <button type="button" onclick="searchAddress()">검색</button>
        </form>
        <div id="address-results"></div>
        <div id="english-address"></div>
    </div>
    <script>
        function searchAddress() {
            const zipcode = document.getElementById('zipcode').value;
            const encodedKey = 'Cu3dK7Tl6%2FIlpFbkeJfNkwRQc%2Bb2Q92Fy1cRO3sqffMMnADmK%2BaHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw%3D%3D';
            fetch(`https://api.odcloud.kr/api/15075657/v1/uddi:5e37e2a5-1e12-4129-91cf-e5d0eb0e8e0c?page=1&perPage=10&serviceKey=${encodedKey}&zipcode=${zipcode}`)
                .then(response => response.json())
                .then(data => {
                    let results = '<ul>';
                    data.data.forEach(address => {
                        results += `<li>
                            <button type="button" onclick="convertToEnglish('${address.roadAddr}')">${address.roadAddr}</button>
                        </li>`;
                    });
                    results += '</ul>';
                    document.getElementById('address-results').innerHTML = results;
                })
                .catch(error => console.error('Error:', error));
        }

        function convertToEnglish(address) {
            const encodedKey = 'Cu3dK7Tl6%2FIlpFbkeJfNkwRQc%2Bb2Q92Fy1cRO3sqffMMnADmK%2BaHN1NBTAOsXIjQ3e04XBEfOMbHKuXPTP7eBw%3D%3D';
            fetch(`https://api.encoding.example.com?key=${encodedKey}&text=${encodeURIComponent(address)}`)
                .then(response => response.json())
                .then(data => {
                    document.getElementById('english-address').innerText = data.encodedText;
                })
                .catch(error => console.error('Error:', error));
        }
    </script>
    <?php
    return ob_get_clean();
}

add_shortcode('zipcode_converter', 'zipcode_converter_shortcode');
?>

4. 스타일 추가

4.1 style.css 파일 생성

css

코드 복사

/* style.css */
body {
    font-family: Arial, sans-serif;
    margin: 20px;
}

h1, h2 {
    color: #333;
}

form {
    margin-bottom: 20px;
}

input[type="text"] {
    padding: 5px;
    width: 200px;
}

button {
    padding: 5px 10px;
    background-color: #007bff;
    color: #fff;
    border: none;
    cursor: pointer;
}

button:hover {
    background-color: #0056b3;
}

ul {
    list-style-type: none;
    padding: 0;
}

li {
    margin-bottom: 10px;
}

4.2 zipcode-converter.php 파일에 스타일 등록

php

코드 복사

function zipcode_converter_enqueue_styles() {
    wp_enqueue_style('zipcode-converter-style', plugin_dir_url(__FILE__) . 'style.css');
}
add_action('wp_enqueue_scripts', 'zipcode_converter_enqueue_styles');

5. 테스트

1. 플러그인 활성화: 워드프레스 관리자 페이지로 이동하여, 플러그인 메뉴에서 Zipcode Converter 플러그인을 활성화합니다.
2. 페이지에 숏코드 추가: 새 페이지나 포스트를 생성하고, [zipcode_converter] 숏코드를 추가합니다.
3. 테스트:
   • 우편번호를 입력하고 검색 버튼을 클릭하여, 검색 결과가 제대로 나오는지 확인합니다.
   • 검색 결과 중 하나를 선택하고 영어로 변환 버튼을 클릭하여, 변환된 영어 주소가 제대로 표시되는지 확인합니다.

결론

실제 API 엔드포인트와 인증키를 사용하여 위 코드를 수정하면, 우편번호 검색과 주소 변환 기능이 정상적으로 작동할 것입니다. 문제가 발생하면, 콘솔에 출력된 오류 메시지를 확인하고 문제를 해결하세요