接入facebook幣金流教學

提供WOG各方面的技術問題,並提供最新path更新。

版主: 涅魂, 簫哥, 10度C~


ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

接入facebook幣金流教學

文章ETERNAL » 2011-06-25 2:28 pm

這幾天用java替公司加入消費facebook幣功能

昨天晚上用php替WOG也寫了一套,分享一下經驗

這是官方的 Facebook Credits 文件
http://developers.facebook.com/docs/creditsapi

內容落落長,英文不太好的人會看的很辛苦
其實要做的事情很簡單

準備工作:
下載官方範例,我們開始用這個範例開始修改
https://github.com/facebook/credits-api-sample

http://www.facebook.com/developers 建立你的應用
應用的部份有幾個關鍵
1.必須啟用 OAuth 2.0 for Canvas
2.facebook幣 要登錄公司資料(填個人資料也可以),並且設定paypal或bank做為你的收款帳戶
3.Credits Callback URL 這地方要輸入facebook跟你的金流接入口

準備工作做完了,接著開始修改Facebook Credits官方範例
要改的檔案只有兩個
index.php
callback.php
其他的可以無視

修改index.php
define('APP_ID', 'abc123'); 這邊要填寫應用程式ID (請注意:是ID不是KEY)

修改
callback.php
$api_key = '<api key>'; 這行可以注解掉不使用
$secret = '<secret>'; 這邊要填寫應用程式密鑰
include_once 'facebook.php'; 這行也可以注解掉不使用


接著上傳
index.php
callback.php
金流基礎功能,以上就修改完成了,以下開始說明細節

流程說明:

facebook是使用json跟你的callback.php做資料傳接
完成一次交易總共會做3次的傳接
我們來看一下這3次傳接了什麼東西

第1次傳接
facebook傳入:
{"algorithm":"HMAC-SHA256","credits":{"buyer":10000012345678,"receiver":10000012345678,"order_id":133557386724972,"order_info":"{\"title\":\"WOG\u904a\u6232\u9ede\",\"description\":\"\",\"price\":50,\"data\":\"ET_FB1\",\"image_url\":\"http:\/\/www.facebook.com\/images\/gifts\/21.png\",\"product_url\":\"http:\/\/www.facebook.com\/images\/gifts\/21.png\"}","test_mode":1},"expires":1308985200,"issued_at":1308979209,"oauth_token":"316161056134|2.AQBopf4B9pRzWKgt.3600.1308985200.1-10000012345678|Y5YB_hkE9Q6tchvOgIO2Z840Y50","user":{"country":"tw","locale":"zh_TW","age":{"min":21}},"user_id":"10000012345678"}


callback.php傳出:
{"content":[{"title":"WOG\u904a\u6232\u9ede","price":50,"description":"ET_FB1 \u514c\u63db 150 WOG\u904a\u6232\u9ede","image_url":"http:\/\/www.facebook.com\/images\/gifts\/21.png","product_url":"http:\/\/www.facebook.com\/images\/gifts\/21.png","data":"ET_FB1"}],"method":"payments_get_items"}


buyer 為買方FB帳號
user_id 為用戶FB帳號 (通常情況下與buyer相同)
order_id 為訂單號
order_info 訂單訊息,買家也會從這裡看到他買什麼東西
"method":"payments_get_items" 表示現在只是把東西顯示給用戶看,讓用戶確認是否要交易
data 若你希望在訂單中夾帶其他訊息,可以使用這個欄位,我在上面夾帶了我在遊戲中的帳號

第2次傳接
facebook傳入:
{"algorithm":"HMAC-SHA256","credits":{"order_details":"{\"order_id\":133557386724972,\"buyer\":10000012345678,\"app\":316161056134,\"receiver\":10000012345678,\"amount\":50,\"update_time\":1308979212,\"time_placed\":1308979209,\"data\":\"\",\"items\":[{\"item_id\":\"0\",\"title\":\"WOG\\u904a\\u6232\\u9ede\",\"description\":\"ET_FB1 \\u514c\\u63db 150 WOG\\u904a\\u6232\\u9ede\",\"image_url\":\"http:\\\/\\\/www.facebook.com\\\/images\\\/gifts\\\/21.png\",\"product_url\":\"http:\\\/\\\/www.facebook.com\\\/images\\\/gifts\\\/21.png\",\"price\":50,\"data\":\"ET_FB1\"}],\"status\":\"placed\"}","status":"placed","order_id":133557386724972,"test_mode":1},"expires":1308985200,"issued_at":1308979212,"oauth_token":"316161056134|2.AQBopf4B9pRzWKgt.3600.1308985200.1-10000012345678|Y5YB_hkE9Q6tchvOgIO2Z840Y50","user":{"country":"tw","locale":"zh_TW","age":{"min":21}},"user_id":"10000012345678"}


