Node.js
api
TypeScript
YouTube
YouTubeAPI

Youtube Data APIを使って検索ワードから動画情報を取得するまで

はじめに

最近、APIの便利さにハマり、いろんなAPIを使ってみたいと思うように!!
そこでYahoo!ショッピングAPIに続き、YouTubeのAPIを使ってみました。

手順

  1. Youtube Data APIへのアプリケーションの登録
    Googleアカウントを作成し、アプリケーションを登録する。そして、認証手続きをすることでAPIキーを取得する。
    ※ 今回はデータを取ってくるだけでユーザーに関する処理などは行わないので、OAuth 2.0は不要

    参考:
    - Youtube Data APIの概要
    - YouTube APIとは:Data API v3を使って動画情報を取得してみた。

  2. YouTube Data APIの認証を行う
    そのまま自前でやっても良いのだが、今回はnpmのパッケージ(youtube-node)を使用。

    $ npm i youtube-node
    
    api.ts
    import * as YouTube from 'youtube-node';
    
    // APIクライアントを生成
    const youTube = new YouTube();
    youTube.setKey('自身のAPIキー');
    
  3. APIを使って検索結果を取得
    SearchメソッドのDocument

    api.ts
    // キーワード(keyword)で10件検索
    const searchResult = youTube.search('keyword', 10, function(error, result) {
      if (error) console.log(error);
    
      return result;
    });
    

    検索結果のサンプル
    {
      "kind": "youtube#searchListResponse",
      "etag": "\"BDC7VThyM9nfoSQm1_kOyhtJTEw/0MX1aovXL6JrPZ_tgqxLQ_YhGWI\"",
      "nextPageToken": "CAIQAA",
      "pageInfo": {
        "totalResults": 680321,
        "resultsPerPage": 2
      },
      "items": [
        {
          "kind": "youtube#searchResult",
          "etag": "\"BDC7VThyM9nfoSQm1_kOyhtJTEw/a-ZTQv003uYyrrI2GTNl4LqjzoA\"",
          "id": {
            "kind": "youtube#video",
            "videoId": "HcwTxRuq-uk"
          },
          "snippet": {
            "publishedAt": "2012-11-09T00:01:39.000Z",
            "channelId": "UCRX7UEyE8kp35mPrgC2sosA",
            "title": "World War Z - Official Trailer (HD)",
            "description": "http://www.joblo.com - \"World War Z\" - Official Trailer Source: http://trailers.apple.com/trailers/paramount/worldwarz/ World War Z Twitter: https://twitter....",
            "thumbnails": {
              "default": {
                "url": "https://i.ytimg.com/vi/HcwTxRuq-uk/default.jpg"
              },
              "medium": {
                "url": "https://i.ytimg.com/vi/HcwTxRuq-uk/mqdefault.jpg"
              },
              "high": {
                "url": "https://i.ytimg.com/vi/HcwTxRuq-uk/hqdefault.jpg"
              }
            },
            "channelTitle": "joblomovienetwork",
            "liveBroadcastContent": "none"
          }
        },
        {
          "kind": "youtube#searchResult",
          "etag": "\"BDC7VThyM9nfoSQm1_kOyhtJTEw/zGTXymwvzqbUAYTanZwl0i0aw6g\"",
          "id": {
            "kind": "youtube#video",
            "videoId": "4EC7P5WdUko"
          },
          "snippet": {
            "publishedAt": "2013-03-25T07:02:54.000Z",
            "channelId": "UCkR0GY0ue02aMyM-oxwgg9g",
            "title": "World War Z TRAILER 2 (2013) - Brad Pitt Movie HD",
            "description": "Subscribe to TRAILERS: http://bit.ly/sxaw6h Subscribe to COMING SOON: http://bit.ly/H2vZUn Like us on FACEBOOK:http://goo.gl/dHs73. World War Z TRAILER ...",
            "thumbnails": {
              "default": {
                "url": "https://i.ytimg.com/vi/4EC7P5WdUko/default.jpg"
              },
              "medium": {
                "url": "https://i.ytimg.com/vi/4EC7P5WdUko/mqdefault.jpg"
              },
              "high": {
                "url": "https://i.ytimg.com/vi/4EC7P5WdUko/hqdefault.jpg"
              }
            },
            "channelTitle": "MovieclipsCOMINGSOON",
            "liveBroadcastContent": "none"
          }
        }
      ]
    }
    

  4. (+α) APIを使って動画の詳細情報を取得する
    3まででデータは取得できたのだが、上記のデータには視聴回数GOODやBADの評価数が含まれていない。このデータを取得するには別途Videoメソッドを利用し、ビデオの詳細情報を取得する必要がある。(VideoメソッドのDocument)

    api.ts
    let videoIdsStr = ''; // videoIdを格納する文字列
    const searchResult = await new Promise ((resolve, reject) => {
      youTube.search('keyword', 10, function(error, result) {
        if (error) reject(error);
    
        // 検索結果の全てのvideoIdをカンマで連結した文字列を生成する
        result.items.forEach(item => videoIdsStr += `${videoIdsStr ? ',' : ''}${item.id.videoId}`);
    
        resolve(result);
      });
    });
    
    // videoメソッドを利用し、ビデオの詳細情報を取得
    const videoResult = youTube.getById(videoIdsStr, function (error, result) {
      if (error) console.log(error);
    
      result.items.forEach(item => {
        console.log(`視聴回数:${item.statistics.viewCount}`);
        console.log(`GOOD数:${item.statistics.likeCount}`);
        console.log(`BAD数:${item.statistics.dislikeCount}`);
      });
    
      return result;
    });
    

    動画詳細のサンプル
    {
      "kind": "youtube#video",
      "etag": "\"BDC7VThyM9nfoSQm1_kOyhtJTEw/301XkUzcSqfJxZpqiffqf_pbSuM\"",
      "id": "HcwTxRuq-uk",
      "snippet": {
        "publishedAt": "2012-11-09T00:01:39.000Z",
        "channelId": "UCRX7UEyE8kp35mPrgC2sosA",
        "title": "World War Z - Official Trailer (HD)",
        "description": "http://www.joblo.com - \"World War Z\" - Official Trailer\n\nSource: http://trailers.apple.com/trailers/paramount/worldwarz/\n\nWorld War Z Twitter: https://twitter.com/WorldWarZMovie\n\nA U.N. employee is racing against time and fate, as he travels the world trying to stop the outbreak of a deadly Zombie pandemic.\n\nOfficial Site: http://www.WorldWarZMovie.com\n\nDirector: Marc Forster\n\nCast: Brad Pitt, Mireille Enos , Daniella Kertesz , James Badge Dale, Matthew Fox\n\nWriters: Matthew Michael Carnahan",
        "thumbnails": {
          "default": {
            "url": "https://i1.ytimg.com/vi/HcwTxRuq-uk/default.jpg"
          },
          "medium": {
            "url": "https://i1.ytimg.com/vi/HcwTxRuq-uk/mqdefault.jpg"
          },
          "high": {
            "url": "https://i1.ytimg.com/vi/HcwTxRuq-uk/hqdefault.jpg"
          },
          "standard": {
            "url": "https://i1.ytimg.com/vi/HcwTxRuq-uk/sddefault.jpg"
          }
        },
        "channelTitle": "JoBlo Movie Trailers",
        "categoryId": "24",
        "liveBroadcastContent": "none"
      },
      "contentDetails": {
        "duration": "PT2M27S",
        "dimension": "2d",
        "definition": "hd",
        "caption": "false",
        "licensedContent": true
      },
      "status": {
        "uploadStatus": "processed",
        "privacyStatus": "public",
        "license": "youtube",
        "embeddable": true,
        "publicStatsViewable": true
      },
      "statistics": {
        "viewCount": "29491223",
        "likeCount": "87750",
        "dislikeCount": "11873",
        "favoriteCount": "0",
        "commentCount": "60487"
      }
    }
    

備考

対象のビデオを視聴するためのURLはhttps://www.youtube.com/watch?v=[videoId]

最後に

次はどんなAPIを使おう?🤔