2010-10)facebook api in flash

flash-platform-plus-facebook

1. 取得FB個人資訊(FacebookCall post GetInfo)

2. 取得FB朋友資訊(FacebookCall post GetFriends)

3. 邀請FB朋友對話框(php)

4. 發佈FB分享訊息(FacbookCall post PublishPost)

5. 說”讚”加入粉絲團(FB plug-in)

6.判斷是否按”讚”(FacebookCall post FqlQuery)

按”閱讀更多”有基本教學

因為案子需要粗淺的研究了一下在flash開發facebook的app

隨手打一下開發程流(getting start)

程式碼沒排太整齊請見諒

1. 要開發Facebook的app，首先要到http://www.facebook.com/developers/

註冊~安裝之類的

其中要注意的是Canvas Page是就你希望在apps.facebook下的網址

CanvasURL是輸入flash在網路中的位置

Canvas Type我這邊是用Iframe(意思是嵌在facebook的框架下)

完成後會得到app id、api key、app secret key這些會在html跟flash會用到

2. index.html部分因為要先讓user安裝app後才能取得資訊

所以需要在body裡加入下面程式~大意就是判斷user有沒有加入你的app

如果沒有就show加入頁面讓user加入你的app後會回到你的主頁

另外facebook有個類似flash crossdomain.xml的東西叫xd_receiver.html

也要放在server上

xd_receiver.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1

/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
<script src=http://static.ak.connect.facebook.com/js/api_lib/v0.4/XdCommReceiver.js

 type="text/javascript"></script>
</body>
</html>


index.html(記得swfobject也要放進server)



<script type="text/javascript" src="swfobject.js"> </script>  
<script src=http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php

 type="text/javascript"></script> 
<script type="text/javascript">  
	var api_key = "your api key"; //api key    
	var queryString = window.location.search;  
  
	queryString = queryString.substring(1);  
  
	var fields = queryString.split('&');  
 
	var fb_sig_added = 0;  
	var flashVars ={};  
  
	for (var i = 0; i < fields.length; i++) {  
  		var index = fields[i].indexOf('=');  
  		var key = fields[i].substring(0, index);  
  		var value = fields[i].substring(index + 1);  
          
  		if (key.toLowerCase() == "fb_sig_added"){  
    		fb_sig_added = value;  
  		}  
  		flashVars[key] = value;  
	}  
	flashVars.api_key = api_key;  
    
	if (fb_sig_added == 0) {  
  		window.parent.location = "http://www.facebook.com/login.php?api_key=

" + api_key + "&next=index.html&v=1.0&canvas=1";  
	} else { 
		//alert("connected");  
  		initFB();  
	}  
	function initFB() {  
		FB_RequireFeatures(["Api","XFBML","Connect"], function() {  
			FB.Facebook.init(api_key, "xd_receiver.htm");  
			FB.Facebook.apiClient.requireLogin(function(exception){   
				apiClient = new FB.ApiClient(api_key);  
			
				swfobject.embedSWF("your flash.swf","flashContent"

,"730","550","9.0.47","expressInstall.swf",flashVars, {}, {id:"cainfb",name:"cainfb"}); 
			})  
		})  
	}  	
</script>


 



正常來說這樣index.html就可以讀取你的flash並且在apps.facebook.com/yourappurl執行會要求user add你的app



接下來就是在flash端的load個人資訊、朋友資訊、發佈訊息至塗鴨牆、判斷是否加入粉絲團



首先需下載flash facebook api(我目前還不是用facebook graph api)



import com.facebook.Facebook;
import com.facebook.utils.FacebookSessionUtil;
import com.facebook.events.FacebookEvent;
import com.facebook.data.users.FacebookUser;
import com.facebook.data.users.GetInfoData;
import com.facebook.data.users.FacebookUserCollection;
import com.facebook.data.friends.FriendsCollection;
import com.facebook.data.friends.GetFriendsData;
import com.facebook.net.FacebookCall;
import com.facebook.data.users.GetInfoFieldValues;
import com.facebook.commands.users.GetInfo;
import com.facebook.commands.friends.GetFriends;
import com.facebook.commands.fql.FqlQuery;

import com.facebook.commands.stream.PublishPost;
import com.facebook.data.feed.ActionLinkData;
import com.facebook.data.stream.AttachmentData;
import com.facebook.data.stream.MediaTypes;
import com.facebook.data.stream.StreamMediaData;

var _sessionUtil:FacebookSessionUtil;
var _facebook:Facebook;
//從html取得api_key
var _apiKey:String = this.loaderInfo.parameters.api_key;  
_sessionUtil = new FacebookSessionUtil(_apiKey,null,this.loaderInfo);  
_sessionUtil.addEventListener(FacebookEvent.CONNECT, fbConnectHandler);  
_facebook = _sessionUtil.facebook;  
if (this.loaderInfo.parameters.fb_sig_session_key) {
	_sessionUtil.verifySession();
} else {
	_sessionUtil.login(true);
}