callback.php傳出:
{"content":{"status":"settled","order_id":1.3355738672497e+14},"method":"payments_status_update"}


amount 交易多少FB幣
order_info改為items紀錄訂單訊息
"status":"placed" 且 "method":"payments_status_update" 表示facebook跟callback.php確認是否要進行扣款交易
此時若你回傳"status":"placed"可以中止交易
範例中,我回傳"status":"settled",表示進行扣款

第3次傳接
facebook傳入:
{"algorithm":"HMAC-SHA256","credits":{"order_details":"{\"order_id\":133557386724972,\"buyer\":10000012345678,\"app\":316161056134,\"receiver\":10000012345678,\"amount\":50,\"update_time\":1308979213,\"time_placed\":1308979209,\"data\":\"\",\"items\":[{\"item_id\":\"0\",\"title\":\"WOG\\u904a\\u6232\\u9ede\",\"description\":\"ET_FB1 \\u514c\\u63db 150 WOG\\u904a\\u6232\\u9ede\",\"image_url\":\"http:\\\/\\\/www.facebook.com\\\/images\\\/gifts\\\/21.png\",\"product_url\":\"http:\\\/\\\/www.facebook.com\\\/images\\\/gifts\\\/21.png\",\"price\":50,\"data\":\"ET_FB1\"}],\"status\":\"settled\"}","status":"settled","order_id":133557386724972,"test_mode":1},"expires":1308985200,"issued_at":1308979213,"oauth_token":"316161056134|2.AQBopf4B9pRzWKgt.3600.1308985200.1-10000012345678|Y5YB_hkE9Q6tchvOgIO2Z840Y50","user":{"country":"tw","locale":"zh_TW","age":{"min":21}},"user_id":"10000012345678"}


callback.php傳出:
{"content":{"order_id":1.3355738672497e+14},"method":"payments_status_update"}


到這階段callback.php接到facebook傳回"status":"settled",表示交易已完成

上面已經把facebook與callback.php互相交互過程做了一次說明
後面我們針對實際需求,教大家如何客制自己的 index.php callback.php

程式說明:

在index.php中可以看到這段javascript

代碼: 選擇全部
      var title = document.getElementById('title_el').value;
      var desc = document.getElementById('desc_el').value;
      var price = document.getElementById('price_el').value;
      var img_url = document.getElementById('img_el').value;
      var product_url = document.getElementById('product_el').value;

      var order_info = { "title":title,
                         "description":desc,
                         "price":price,
                         "image_url":img_url,
                         "product_url":product_url
                       };


title 為物品名稱
desc 物品說明
price 交易FB幣金額
若要增加額外欄位,必需使用data,例如 "data":value

index.php其他的就是美化工作了,後面的callback.php才是重點

把callback.php看成這樣
代碼: 選擇全部
if ($func == 'payments_status_update') {
   if ($status == 'placed') {
      facebook第2次傳接訊息
   }else
   {
      facebook第3次傳接訊息
   }
} else if ($func == 'payments_get_items') {
   facebook第1次傳接訊息
}


以我的例子來做說明
facebook第2次傳接訊息時,我insert一筆訂單到wog_order表中
facebook第3次傳接訊息時,我update該筆訂單,在wog_order表裡改成已完成交易,並且在wog_player加入WOG點數
下圖是我程式的範例
未命名2.png
程式範例
未命名2.png (22.17 KiB) 被瀏覽 34240 次


這是我的wog_order表,給大家參考
未命名1.png
wog_order
未命名1.png (65.72 KiB) 被瀏覽 34240 次


