개발 노트

카카오 책검색 api 사용하기 본문

JavaScript

카카오 책검색 api 사용하기

알 수 없는 사용자 2022. 1. 8. 19:33 
<!DOCTYPE html>
<html lang="ko">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>API 연습</title>
</head>

<body>
    <h1>내 사이트임 ㅎㅇ</h1>
    <input id="bookName" value="" type="text">
    <button id="search">검색</button>
    <p></p>
    <script src="https://code.jquery.com/jquery-3.6.0.js"
        integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"></script>
    <script>
             $(document).ready(function () {
            $("#search").click(function () {
        $.ajax({
            method: "GET",
            url: "https://dapi.kakao.com/v3/search/book?target=title",
            data: { query: $("#bookName").val() },
            headers: {Authorization: "카카오 자기꺼 api id"}
        })
            .done(function (msg) {
                console.log(msg.documents[0].title);
                console.log(msg.documents[0].thumbnail);
                $( "p" ).append( "<strong>"+msg.documents[0].title+"</strong>" );
                $( "p" ).append( "<img src='"+msg.documents[0].thumbnail+"'/>" );
            });
        });
            })
    </script>
</body>

</html>
저작자표시

'JavaScript' 카테고리의 다른 글

Javascript - LocalStorage  (0) 2022.11.11
자바스크립트 fetch,callback,promise,async 게시글  (0) 2022.01.10
사칙연산 연습문제 만들기  (0) 2022.01.07
사칙연산 사이트 만들기  (0) 2022.01.05
투두리스트 html,css,js  (0) 2022.01.03
'JavaScript' Related Articles more