GCPプロジェクトの準備(API有効化とOAuthクライアント作成)

← YouTubeの連携にもどる

YouTube連携では、自分の Google Cloud(GCP)プロジェクト で作成したOAuthクライアントを使います。このページでは、GCPプロジェクトの準備(YouTube Data API v3 / BigQuery の有効化)からクライアントID発行までを順番に解説します。

最終的に手に入れるのは次の3つです。これをアプリのアカウント連携画面の「GCPプロジェクト」セクションに登録します。

  • クライアントIDxxxxx.apps.googleusercontent.com
  • クライアントシークレットGOCSPX-...
  • GCPプロジェクトIDmy-project-123456

ヒント

クライアントの設定ファイル(JSON)をダウンロードすれば、上記3つがまとめて含まれます。アプリ側は「JSONをアップロード」するだけで登録できます。

前提

  • Googleアカウントを持っていること
  • Google Cloud Console にアクセスできること(無料で利用開始できます)

手順1: プロジェクトを作成(または選択)する

  1. Google Cloud Console を開きます。
  2. 画面上部の プロジェクト選択メニュー(プロジェクト名が表示される部分)をクリックします。
  3. 「新しいプロジェクト」 を押し、プロジェクト名を入力して作成します(既存プロジェクトを使う場合は選択するだけでOK)。
  4. 作成後、プロジェクトIDmy-project-123456 のような文字列)を控えます。プロジェクト選択メニューやダッシュボードで確認できます。

注意

プロジェクト「名」とプロジェクト「ID」は別物です。アプリに登録するのは ID のほうです(自動採番された英数字。後から変更できません)。

手順2: YouTube Data API v3 と BigQuery を有効化する

プロジェクトでは次の 2つのAPI を有効化します。

API用途
YouTube Data API v3動画の限定公開アップロード
BigQuery APIアナリティクス(GA4)データの参照・広告費用レポートの自動インポート
  1. 左上のナビゲーションメニューから 「APIとサービス」→「ライブラリ」 を開きます。
  2. 検索ボックスに YouTube Data API v3 と入力して選択し、「有効にする」 を押します。
  3. 同様にライブラリへ戻り、BigQuery API を検索して選択し、「有効にする」 を押します(新規プロジェクトでは最初から有効になっている場合もあります。その場合はそのままでOK)。

注意

YouTube Data API のクォータは **GCPプロジェクト単位で10,000ユニット/日(限定公開アップロード約100本)**です。本数が多い場合はプロジェクトを分け、それぞれでこの手順を行ってください。

手順3: OAuth同意画面を設定する

クライアントIDを作る前に、同意画面(ユーザーに権限を求める画面)の設定が必要です。

ヒント

Google Cloud ConsoleのUIは順次更新されており、この設定は 「APIとサービス」→「OAuth同意画面」 または 「Google Auth Platform」 という名称で表示されます。項目名(対象ユーザー/ブランディング/スコープ/テストユーザー)はどちらも共通です。

  1. 「APIとサービス」→「OAuth同意画面」 を開きます。
  2. User Type(対象ユーザー)「外部」 にして作成します。
  3. アプリ情報(アプリ名・ユーザーサポートメール・デベロッパー連絡先)を入力します。
  4. スコープ は、ここでは追加しなくても連携できます(実際のスコープは連携時にアプリ側から要求されます)。
  5. 公開ステータス を確認します。
    • 「テスト」 のままにする場合は、テストユーザー に連携予定のGoogleアカウント(自分のメールアドレス)を必ず追加します。
    • 追加しないと同意画面で「アクセスをブロック」エラーになります。

重要

個人利用なら、公開(本番公開=Googleの審査が必要)にせず 「テスト」+テストユーザー登録 で十分です。テストモードのリフレッシュトークンは有効期限(7日)に注意が必要ですが、アプリは利用のたびにトークンを更新するため通常は問題ありません。期限切れで「再認証が必要」と表示されたら連携し直してください。