//使用FacebookSessionUtil的話可以直接取得uid  
function fbConnectHandler(e:FacebookEvent):void {
	userUid = _facebook.uid;
	var call:FacebookCall = _facebook.post(new GetInfo([_facebook.uid],

[GetInfoFieldValues.ALL_VALUES]));
	call.addEventListener(FacebookEvent.COMPLETE, onGetInfo);

	var call_friend:FacebookCall = _facebook.post( new GetFriends() );
	// 取得朋友資料之後，執行 onGetFriendsComplete
	call_friend.addEventListener(FacebookEvent.COMPLETE, onGetFriendsComplete);
         //可輸入任何fql指令，在此是搜尋是否加入粉絲團
         var callFQL:FacebookCall = _facebook.post(new FqlQuery("SELECT type, page_id 

FROM page_fan WHERE uid = " + userUid + " and page_id = " + pageid)); 
         callFQL.addEventListener(FacebookEvent.COMPLETE, fqlCallBack ); 
}

function onGetInfo(e:FacebookEvent):void {
	var user:FacebookUser;
	user=(e.data as GetInfoData).userCollection.getItemAt(0) as FacebookUser;

	var Name:Label=new Label();
	Name.text = "Hello! " + user.last_name + " " + user.first_name;
	userName = user.last_name + " " + user.first_name;
	Name.width = 300;
	Name.x = 60;
	Name.y = 10;
	this.addChild(Name);
	var _ldr:Loader = new Loader();
	_ldr.load(new URLRequest(user.pic_small));
	_ldr.x = 10;
	_ldr.y = 5;
	userPicurl = user.pic_small;
	this.addChild(_ldr);


}

function onGetFriendsComplete(event:FacebookEvent):void {
	// 呼叫時用 GetFriends，取得時用 GetFriendsData
	var friendsData:GetFriendsData = event.data as GetFriendsData;
	var friends:FacebookUserCollection = friendsData.friends;
	// 將朋友的 ID 放入 uids 陣列
	var uids:Array = [];
	for (var i:int=0; i< friends.length; i++) {
		var f:FacebookUser = friends.getItemAt(i) as FacebookUser;
		uids.push(f.uid);
	}
	// GetFriends 只能取得朋友的 uid，必須呼叫 GetInfo 才能取得朋友資料
	var call:FacebookCall = _facebook.post(new GetInfo(uids,["name","pic_square"]));
	call.addEventListener(FacebookEvent.COMPLETE, onGetFriendsAttr);
}
var dictionary:Dictionary;
function onGetFriendsAttr(event:FacebookEvent):void {
	// 呼叫時用 GetInfo，取得時用 GetInfoData
	var getInfoData:GetInfoData = event.data as GetInfoData;
	var userCollection:FacebookUserCollection = getInfoData.userCollection;
	dictionary = new Dictionary();
	// 一一取出朋友資料
	var usercount:int = userCollection.length;
	if (usercount > 15) {//限制最多load 14個，如果不限制直接用userCollection.length
		usercount = 15;
	}
	for (var i:int=0; i<usercount; i++) {
		var usr:FacebookUser = userCollection.getItemAt(i) as FacebookUser;
		var _ldr:Loader = new Loader();
		if (! usr.pic_square) {
			_ldr.load(new URLRequest(‘沒圖時用的圖’));
		} else {
			_ldr.load(new URLRequest(usr.pic_square));
		}

		_ldr.x = 200 + i * 25;
		_ldr.y = 5;
		_ldr.scaleX = 0.5;
		_ldr.scaleY = 0.5;
		this.addChild(_ldr);
		// 使用字典以方便用物件取得字串
		dictionary[_ldr] = usr.uid;
		this.addChild( _ldr );
	}
	//init()
}
function fqlCallBack( e : FacebookEvent ):void {
	if (! e.success) {
		scrollmc.textmc.out.text = "Error: " + e.error.reason;
	} else {
		var xmlcontent:XML = new XML(e.data.rawResult);
		//回傳訊息為xml，自行分析
		
		
	}
}

function shareFB():void {//發佈訊息到塗鴨牆
	var msg:String = "hello message";

	var attachment:Object = {media: [{
	   type: "image",
	   src: "yourpicurl",
	   href: "http://apps.facebook.com/yourappurl/"
	}]};

	var actionLinkData:ActionLinkData = new ActionLinkData();
	actionLinkData.href = "http://apps.facebook.com/yourappurl/";
	actionLinkData.text = "yourtitle";

	var post:PublishPost = new PublishPost(msg,attachment,[actionLinkData],userUid);
	var callpost:FacebookCall = _facebook.post(post);
}


邀請朋友部分我透過php來做，讓flash呼叫即可



invite.php



<fb:fbml>     <fb:request-form action="index.html" method="POST" invite="true" 

type="appname" content="Hey you"  <?php echo htmlentities("<fb:req-choice 

url=\"http://apps.facebook.com/your app url/\" label=\"button name\"") ?>" >         <fb:multi-friend-selector showborder="false" actiontext="app name">     </fb:request-form> 
</fb:fbml>


在flash 下連結即可



navigateToURL(new URLRequest(

"http://apps.facebook.com/your app name/invite.php?fb_force_mode=fbml"),"_top");


加入粉絲團button其實就是facebook plug-in



在index.html加入，範例在此

In by Hu, Ching-Hsiang

1 意見:

匿名 提到...

我的會出現這個狀況ㄝ:

"載入 xxx 頁面時發生錯誤"

在這一句
FB.Facebook.apiClient.requireLogin(function(exception){
之前，還可以alert

然後就不跑了…就跑出頁面錯誤。

可以請問一下版主有遇到過，這個情形嗎?

多謝不吝指教了啊~~

2011年1月4日 凌晨2:10

張貼留言

訂閱： 張貼留言 (Atom)