Facebook 帆布接入的总结

研究接入facebook也有不短的时间，上线过几款产品，这里把接入所有的点都记录一下。

1.首先进入facebook的开发者页面，直接入口在右下角更多里面

然后注册开发者账号，创建APP 选择Facebook Canvas

然后得到app编号和密钥。

2.配置Canvas

这里添加的地址必须是 https的，而且不能是静态页面。

  <script>

        window.fbAsyncInit = function () {

            FB.init({

                appId: '830298307005763',

                xfbml: true,

                version: 'v2.3'

            });

            FB.login(function (response) {

                if (response.authResponse) {

                    // user sucessfully logged in

                    var accessToken = response.authResponse.accessToken;

                    if (accessToken)

                        window.location.href = "CallBack.aspx?accessToken=" + accessToken + "&userID=" + response.authResponse.userID + "&expiresIn=" + response.authResponse.expiresIn;

                }

            }, { scope: 'email' });

            function onLogin(response) {

                if (response.status == 'connected') {

                    FB.api('/me?fields=first_name', function (data) {

                        var welcomeBlock = document.getElementById('fb-welcome');

                        welcomeBlock.innerHTML = 'Hello, ' + data.first_name + '!';

                    });

                }

            }

            FB.getLoginStatus(function (response) {

                // Check login status on load, and if the user is

                // already logged in, go directly to the welcome message.

                if (response.status == 'connected') {

                    onLogin(response);

                } else {

                    // Otherwise, show Login dialog first.

                    FB.login(function (response) {

                        onLogin(response);

                    }, { scope: 'user_friends, email' });

                }

            });

            // ADD ADDITIONAL FACEBOOK CODE HERE

        };

        (function (d, s, id) {

            var js, fjs = d.getElementsByTagName(s)[0];

            if (d.getElementById(id)) { return; }

            js = d.createElement(s); js.id = id;

            js.src = "//connect.facebook.net/en_US/sdk.js";

            fjs.parentNode.insertBefore(js, fjs);

        } (document, 'script', 'facebook-jssdk'));

</script>

在Callback页面引用fb的 jsSDK，然后使用页面跳转的方式将accessToken传到服务端。这一步很重要，因为有了accessToken才可以调用FB接口换取长效证书。

  var url = "https://graph.facebook.com/oauth/access_token?grant_type=fb_exchange_token&client_id=" + app的编号 +

                  "&client_secret=" + app的密钥 +

                  "&fb_exchange_token=" + accessToken;

 string responseFromServer = wc.DownloadString(url);

string access_token = "";

String[] tokens = responseFromServer.Split(new char[] { '&' });

//expires：The number of seconds until this access token expires.

foreach (string t in tokens)

{

if (t.IndexOf("access_token") != -)

{

access_token = t.Split(new char[] { '=' })[];

}

}

使用fb的接口就能换取长效证书，并取出来。

用在下面的代码中，获取用户基本信息

   ////获取facebook用户基本信息

                    var url_basic = "https://graph.facebook.com/me?access_token=" + access_token;

                    string responseFromServer_basic = wc.DownloadString(url_basic);

                    string jsonStr_basic = reg.Replace(responseFromServer_basic, delegate(Match m) { return ((char)Convert.ToInt32(m.Groups[].Value, )).ToString(); });

                    ////获取facebook用户好友信息

                    var url_friends = "https://graph.facebook.com/me/friends?access_token=" + access_token;

                    string responseFromServer_friends = wc.DownloadString(url_friends);

到这里，接入部分的工作基本结束了。

3.支付

可以先看fb提供的文档 https://developers.facebook.com/docs/games_payments

首先需要有一个产品信息页，（我这里只做静态定价，不做动态定价因为没有具体需要的业务场景）

这里的内容其实还是动态的，需要根据支付时所选择的商品来显示。

<!DOCTYPE html><html>

 <head prefix=

    "og: http://ogp.me/ns#

     fb: http://ogp.me/ns/fb#

     product: http://ogp.me/ns/product#">