PS.
由於facebook的數字是bigint,所以php的json_decode會把數字變成科學符號
若要解決這問題,在使用json_decode之後,可以使用BC Math,把bigint轉成字串處理

function parse_signed_request 為處理OAuth 2.0驗證使用


水色論壇 http://www.et99.net
簡恩峻分享


ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2011-06-25 2:43 pm

再2個補充額外的功能

代碼: 選擇全部
    function getMore(){
       // calling the API ...
       var obj = {
            method: 'pay',
            credits_purchase: true
       };
   
       FB.ui(obj, callback);
    };

使用getMore會提供這個功能
未命名3.png
getMore
未命名3.png (26.42 KiB) 被瀏覽 34233 次


代碼: 選擇全部
    function earnCredits(){

        // calling the API ...
        var obj = {
             method: 'pay',
             credits_purchase: true,
             dev_purchase_params: {"shortcut":"offer"}
        };

        FB.ui(obj, callback);
     };

使用earnCredits會提供這個功能
未命名4.png
earnCredits
未命名4.png (69.15 KiB) 被瀏覽 34233 次



水色論壇 http://www.et99.net
簡恩峻分享


ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2011-07-22 10:25 pm

bigint轉字串php範例
代碼: 選擇全部
   function bcconv($fNumber)
   {
       $sAppend = '';
       $iDecimals = ini_get('precision') - floor(log10(abs($fNumber)));
       if (0 > $iDecimals)
       {
           $fNumber *= pow(10, $iDecimals);
           $sAppend = str_repeat('0', -$iDecimals);
           $iDecimals = 0;
       }
       return number_format($fNumber, $iDecimals, '.', '').$sAppend;
   }



水色論壇 http://www.et99.net
簡恩峻分享


ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2011-12-13 10:41 am

以下為默然奇子,製作的.net範例

感謝他的分享,提供需要的朋友參考 :D

代碼: 選擇全部
using System;

using System.Collections.Generic;

using System.Web.Script.Serialization;

using System.Runtime.Serialization.Json;

using System.Runtime.Serialization;

using System.IO;

using System.Text;

using Facebook.Web;

using System.Web;

using Facebook;




public partial class FbPay : System.Web.UI.Page

{

    protected void Page_Load(object sender, EventArgs e)

    {

        if (!IsPostBack)

        {

            //Facebook币 回调页面

            string order_id = Request.Form["order_id"];//订单号

            string method = Request.Form["method"];

            string order_info = Request.Form["order_info"];//订单信息集合 让买方看到其所购买的信息详情




            //默认初始化参数

            FacebookBuyItem theItem = new FacebookBuyItem();

            theItem.title = "item not found";

            theItem.price = 10;

            theItem.image_url = "http://www.facebook.com/images/gifts/21.png";

            theItem.product_url = "http://www.facebook.com/images/gifts/21.png";

            theItem.description = "description";




            var res = new Dictionary<string, object>();




            //确认获取初始化购买信息

            if (method == "payments_get_items")//表示把订单信息显示给用户看 并决定是否有交易

            {

                //本次获取到的信息例子

                //buyer=xxx&receiver=xxx&order_id=xxx&order_info={"title":"title","description":"Description","price":"1","image_url":"http://www.facebook.com/images/gifts/21.png","product_url":"http://www.facebook.com/images/gifts/21.png"}&test_mode=1&method=payments_get_items




                string FbUserId = Request.Form["buyer"];//买方FbId




                //读取Json 字符数据

                JavaScriptSerializer serializer = new JavaScriptSerializer();

                Dictionary<string, object> json = (Dictionary<string, object>)serializer.DeserializeObject(order_info);

                object title, price, image_url, product_url, description;

                json.TryGetValue("title", out title);

                json.TryGetValue("price", out price);

                json.TryGetValue("image_url", out image_url);

                json.TryGetValue("product_url", out product_url);

                json.TryGetValue("description", out description);




                theItem.title = (string)title;

                theItem.price = Convert.ToUInt64(price);

                theItem.image_url = (string)image_url;

                theItem.product_url = (string)product_url;

                theItem.description = (string)description;




                res["method"] = method;

                res["content"] = new object[] { theItem };




                //购买  第一次 Facebook传入信息 并且回调传出信息 例子

                //{"content":[{"title":"WOG\u904a\u6232\u9ede","price":50,"description":"ET_FB1 \u514c\u63db 150 WOG\u904a\u6232\u9ede","image_url":"http:\/\/www.facebook.com\/images\/gifts\/21.png","product_url":"http:\/\/www.facebook.com\/images\/gifts\/21.png","data":"ET_FB1"}],"method":"payments_get_items"}

            }

            else if (method == "payments_status_update")

            {

                string status = Request.Form["status"];

                if (status == "placed")//status 值为 "placed" 中止交易 ,值为 "settled"确认交易

                {

                    //到这步可以获取单号进行生成订单了




                    //确认购买  第2次Facebook传入信息 并且回调传出信息 例子

                    //{"content":{"status":"settled","order_id":"207533562658899"},"method":"payments_status_update"}




                    var content = new Dictionary<string, object>();

                    content["status"] = "settled";

                    content["order_id"] = order_id;




                    res["content"] = content;

                    res["method"] = method;




                }

                else if (status == "settled")//交易成功

                {

                    //到这步说明购买的交易完成 可以进行更新订单了




                    //交易成功 第3次Facebook传入信息 执行事件




                }

            }




            JavaScriptSerializer jss = new JavaScriptSerializer();

            string ob = jss.Serialize(res);

            Response.ContentType = "application/json";

            Response.ContentEncoding = System.Text.Encoding.UTF8;

            Response.Write(ob);

            Response.End();




        }

    }