手順4: OAuth 2.0 クライアントID(ウェブアプリケーション)を作成する

  1. 「APIとサービス」→「認証情報」 を開きます。
  2. 上部の 「+ 認証情報を作成」→「OAuth クライアント ID」 を押します。
  3. アプリケーションの種類「ウェブ アプリケーション」 を選びます。
  4. 名前を任意で入力します(例: ad-submission-app)。
  5. 「承認済みのリダイレクト URI」 の「+ URIを追加」で、次を完全一致で登録します(末尾スラッシュなし)。
    • https://app.ad-submission.com/api/oauth/google/callback
  6. 「作成」 を押します。

注意

リダイレクトURIは1文字でも違うと redirect_uri_mismatch エラーになります。https・パス(/api/oauth/google/callback)・末尾スラッシュの有無を、上記のURLと厳密にそろえてください。

重要

localhost 以外のドメインは必ず https:// で登録・通信してください。 Google の OAuth 2.0 ポリシーでは、平文 http:// のリダイレクトURIが許可されるのは http://localhost:... のみです。本番ドメインを http:// のまま使うと、同意画面の手前で 「アクセスをブロック: エラー 400: invalid_request」 になります(アプリ側の環境変数 NEXT_PUBLIC_APP_URLhttps:// にすること)。

手順5: クライアントID・シークレット・JSONを取得する

作成完了のダイアログ、または認証情報一覧から該当クライアントを開くと確認できます。

  1. クライアントIDクライアントシークレット を控えます。
  2. 「JSONをダウンロード」 でクライアント設定ファイルを保存します(client_id / client_secret / project_id を含みます)。

重要

クライアントシークレットは秘密情報です。第三者に共有しないでください。アプリに登録するとサーバー側でAES-256-GCM暗号化して保存され、画面やAPIレスポンスに平文で出ることはありません。

手順6: アプリに登録する

取得した情報を YouTubeの連携ページ の手順に従って登録します。

  • アカウント連携画面の 「GCPプロジェクト」→「+ GCPプロジェクトを追加」→「JSONをアップロード」 にダウンロードしたファイルを渡す(最も簡単)
  • または「手動で追加」で クライアントID / クライアントシークレット / GCPプロジェクトID を入力

登録後、「YouTube」セクションの 「+ YouTubeアカウントを連携」 で、このGCPプロジェクトを選んで連携を開始します。

手順7: 案件プロジェクト(PJ)に紐づける

登録したGCPプロジェクトは、PJごとに紐づけて使います。

  1. サイドバーで対象のPJを選び、PJ概要/dashboard/projects/[projectId])を開きます。
  2. 「GCPプロジェクト」 セクションのプルダウンから、登録済みのGCPプロジェクトを選択します(選択した時点で自動保存されます。「未設定」に戻すとアプリ共通のOAuthクライアントにフォールバックします)。

紐づけたGCPプロジェクトは、そのPJの次の機能でデフォルト使用されます。

機能用途
アナリティクス(GA4)連携GA4 の認可に使うOAuthクライアント(アナリティクス
BigQuery費用レポート広告費用の自動インポート先のBigQuery(PJ概要の同名カード。紐付けが必須で、未設定のPJでは設定ボタンが無効になります)

うまくいかないときは

症状主な原因と対処
redirect_uri_mismatchリダイレクトURIの不一致。手順4のURIをアプリのURLと完全一致させる
400: invalid_request(アクセスをブロック)localhost 以外のドメインを http:// で使っている。NEXT_PUBLIC_APP_URL とリダイレクトURIを https:// にする(手順4の注意参照)
「Googleがアクセスをブロック」同意画面が「テスト」かつテストユーザー未登録。手順3でメールアドレスを追加する
403 / quota exceededYouTube Data APIのクォータ超過。翌日のリセット(PT 0:00)を待つか、別プロジェクトを使う
API未有効エラー手順2のYouTube Data API v3 / BigQuery API の有効化を確認する
リフレッシュトークンが取れないGoogleアカウント側でアプリのアクセス権を一度解除してから再連携する