LoginSignup
9
0

More than 1 year has passed since last update.

はじめに

  • openBDという使い勝手がよさそうな書籍検索のApiがあったので使って書籍情報を取得できるところを目標に使ってみる
  • 2021/12/18 初版

OpenBDについて

  • 上記のサイトで提供している
  • 本の販促、紹介などを行う分には特に制約などもなさそう
  • 会員登録などの必要もなし

実際に情報を取得してみる

index.html
<!DOCTYPE html>
<html lang="ja">

<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>Document</title>
  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"></script>
  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
</head>

<body>
  <div id="app">
    {{ info }}
  </div>

  <script>
    new Vue({
      el: '#app',
      data() {
        return {
          info: null
        }
      },
      mounted() {
        axios
          .get('https://api.openbd.jp/v1/get',{
            params:{
              isbn: 9784757506206
            }
          })
          .then(response => (this.info = response))
      }
    })
  </script>
</body>

</html>
  • 上記でapiをたたいてisbnコードが「9784757506206」の書籍のデータ(鋼の錬金術師1巻)を取得した
  • 以下実行結果のスクリーンショット image.png
  • 以下のスクリーンショットはisbnコード「9784908356254」の書籍データ(ぐりとぐらのたまご)を取得した場合の結果 image.png
  • スクリーンショットの記載の通り、本によって取得できる情報量にばらつきがある(書影画像のURLがあったりなかったり...)

その他

最後に

  • 今回はjson形式で本の情報を取得するだけだったが、続編としてjsonで得た情報を使っていろいろ試していきたい
9
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
9
0