<meta property="fb:app_id" content="appid"><!--2.8版后 需要加上appid-->

    <meta property="og:type"                   content="og:product" />

    <meta property="og:title"                  content="Friend Smash Coin" />

    <meta property="og:image"                  content="http://www.friendsmash.com/images/coin_600.png" />

    <meta property="og:description"            content="Friend Smash Coins to purchase upgrades and items!" />

    <meta property="og:url"                    content="http://www.friendsmash.com/og/coins.html" />

    <meta property="product:plural_title"      content="Friend Smash Coins" />

    <meta property="product:price:amount"      content="0.30"/>

    <meta property="product:price:currency"    content="USD"/>

    <meta property="product:price:amount"      content="0.20"/>

    <meta property="product:price:currency"    content="GBP"/>

  </head>

</html>

这个页面其实就是给fb提供用户购买的商品信息。

然后在游戏页面的商城里用户选择购买商品以后调用 fb jsSDK的接口

 function FacebookCreditsOrder(order_info) {

              var obj = {

                method: 'pay',

                action: 'purchaseitem',

                product: order_info.url,//产品信息页面的地址

                request_id: order_info.pid//订单的id，必须是唯一的

                //quantity: 1

              };

              FB.ui(obj, function (data) {

                  if (data) {

                      var parameter = {

                          "amount": data.amount,

                          "currency": data.currency,

                          "payment_id": data.payment_id,

                          "quantity": data.quantity,

                          "signed_request": data.signed_request,

                          "status": data.status

                      };

                      if (data.status == 'completed') {// 这里 只处理了支付状态为成功的请求，其实还需要处理“等待中”的状态

                          var url = "https://**********/FaceBookReceiveOrder.ashx?amount=" + data.amount + "&currency=" + data.currency + "&payment_id=" + data.payment_id + "&quantity=" + data.quantity + "&signed_request=" + data.signed_request + "&status=" + data.status;

                          new Request(url, { method: "GET", maxTime: 8000 })

                      .on('complete', function (e) {

                          var return_obj = JSON.parse(e.text);

                          if (return_obj.State == 1) {

                              closeMall();

                          }

                          else if (orderinfo_obj.State != 1) { }

                      }).send();

                      }

                      else { }

                  }

              });

            }

支付页面处理：

需要使用Nuget 获取一个 Facebook的第三方插件。在处理加密时需要

为了安全，url里所包含的订单信息全不使用，而使用fb传过来的signed_request 加密参数。这个参数里包含了订单所需的全部信息，需要解密。

FacebookClient client = new FacebookClient();
client.AppId = "*******";//app编号
client.AppSecret = "*********";//app密钥

string signed = context.Request.QueryString["signed_request"];

                object obj = new object();

                client.TryParseSignedRequest(signed, out obj);

 if (obj != null)

                {

                    if (((Facebook.JsonObject)(obj)).TryGetValue("algorithm", out objtoken))

                        payInfo.algorithm = Convert.ToString(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("amount", out objtoken))

                        payInfo.amount = Convert.ToString(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("currency", out objtoken))

                        payInfo.currency = Convert.ToString(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("issued_at", out objtoken))

                        payInfo.issued_at = Convert.ToDecimal(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("payment_id", out objtoken))

                        payInfo.payment_id = Convert.ToDecimal(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("quantity", out objtoken))

                        payInfo.quantity = Convert.ToString(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("status", out objtoken))

                        payInfo.status = Convert.ToString(objtoken);

                    if (((Facebook.JsonObject)(obj)).TryGetValue("request_id", out objtoken))

                        payInfo.request_id = Convert.ToString(objtoken);

}

再根据订单信息处理添加商品等信息了。

这里可以根据订单id获取订单的支付情况

具体说明参考文档

https://developers.facebook.com/docs/games_payments/fulfillment

到这里fb的接入基本就完成了。

新版的app设置页面中默认是没有支付的，需要开发自己添加。

添加的时候需要填写公司信息，和回调url，也就是产品信息页的地址。

可以在测试者里添加开发测试的数字id。这样就可以不用付款就能测试到支付接口了。

Facebook 帆布接入的总结的更多相关文章

