技術メモ

プログラミングとか電子工作とか

YouTube Data API (v3)でOAuthを使ってAPIを使う準備 その1

どうも、靖宗です。

最近YouTubeAPIを触ることがあってメモ代わりに記事にします。
OAuthあたりはよく忘れるので・・・

オープンな情報ならAPI Keyを作成するだけで簡単なのですが、ユーザーに紐付いた操作などをする場合はOAuthの認証が必要です。
今回はAPI Keyの方は言及しませんがもしかしたらそのうち書くかも。

Google Cloud Platformで下準備

まずはGoogle Cloud Platform(GCP)のダッシュボードからプロジェクトを作成し、その元にアプリケーションを登録します。

console.cloud.google.com

アクセスするとログイン画面がでるので、APIで操作したいアカウントでログインします。

f:id:ysmn_deus:20190408112851p:plain

プロジェクト作成

プロジェクト毎に認証情報は異なる方が都合が良いのでプロジェクトを作成します。
左上の「プロジェクトの選択」から作成します。

f:id:ysmn_deus:20190408212505p:plain

f:id:ysmn_deus:20190408212642p:plain

f:id:ysmn_deus:20190408213001p:plain

プロジェクト名は各自好きに設定して下さい。

「作成」というボタンを押すと、ダッシュボードに戻されて右上でなんか進みます。
暫くすると「プロジェクト「○○」を作成」と表示されればプロジェクトの作成が完了していると思います。

OAuthクライアント

お次にアプリケーションの登録を行います。
左上のメニューマークから

f:id:ysmn_deus:20190408213445p:plain

f:id:ysmn_deus:20190408213602p:plain

APIとサービス」→「認証情報」を選択します。
プロジェクトが選択されてないと「このページを表示するには、プロジェクトを選択してください。」という表示が出ると思うので、右上の「プロジェクトの選択」から先ほど作成したプロジェクトを選択します。

f:id:ysmn_deus:20190408213847p:plain

プロジェクトが選択されていれば、「認証情報」という窓が表示されていると思うので、認証情報を作成していきます。

f:id:ysmn_deus:20190408214020p:plain

今回はOAuthを利用するのでOAuthクライアントIDを選択します。

f:id:ysmn_deus:20190408214059p:plain

同意画面の設定

進むと「OAuth クライアント ID を作成するには、まず同意画面でサービス名を設定する必要があります。」と警告されていると思います。
ユーザーがOAuthを利用する際に「承認しますか?」と聞かれるページに表示されている情報を設定して下さいという意図です。確かにそれがないと始まらない。
同意画面の設定ボタンを押して設定しときます。

f:id:ysmn_deus:20190408214314p:plain

設定画面が表示されますので、必要な情報を入力します。
とりあえず動かしたいって方はおそらく

  • アプリケーション名
  • サポートメール

だけ設定しておけばローカル環境では動きそうです。
もしサービスを運用するドメイン(URL)なども決まっている場合は「承認済みドメイン」の箇所を設定しておいて下さい。
たぶんここを設定してないとなにがしかのトラブルに巻き込まれます(不正な認証情報だとか云々?しらんけど)。
実際にOAuthを利用するサービスにする場合はちゃんとポリシーなんかのアドレスも設定して下さい。

f:id:ysmn_deus:20190408214903p:plain

設定できたら「保存」を押して同意画面の設定を完了します。

f:id:ysmn_deus:20190408215016p:plain

クライアントIDの作成

同意画面の設定を完了できればようやくクライアントIDの発行ができます。

f:id:ysmn_deus:20190408215210p:plain

今回はWebアプリケーションを想定して一番上の「ウェブアプリケーション」を選択します。

承認済みのJavaScript生成元

ちょっと画像に入れ忘れてたんですが、ローカル環境で開発する際は「承認済みのJavaScript生成元」に"http://localhost"や"http://127.0.0.1:8000"などを設定しておかないとGoogleにはじかれます。

承認済みのリダイレクト URI

また、認証情報を取得してそのまま情報をアプリケーションのDBに格納したいというケースも考えられますが、そういった際にリダイレクトされるURL(URI)を「承認済みのリダイレクト URI」に設定しておきます。
例えば、承認済みのリダイレクト URIを"http://localhost/oauth/"に設定しておくと、OAuthの認証が終わった後に"http://localhost/oauth/?code=xxxxxxxxxxxxxx"へリダイレクトされます。
これを利用してアプリケーションは"アプリケーションのURL/oauth/?code=[認証トークン]"というルーティングに処理を書いておくことで認証トークンを取得することができます。

あとはYouTube Data APIを有効にするだけなんですが、別記事に記載します。