【Rails】Youtube APIを使ってIDで動画を検索する

# はじめに
この記事ではポートフォリオ作成中に学んだことを自分のために記録しています。
初学者のため、理解が不十分なところがあるかもしれません。
その場合はご指摘いただけると幸いです。

# やりたいこと
YouTubeの動画IDから動画情報を検索し、タイトル・概要欄・サムネイルを取得する

# 準備
- APIキーの取得
- APIキーを環境変数に設定
- YouTube Data API v3を使うためのgemをインストール

この３つを準備していきます。

## APIキーの取得
- Google Cloud Consoleにログイン
- 新しいプロジェクトを作成

![77772AA8-87F8-4842-93B5-FAAF741B9554_1_105_c.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/b59aafd9-fba9-448f-e181-76b62371327a.jpeg)
<br>


- 使用するAPIの有効化

**APIとサービス**の**ライブラリ**から使用するものを選びます。
![CFD8577F-ECF5-4153-A3D5-5BB976AC6BFB_1_201_a.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/90b09ef3-1dcb-be7c-9956-e251dea66f8f.jpeg)

![2BD853AF-81F6-4605-9264-C4DC0F9A4563_1_105_c.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/25b3e5a1-36d1-f120-f878-e94d50f86baa.jpeg)

![C9F7A280-5A1E-42DF-8FF9-0F1BCFBB6C64_1_105_c.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/25110063-0af0-4541-f701-e63e1adcdd27.jpeg)

Google mapsなどいろんなAPIがありますが、今回はYouTube Data API v3を選択します。
<br>


- アプリケーション制限の設定

APIキーを悪用されないように指定したURLでしか使用できないよう制限をかけます。
サイトのすべてのURLを許可する場合は **example.com/\*** のように設定します。

![92573187-1972-42BA-8E14-74CFE6A9D3B9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/af4f052e-9f64-8be4-a4a0-da09040144b0.png)
<br>

- APIの制限

念のため取得したAPIキーではYouTube Data API v3しか利用できないよう制限をかけておきます。
（上記のアプリケーション制限の設定をしていれば不要かもしれません）
![4C99C30A-F36D-4776-9907-7263112D4C7C.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/c371067e-644d-518d-d855-cb2ac2721567.png)

![F7D28762-B248-4BD7-860E-6C4DA2EBE840.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3671013/44eaab9b-80a0-a928-6754-00a59ba59be1.png)
<br>

これでAPIキーの準備ができました！
認証情報からAPIキーをコピーし、環境変数の設定に進みます。
<br>

## APIキーを環境変数として保存
APIキーは機密情報のため、**dotenv-rails**というgemを使用し環境変数として管理します。

- dotenv-railsのインストール
```ruby:Gemfile
gem 'dotenv-rails'
```

- .envファイルの作成

```.env
YOUTUBE_API_KEY= "*****************"
```
ここに先ほど発行したAPIキーを入力します。

- .gitignoreへ追記 **（重要！）**
```.gitignore
.env
```
環境変数を記載した.envはGitHubにプッシュしないよう.gitignoreに追加しておきましょう。
<br>

## gemのインストール
YouTube Data API v3を扱うためのgemをインストールします。
```ruby:Gemfile
gem 'google-apis-youtube_v3'
```

私は初め**google-api-client**も一緒にインストールしていたのですが、[GitHub](https://github.com/googleapis/google-api-ruby-client)を読む限りどうやら不要なようです。

# いざ実装
実際に動画情報を取得していきます。
bookmarkモデルのvideo_idカラムの値を使用して動画を検索したいので、BookmarksHelperを作成しました。

```app/helpers/bookmarks_helper.rb
module BookmarksHelper
  def get_video_data(video_id)
    require 'google/apis/youtube_v3'

    youtube = Google::Apis::YoutubeV3::YouTubeService.new
    youtube.key = ENV['YOUTUBE_API_KEY']
    
    Rails.cache.fetch("bookmark_#{video_id}", expires_in: 1.days) do
      youtube.list_videos('snippet', id: video_id)
    end.items.first
  end

  def video_title(video_id)
    if get_video_data(video_id).present?
      get_video_data(video_id).snippet.title
    else
      "Video Not Found"
    end
  end

  def video_description(video_id)
    if get_video_data(video_id).present?
      get_video_data(video_id).snippet.description
    else
      "Video Not Found"
    end
  end

  def video_thumbnail(video_id)
    if get_video_data(video_id).present?
      thumbnails = get_video_data(video_id).snippet.thumbnails
      thumbnails_resolutions = [:maxres, :standard, :high, :medium, :default]
      thumbnails_resolutions.each do |resolution|
        return thumbnails.send(resolution).url if thumbnails.send(resolution)
      end
    else
      "not_found.png"
    end
  end
end

```

### 上記でやっていること
#### get_video_data
- キャッシュの保存期間を1日に設定
（Google APIの割り当てが1日ごとにリセットされるため）

- 動画IDで検索し、検索結果の最初の動画を取得
（検索結果は1件ですが配列で返ってくるためこの記述にしています）

#### video_title, video_description
- get_video_dataで取得した動画情報からそれぞれタイトル、概要欄を取得しています。
渡した動画IDの動画が存在しない場合は"Not Found"を返します。

#### video_thumbnail
- get_video_dataで取得した動画情報からサムネイルを取得しています。
サムネイルは解像度の高い順にmaxres, standard, high, medium, defaultの5種類があるため、その動画が持つサムネイルの中で一番解像度の高いものを返すようにしています。
<br>

ヘルパーはこれで完成です！
ビューファイルの中で
```
<%= video_title(@bookmark.video_id) %>
```
のように記述すれば動画IDから取得した動画の情報が表示できます。

# 感想
いろんな記事を参考にさせていただきながら実装しましたが、この記述は何をしているのか？というのを理解するには結局公式を見るのがわかりやすいな〜と感じました。
英語のドキュメントにも恐れず立ち向かっていかなければ…

# 参考
- [【Rails7】Maps JavaScript APIを使って投稿を地図上にピンで表示する](https://qiita.com/lemonade_37/items/51ca0f18fd9da842bb00)
- [【Rails】 初心者向け！gem 'dotenv-rails'の使い方](https://qiita.com/__Wata16__/items/d2d3aa21623f8c026d5d)
- [【Rails】YouTube Data APIを使用し動画情報を取得](https://zenn.dev/ganmo3/articles/de7084e2a77b1f)
- [railsアプリでyoutubeAPIを使用して動画情報を取得する](https://tech-garage-blog.com/rails/149/)
- [公式リファレンス](https://developers.google.com/youtube/v3/docs/videos?hl=ja)
- [公式ドキュメント](https://googleapis.dev/ruby/google-api-client/latest/Google/Apis/YoutubeV3/YouTubeService.html)