top pageへ.

Programming Room.

GCP Tips.

GAE Tips.

Identity Platformの使い方 : Twitter IDプロバイダの設定.2020/05/07

 Twitter IDプロバイダの設定方法の説明です。


おしながき

Twitter Developerでのアプリ登録.

 Twitter含めてフェデレーション IDプロバイダの設定はGCP/Firebaseでは完結できず、フェデレーション IDプロバイダでの設定が必要です。Twitterの場合はTwitterのDeveloperサイトで設定します。このサイトは残念ながら日本語には対応していません。

 Twitterに対して、以下の2つの登録が必要です。


 登録を行ったTwitterアカウントがそのアプリの管理者となるので、管理者にしたいアカウントで登録作業を行ってください。


開発者登録.

  1. ブラウザでDeveloperサイトのAppsページを開きます。Twitterでのログインが必要なので、Twitterアカウントがなければ作ってください。TwitterのDeveloperサイトトップからだと、ログイン後に右上の「you 」 をポイントして表示されるメニューから「Apps」を選択します。
  2. TwitterのDeveloperサイトの「Apps」ページでアカウントに属するTwitterアプリの一覧が表示されます。以下のキャプチャ画像ではまだ1つもアプリを登録していませんので、「No apps here.」と表示されています。右上の「Create an app」を押して、アプリの追加を始めます。
  3. 初めてTwitterにアプリを登録する場合、まずは開発者登録が必要になります。その確認メッセージが表示されますので、次に進みます。すでに開発者登録が済んでいるアカウントの場合、これ以降の手順はスキップされます。
  4. 開発者登録しようとしている理由を確認されます。目的に応じて適当に選んでください。
  5. 登録内容の確認画面に変わります。デフォルトでは組織による開発になっています。個人で開発している場合は「Switch to an individual developer account」をクリックします。
  6. 前記の手順5で"個人"を選択しなかった場合、組織についての情報の入力を求められます。上から順に...
    • Team name = チームの名称
    • Legal entity name = 法人名
    • Organization Twitter = 組織のTwitterアカウント名
    • Website URL = 組織のWebサイトのURI
    • Organization primary country of operation = 組織が主に営業している国
    "個人"を選択した場合は、手順8までスキップします。
  7. これも前記の手順5で"個人"を選択しなかった場合のみです。Twitter APIおよびTwitterのデータをどのように使用するかを登録します。ページが縦長で 1画面に収まらないので、2回に分けてキャプチャしました。入力は英語で。文字数制限がある入力項目は地味につらいです。上から順に...
    • Twitter APIおよびTwitterのデータをどのように使用するか。200文字以上。
    • Twitterのデータを解析するか。
    • ツイート/リツイート/ライク/フォロー/ダイレクトメッセージの機能を使用するか。
    • Twitterの外部で、ツイートや収集したデータを表示するか。
    • 製品/サービス/分析によって、Twitterコンテンツまたは派生した情報は、政府機関が利用できるか。

  8. これまでの入力内容の確認です。正しければ「Looks good!」を押して、やっと入力が完了。
  9. 開発者契約の画面に遷移します。お約束のヤツです。全部読んだら画面下のチェックボックスをチェックし、「Submit Application」を押します。
  10. 登録完了の画面に遷移します。

アプリ登録.

準備.

 Twitter Developerへアプリを登録する前に、GCPコンソールで1つだけ準備があります。ログイン成功時のコールバックURIを確認しておくことです。
 GCPコンソールの「新しいIDプロバイダ」画面でTwitterを選択して遷移した「Twitterプロバイダの編集」画面の、「Twitterを構成する」の下に記載されているURIを保存しておきます。タブや別ウィンドウでこの画面を保存しておくのが楽です。


Twitter Developerへのアプリ登録手順.

  1. 画面右上の「you 」 をポイントして表示されるメニューから「Apps」を選択すると、アカウントに属するTwitterアプリの一覧が表示されます。以下のキャプチャ画像ではまだ1つもアプリを登録していませんので、「No apps here.」と表示されています。右上の「Create an app」を押して、アプリの追加を始めます。
  2. アプリの詳細の入力を求められます。英文の入力項目が複数あって、地味につらいです。少しだけダメージのある攻撃を受け続けている感じで、HPが半減させられてしまいます。必須の項目以外は、あとから入力でも構わないと思います。縦長のページなので後半はキャプチャできていませんが、上から順に...
    • App name = アプリ名。32文字以内。
    • Application description = アプリの説明。10〜200文字。
    • Website URL = アプリのURI。
    • Enable Sign in with Twitter = ツイッターアカウントによるログインを有効化。本ページの目的である「TwitterアカウントによるGAEアプリへのログインの実装」を実現するためには、チェックが必要です。
    • Callback URLs = ログイン成功時の遷移先URI。 前記の「準備」で保存しておいたURIを、そのまま入力します。
    • Terms of Service URL = アプリの利用規約が書かれたページのURI。
    • Privacy policy URL = アプリのプライバシーポリシーが書かれたページのURI。
    • Organization name = 組織名。
    • Organization website URL = 組織のWebサイトのURI。
    • Tell us how this app will be used = このアプリがどのように使われるか。100文字以内。Twitter社の中の人が見るだけで、Twitterユーザには公開されません。
  3. 「Create」ボタンを押して登録完了。
  4. 登録されたアプリからTwitter APIにアクセスするためのキーなどが表示されます。

 これでTwitterへのGAEアプリの登録は完了です。
 上記の手順で入力した内容は、DeveloperサイトのAppsページから、アプリの行の右端にある「Details」ボタンを押すと再表示できます。GCPの設定に使うAPIキーとAPIシークレットキーも、「Keys and tokens」タブを選択すれば再表示されます。


GCPコンソールでの設定.

 GCPコンソールでTwitter IDプロバイダを設定する手順は、以下のとおりです。公式ドキュメントでは「JavaScriptによるTwitterを使用した認証」ページの「準備」に説明されています。


  1. GCPコンソールは「新しいIDプロバイダ」ページまたは「Twitterプロバイダの編集」ページになっているはずです。 一番上の「有効」のスイッチがONになっていることを確認します。
  2. 「アプリID」に、前記「Twitter Developerへのアプリ登録手順」の手順4で入手したAPI keyを、そのまま入力します。
  3. 「アプリシークレット」に、前記「Twitter Developerへのアプリ登録手順」の手順4で入手したAPI secret keyを、そのまま入力します。
  4. 「保存」を押して完了。

Firebaseコンソールでの設定.

 Firebaseコンソールからも設定可能です。
 Authenticationページの「Sign-in method」タブを選択し、「ログインプロバイダ」のリストで「Twitter」をマウスでポイントしたときに右端に表示される鉛筆アイコンを押して、編集ダイアログを表示させます。GCPコンソールでの設定と同様に「有効にする」スイッチをONにし、「APIキー」と「APIシークレット」を入力し、「保存」したら完了です。


▲page top.
Copyright 2005-2021, yosshie.