デバイスのシェア機能

デバイスのシェア機能を使用すると、デバイスのコンテンツを簡単にFacebookでシェアできます。たとえば、スマートTV、デジタルフォトフレーム、IoT (Internet of Things)デバイスでも利用できます。

デバイスシェアでは、デバイスに英数字のコードが表示され、デスクトップPCやスマートフォンのウェブページで入力するよう求められます。アプリやサービスの利用者は、そのコードに関連付けられたシェアダイアログを使用してコンテンツをFacebookでシェアできます。

Apple TVやAndroidデバイス用のアプリを開発している場合、tvOS用SDKまたはAndroid用SDKをそれぞれ使用してください。

このガイドでは次の項目について説明します。

操作性

1. コールトゥアクション

最初に、サービスの利用者に対して、どのタイミングでFacebookへのコンテンツシェアをリクエストするのかを検討します。最適な操作性を確保するために、できるだけ公式のFacebookシェアボタンに似たデザインのボタンを使用します。一般的に、ボタンはシェアするコンテンツの横に配置します。

ビジュアルデザインの観点では、次の設定が必要になります。

  1. ボタンに「シェア」や「Facebookでシェア」のラベルを付ける。
  2. 白色と、Facebookブランド公式の青色: #3B5998を使用する。
  3. デバイスがグラフィック表示に対応している場合は、「f」のロゴを組み込むことも検討してください。Facebookブランドガイドラインに従い、ロゴには白色とFacebookブルー(#3B5998)を使用します。

2. コードを表示する

利用者がコールトゥアクションをクリックすると、デバイスからFacebookのAPIに対して呼び出しが実行され、APIからコードが返されます。

インターフェイスに「次に、デスクトップまたはスマートフォンでfacebook.com/device (http://facebook.com/device)にアクセスし、このコードを入力してください」といったメッセージを表示して、利用者にウェブサイトにアクセスしてコードを入力する必要があることを伝えます。 FacebookのDevice Share APIから返されたコード全体を表示します。コードの長さは6文字以上、12文字以下です。

CloseボタンまたはDoneボタンを追加して、利用者がデバイスシェアフローを完了できるようします。

3. シェア機能

デスクトップまたはモバイルブラウザでfacebook.com/deviceにアクセスすると、このフローが表示されます。最初に、コードを入力するためのテキストフィールドが表示されます。

コードを入力し、Continueをクリックすると、シェアダイアログが表示されます。

シェアが正しく処理されると、次のような確認メッセージが表示されます。

デバイスのシェア機能の実装

デバイス用Facebookシェアは、インターネット経由でHTTP呼び出しを行うデバイス向けの機能です。デバイスでは次のようなAPI呼び出しや応答を利用できます。

1. デバイス用Facebookログインを有効にする

アプリダッシュボードを開き、[設定] > [詳細] > [OAuth設定] > [デバイスログイン]を[はい]に変更します。

2. コードを生成する

[Share]コールトゥアクションがクリックされたら、デバイスから次のようなHTTP POSTを実行します。

POST https://graph.facebook.com/device/share
       access_token=<APPID|CLIENT_TOKEN>
       href=<LINK_TO_SHARE>

CLIENT_TOKENは[アプリ設定] > [詳細]で確認できます。アプリIDとパイプ|で区切って組み合わせてaccess_tokenの形式にします。

Open Graph storyをシェアする場合、APIでは「href」ではなく、「action_type」と「action_properties」がサポートされます(シェアダイアログでのOpen Graph actionと同じ動作)。

また、APIでは「quote」と「hashtag」のパラメーターもサポートされます(シェアダイアログのパラメーターと同じ動作)。

応答は次の形式で行われます。

{
  "user_code": "A1NWZ9",
  "verification_uri": "https://www.facebook.com/device",
  "expires_in": 420,
}

応答の内容:

  1. デバイスに「A1NWZ9」の文字列を表示します。
  2. 利用者に「facebook.com/device」にアクセスしてこのコードを入力するよう指示します。
  3. コードの有効期限は420秒です。有効期限が過ぎたらコードの表示を閉じるようにしてください。

3. コードを表示する

デバイスにuser_codeを表示し、PCやスマートフォンからverification_uri (facebook.com/deviceなど)にアクセスするように利用者に指示します。「操作性」をご覧ください。

トラブルシューティング

HTTP経由でデバイスフローリクエストを行うことはできますか。
トークンを使用したGraph APIには、TLS/HTTPSが必要です。

GETメソッドを使用してデバイスフローリクエストを行うことはできますか。
デバイスフローリクエストはすべてPOSTリクエストで行う必要があります。

利用者がシェアをいつ完了したのかを確認できますか。
いいえ、できません。

利用者に代わってプログラムを使用して投稿できますか。
いいえ、できません。この操作を行うには、利用者に、ログインして自身に代わって投稿するためのアクセス権を付与するよう依頼する必要があります。詳しくは「Publishing with the Graph API (Graph APIを使用した公開)」をご覧ください。