    /// <summary>

    /// 定义回调信息格式参数

    /// </summary>

    public class FacebookBuyItem

    {

        public int item_id { get; set; }

        public string title { get; set; }

        public string description { get; set; }

        public string image_url { get; set; }

        public string product_url { get; set; }

        public ulong price { get; set; }

        public string data { get; set; }

    }







}



水色論壇 http://www.et99.net
簡恩峻分享

kanhOf
 
文章: 3
註冊時間: 2012-01-13 10:14 am

Re: 接入facebook幣金流教學

文章kanhOf » 2012-02-04 4:51 pm

我按照以上的流程 也到facebook credit 下载新版的php sample 可可是改了之后没有反应一直出现错误 尤其是想保存订单到自己创建的数据库中老是出现“The application you are using is not responding.””




ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2012-02-06 10:20 am

kanhOf 寫:我按照以上的流程 也到facebook credit 下载新版的php sample 可可是改了之后没有反应一直出现错误 尤其是想保存订单到自己创建的数据库中老是出现“The application you are using is not responding.””


facebook沒有收到你的app回傳資料

1.可能是你在app上設定錯誤,facebook連錯網址
2.可能是你id跟key錯誤
3.可能是其他錯誤,造成你程序無法運行,造成facebook收不到你的回傳資料


水色論壇 http://www.et99.net
簡恩峻分享

kanhOf
 
文章: 3
註冊時間: 2012-01-13 10:14 am

Re: 接入facebook幣金流教學

文章kanhOf » 2012-02-06 11:15 am

ETERNAL 寫:
kanhOf 寫:我按照以上的流程 也到facebook credit 下载新版的php sample 可可是改了之后没有反应一直出现错误 尤其是想保存订单到自己创建的数据库中老是出现“The application you are using is not responding.””


facebook沒有收到你的app回傳資料

1.可能是你在app上設定錯誤,facebook連錯網址
2.可能是你id跟key錯誤
3.可能是其他錯誤,造成你程序無法運行,造成facebook收不到你的回傳資料


app上設定和id 、key這邊確認是正常的,搞笑的是我在官網上點擊儲值的時候會出現錯誤,必須要在facebook 畫布上點擊儲值才能正常彈出購買頁面,




ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2012-02-06 11:23 am

kanhOf 寫:
ETERNAL 寫:
kanhOf 寫:我按照以上的流程 也到facebook credit 下载新版的php sample 可可是改了之后没有反应一直出现错误 尤其是想保存订单到自己创建的数据库中老是出现“The application you are using is not responding.””


facebook沒有收到你的app回傳資料

