サーバー構築不要!スマートフォンアプリ向けの新クラウド

トップ >ドキュメント >チュートリアル:Sign in with Twitterと連携の設定

チュートリアル(Swift, iOS, Android, Unity)

Sign in with Twitterと連携の設定

概要

こちらではTwitterの管理画面でのアプリの作成、Twitterログインのためのキーの作成、mobile backendとTwitterアカウント情報の連携に必要な設定の手順について説明いたします。
※ 注意:以下の手順は2022/1時点で確認したものとなっています。

本機能を利用するために必要なこと

  • 連携にはTwitterのアカウントが必要です。。アカウントを持っていない場合、こちら(外部リンク)で登録してください。
  • また、FirebaseのAuthentication機能も利用することになりますので、Firebaseでプロジェクトを作成する必要があります。 Firebaseでプロジェクトを作成する手順は こちら の「プロジェクトを新規作成する」までの手順をご参照ください。
  • 最後に、mobile backend 管理画面での設定を案内いたしますので、mobile backend 管理画面にログインおよびアプリ作成も完了しておいてください。
Twitterアプリ作成
  • Twitterにログインして、Dashboard の画面で「Add App」をクリックします。

  • 「Create new」を選択し、進みます。

  • 「Choose an App environment」画面にてアプリの該当環境を選択し、進みます。

  • アプリの名前を入力します。

  • これまでアプリ作成は完了します。アプリ作成画面にはAPI KeyとAPI Key Secret が作成されます。後ほど設定に利用する予定なので、 メモに残してください。

Firebaseの設定

※ 注意:アプリでのFirebaseのCallbackURLの設定はSwiftAndroidiOSにのみ実装する必要があります。Unityの場合は不要です。

  • まず、Firebaseから発行されたCallbackURLの取得方法を説明します。
  • Firebaseコンソール でプロジェクト管理画面にて、左メニューにある 「Authentication」を開きます。(Firebaseでプロジェクトをお持ちではない場合、プロジェクトを新規作成を行ってから開いてください)
  • 「Sign-in method」タブで、「Add new provider」にて、プロバイダ一覧から 「Twitter」プロバイダを選択し、設定を行います。
  • 設定には最初に、「有効・ Enable」をONにしてください。「API Key」と「API Secret」はTwitterサイトにて、アプリを作成時に発行されたキーを入力してください。
  • 以下の画像にあるCallbackURLをコピーしてください。
Twitterの管理画面でcallbackUrlを設定
  • TwitterのDashboard の画面で アプリ名をクリックしてください。
  • 「App Details」の画面にある「User authentication settings」の右ある「Set up」をクリックします。

  • 「User authentication settings」の画面にて、OAuth および詳細設定を行い、「Callback URLs」を次の項目を参考にし入力
    を行います。「Website URL」項目も入力必要のため、ご注意ください。

Swift SDK、Android SDK、iOS SDKの場合:Twitter画面でCallback Urlを設定
  • Firebase側で発行されたCallback URLを以下のように設定して、「保存」します。

Unity SDKの場合:Twitter画面でCallback Urlを設定
  • Unity SDKの場合、Firebaseで発行されたコールバックを利用せず、xxxx:// の形式のスキームSchemaを入力してください。 例: myapp://

  • こちらで Callback URLの設定が終わります。
  • ※参考:TwitterのCallback URLsについてのドキュメントはこちらを参照してください。

mobile backendの設定連携

  • mobile backend 管理画面へログインして、該当アプリの「アプリ設定」の画面で「SNS連携」の項目を選択してください。

アプリの登録

  • 「Twitter連携の許可」を「許可する」にします。
  • 「Twitter Consumer Key」に「API key」を入力してください。
  • 最後は「保存する」 を押します。

お探しの内容が見つからなかった場合はユーザーコミュニティ もご活用ください。(回答保証はいたしかねます)
なお、 Expertプラン以上のお客様はテクニカルサポートにてご質問を承らせて頂きます。

推奨画面サイズ1024×768px以上

ページの先頭へ