SDK接入(1)之Android Facebook SDK接入
SDK接入(1)之Android Facebook SDK接入由于游戏已上线,且处于维护阶段,所以有空写写各种SDK接入过程和遇到的问题,也当作一种工作总结.SDK接入主流分为这么几类,登录.支付. ...
手游接入Facebook的那些坑
之前工作须要在手游中接入了facebook,并以此写了<手游接入Facebook功能>的博文.当时facebook sdk的版本号还是3.x.代码集成度比較低.集成起来也比較麻烦.文中仅仅 ...
手游服务器端接入facebook的SDK
手游如果支持facebook登录,就要接入facebook的登录SDK.刚好工作中自己做了这一块的接入功能现在记录分享下来提供一个参考. 当前只是接入了登录这个功能,先简单的说说接入facebook登 ...
SDK接入(2)之Android Google Play内支付(in-app Billing)接入
SDK接入(2)之Android Google Play内支付(in-app Billing)接入继上篇SDK接入(1)之Android Facebook SDK接入整理完Facebook接入流程之 ...
Facebook登录 AndroidStudio
简介主页:https://www.facebook.com/ Android开发者支持:https://developers.facebook.com/docs/android/ 应用管理:htt ...
WebSocket协议与 IO多路复用
最近在把 Facebook Message 接入客服系统,由于与 Facebook Message 对接的收发消息都是通过调用 http 接口来实现的,如果想实现即时通讯,还需要在中间加一个 WebS ...
android开发步步为营之68:Facebook原生广告接入总结
开发应用的目的是干嘛?一方面当然是提供优质服务给用户,还有一方面最重要的还是须要有盈利.不然谁还有动力花钱花时间去开发app? 我们的应用主攻海外市场,所以主要还是接入国外的广告提供商.本文就今天刚完 ...
Android平台接入Facebook登录
官方教程地址: https://developers.facebook.com/docs/android/getting-started 开发环境为Android Studio,官方要求SDK最低版本 ...
零基础图文傻瓜教程接入Facebook的sdk
零基础图文傻瓜教程接入Facebook的sdk 本人视频教程系类 iOS中CALayer的使用 0. 先解决你的 VPN FQ上外网问题,亲,解决这一步才能进行后续操作^_^. 1. 点击右侧链接 ...

随机推荐

HTTP历程
原文http://www.ruanyifeng.com/blog/2016/08/http.html 1.HTTP/0.9 HTTP是基于TCP/IP协议的应用层协议.它不涉及数据包传输,主要规定了客 ...
Python’s SQLAlchemy vs Other ORMs[转发 0]
原文地址:http://pythoncentral.io/sqlalchemy-vs-orms/ Overview of Python ORMs As a wonderful language, Py ...
关于Cookies与Session系列一
这两个东西,最近项目操作的比较少,不过这两个在Web项目开发中一直都扮演着很重要的角色,有时有些细节会不小心就遗忘掉. Cookies 的概述 Cookies是由服务器端生成,发送给客户端,用来保存 ...
android模块混淆打包时，泛型丢失
现象:lib模块中写了一个泛型接口,在混淆之后泛型消失,提示"Error:(67, 79) 错误: 类型 ******* 不带有参数" 解决:混淆时把泛型给混淆掉了,在progua ...
高性能Web服务器Nginx的配置与部署研究系列（1）-- 入门 hello work
简介: Nginx 是一个基于 BSD-like 协议.开源.高性能.轻量级的HTTP服务器.反向代理服务器以及电子邮件(SMTP.POP3.IMAP)服务器.Nginx 是由一个俄罗斯的名叫“Igo ...
daydayup3 codeforces144C
上古的c还是很简单的,一直逗比忘记加EOF了,直到看了数据才发现题意:给你两个字符串a,b,求问字符串a里有多少个子串排列后可以生成字符串b,‘?’可以替换为任意小写字母思路:统计第一个子字符串小 ...
stm8s103 PWM
stm8s103 PWM的设置不难,但是很多人不注意选项字节这个问题,PWM是IO口的第二功能,要用ST Visual Programmer 修改选项字节. 只需要修改AFR0的功能就可以了
C# 通过反射类动态调用DLL方法
网上看了很多关于反射的思路和方法,发现这个还算不错 //使用反射方: using System; using System.Collections.Generic; using System.Linq ...
Android编程思想双11口诀
能复制就复制,节约时间避免出错保留原本结构,简单上手容易调试说明随手可得,不用上网或打开文档增加必要注释,说明功能和使用方法命名尽量规范,容易查找一看就懂函数尽量嵌套,减少代码容易修改最先 ...
Coding源码学习第三部分(EaseStartView.m)
首先接上篇的要做一个NSEnumerator 类的延展阅读. 枚举(NSEnumerator) (1)依附于集合类(NSArray,NSSet,NSDictionary),没有用来创建实例的接口. ( ...

Facebook 帆布接入的总结

Facebook 帆布接入的总结的更多相关文章

随机推荐

热门专题