1.可能是你在app上設定錯誤,facebook連錯網址
2.可能是你id跟key錯誤
3.可能是其他錯誤,造成你程序無法運行,造成facebook收不到你的回傳資料


app上設定和id 、key這邊確認是正常的,搞笑的是我在官網上點擊儲值的時候會出現錯誤,必須要在facebook 畫布上點擊儲值才能正常彈出購買頁面,


是的 此功能必須在facebook裡面使用

交易過程中是server對server,facebook 與 你的站台(server)
你的firebug(client)獲取不到任何錯誤訊息


水色論壇 http://www.et99.net
簡恩峻分享

kanhOf
 
文章: 3
註冊時間: 2012-01-13 10:14 am

Re: 接入facebook幣金流教學

文章kanhOf » 2012-02-06 11:59 am

嗯嗯1目前我主要是卡在 完全不知道他返回啥東西過來··
代碼: 選擇全部
if ($func == 'payments_status_update') {

    // Grab the order status
    $status = $_REQUEST['status'];
   
    // Write your apps logic here for validating and recording a
    // purchase here.
    //
    // Generally you will want to move states from `placed` -> `settled`
    // here, then grant the purchasing user's in-game item to them.
    if ($status == 'placed')
    {
      $next_state = 'settled';
      $data['content']['status'] = $next_state;   
      //我在這邊想看看當前狀態是怎樣的,只要我這邊寫入 echo 或者其他 都會出現錯誤。。。。。
    }





ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2012-02-08 9:55 pm

kanhOf 寫:嗯嗯1目前我主要是卡在 完全不知道他返回啥東西過來··
代碼: 選擇全部
if ($func == 'payments_status_update') {

    // Grab the order status
    $status = $_REQUEST['status'];
   
    // Write your apps logic here for validating and recording a
    // purchase here.
    //
    // Generally you will want to move states from `placed` -> `settled`
    // here, then grant the purchasing user's in-game item to them.
    if ($status == 'placed')
    {
      $next_state = 'settled';
      $data['content']['status'] = $next_state;   
      //我在這邊想看看當前狀態是怎樣的,只要我這邊寫入 echo 或者其他 都會出現錯誤。。。。。
    }


你要做log,監看server運行過程

交易是server對server,使用echo一定會出錯,且無法查看


水色論壇 http://www.et99.net
簡恩峻分享

woohoo
 
文章: 2
註冊時間: 2012-12-10 7:53 am
性別: 男生

Re: 接入facebook幣金流教學

文章woohoo » 2012-12-10 7:58 am

您好!
請問如何在title的地方顯示中文名稱?

我的callback.php裡的設定如下:
$item['title'] = '50 金幣';
$item['price'] = 10;
...

但是跳出的視窗,只有顯示 " 購買 50 ? "
請問筆者中文字的部分要如何讓它顯示出來?

感激不盡!!




ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2012-12-17 11:59 pm

woohoo 寫:您好!
請問如何在title的地方顯示中文名稱?

我的callback.php裡的設定如下:
$item['title'] = '50 金幣';
$item['price'] = 10;
...

但是跳出的視窗,只有顯示 " 購買 50 ? "
請問筆者中文字的部分要如何讓它顯示出來?

感激不盡!!


你的編碼要是UTF-8,若還不行 可能就是facebook不支援


水色論壇 http://www.et99.net
簡恩峻分享

woohoo
 
文章: 2
註冊時間: 2012-12-10 7:53 am
性別: 男生

Re: 接入facebook幣金流教學

文章woohoo » 2013-01-18 12:22 am

感謝您的回覆!
我目前是用UTF8編碼,沒有辦法顯示中文,但我看一般的遊戲這部分都是能顯示中文的 :(




ETERNAL
 
文章: 2928
註冊時間: 2003-12-03 11:08 pm
性別: 男生

Re: 接入facebook幣金流教學

文章ETERNAL » 2013-01-18 5:26 pm

可能沒有使用$item['title'] 這參數吧

根據$item['price'] 價格來顯示對應的名稱


水色論壇 http://www.et99.net
簡恩峻分享


回到 Online FF Battle-WOG官方聯盟推廣處

誰在線上

正在瀏覽這個版面的使用者:沒有註冊會員 和 8 位訪客

cron