読者です 読者をやめる 読者になる 読者になる

SIN@SAPPOROWORKSの覚書

C#を中心に、夜な夜な試行錯誤したコードの記録です。

CanvasアプリでFacebookから送られるユーザ情報について

1 signed_request

Facebookアプリ(Canvasアプリ)では、登録されたアプリをiframe内に表示する際、ユーザ情報を、signed_requestというパラメータに格納してアプリに送付します。
http://fb.dev-plus.jp/reference/coreconcepts/authentication/signed-request/

次の例は、パラメータを表示するだけのアプリですが、これをFacebookアプリ(Canvasアプリ)として登録し、「キャンパスページ」から呼び出すと、signed_requestが送られてきているのがわかります。


//---- HomeController.cs ----//
public class HomeController : Controller{
    public ActionResult Index(String signed_request){
        ViewBag.signed_request = signed_request;
        return View();
    }

//---- Index.cshtml ----//
@{
    Layout = null;
}
<h1>Index</h1>
signed_request = @ViewBag.signed_request

003

左は、アプリに直接アクセスしたのもで、右はキャンパスページからアクセスしたものです。

2 デコード

signed_requestは、HMAC SHA-256 signatureとピリオドと base64urlでエンコードされたJSONオブジェクトです。
下記のコードは、signed_requestからJSONオブジェクトを取り出しているものです。

 if (signed_request != null){
    string payload = signed_request.Split('.')[1];
    var decodedJson = payload.Replace("=",string.Empty).Replace('-','+').Replace('_','/');
    var base64JsonArray = Convert.FromBase64String(decodedJson.PadRight(decodedJson.Length + (4 - decodedJson.Length%4)%4,'='));
    var json = (new UTF8Encoding()).GetString(base64JsonArray);
    var data = JObject.Parse(json);
}

004

3 Facebook SDK利用によるデコード

Facebook SDK には、このsigned_requestをデコードするメソッドも提供されています。
非常にスマートです。


if (signed_request != null){
     var client = new FacebookClient();
     client.AppSecret = "XXXXXXXX";
     client.AppId = "XXXX";
     dynamic data = client.ParseSignedRequest(signed_request);
}

005


4 注意

signed_requestに含まれるJSONデータに「user_id」が含まれるかどうかで、このアプリが承認されているかどうかなどを確認することができますが、signed_requestをパラメータで受け取れるのは、あくまでキャンパスページからアクセスされた場合だけです。アプリ内で相対パスで移動した場合などは、格納されません。

signed_requestには、アクセストークンなども含まれますが、これを積極的に使用するのであれば、アプリ内の全てのページ遷移も、https://apps.facebook.com/アプリ名/から始まるFQDNで指定する必要があります。