general description I show an example to connect a Flash animation to Facebook using Facebook libraries for Flash and Javascript (Client Library Flash and JavaScript JDK), the why we use Javascript is because with these libraries to Facebook can create a web log ( WebSession ) without the use of the secret key of the Facebook application that generates.
For this example, follow these steps:
- Create an application in Facebook Developers
- Download Flash and JavaScript Client Library JDK Facebook
- Create html file
- Create the actionscript
Create an application in Facebook Developers
First of all you must configure a new apliaciones facebook. This you can do at the following address:
a single panel appears that allows you to add applications.
You must specify the name of your application that Facebook users will identify.
In Facebook the registration process will ask you some important information: Name, address the implementation and application domain. 
not forget at least those three are the most important.
Facebook to create applications only if it detects that a user contacts you with real data.
Download Flash Client Library for Facebook
This library you should give it high in Adobe Flash, the main project page here:
In the downloads section below searches the library
Once the download add it in Adobe Flash: Edit> Preferences> Actionscript you click on Settings ActionScript3 and add the file in the library paths.
JavaScript SDK not need to download directly, as we will see the html code below, but if you need information about you can see this link:
Create html file
html code I show you below:
\u0026lt;html xmlns = "http://www.w3.org/1999/xhtml "xml: lang =" en "lang =" en ">
\u0026lt;head>
charset=iso-8859-1" /> \u0026lt;meta http-equiv="Content-Type" content="text/html; ;
\u0026lt;title> EjemploFBC \u0026lt;/ title>
\u0026lt;/ head> \u0026lt;body bgcolor="#ffffff">
\u0026lt;div id="fb-root"> \u0026lt;/ div> \u0026lt;script
src="http://connect.facebook.net/en_US/all.js"> \u0026lt;/ script>
\u0026lt;script>
getFlashMovie function (moviename) {var isIE = navigator.appName
. indexOf ("Microsoft")! = -1;
return (isIE)? window [moviename]: document [moviename];}
solicitarDatosAcceso function () {
FB.init ({appId:'----------------', status: true, cookie : true, XFBML: true});
FB.login (function (response) {
if (response.session) {/ / user access to Facebook
llenaDatos ();
} Else {/ / User cancel your access
alert ('Unable !!');
}});}
llenaDatos function () {
getFlashMovie (EjemploFBC "). PasaDatosDeSesion (
FB.getSession (). session_key,
FB.getSession (). secret,
FB.getSession (). uid,
FB.getSession (). expires,
FB.getSession (). sig);
} //--> ;
\u0026lt;/ script>
\u0026lt;object classid = "clsid: d27cdb6e-ae6d-11cf-96b8-444553540000" codebase = "http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab # version = 10,0,0,0 " width = "550" height = "400" id = "EjemploFBC" align = "middle">
\u0026lt;param name="allowScriptAccess" value="sameDomain" />
\u0026lt;param name = "allowFullScreen" value = "false" />
\u0026lt;param name="movie"
value="EjemploFBC.swf" /> \u0026lt;param name="quality" value="high" />
\u0026lt;param name = "bgcolor "value =" # CCCCCC "/>
\u0026lt;embed src =" EjemploFBC.swf "quality =" high "bgcolor =" # CCCCCC "width =" 550 "height =" 400 "name =" EjemploFBC "align =" middle "allowScriptAccess =" sameDomain "allowFullScreen =" false " type = "application / x-shockwave-flash" pluginspage = "http://www.adobe.com/go/getflashplayer_es" />
\u0026lt;/ object>
\u0026lt;/ body>
\u0026lt;/ html>
Important points to note are: First
invoke the JavaScript SDK libraries from Facebook. \u0026lt;div
id="fb-root"> \u0026lt;/ div> \u0026lt;script
src="http://connect.facebook.net/en_US/all.js"> \u0026lt;/ script> ;
is important to put the label div with id = "fb_root" before calling the libraries, otherwise it will not work correctly.
solicitarDatosAcceso function () not allow the user to display a popup window asking the user access data to our application on facebook.
is important to notice that the function:
FB.init ({appId:'-----------', status: true Cookie: true, XFBML: true});
has as one of its arguments, the "API Key " of your application and not the secret key that Facebook generated.
If the connection is successful then sends the session data ( WebSession ) with the help of the function llenaDatos () object of swf Flash EjemploFBC name, your case will be the name you give to your animation . This section of code allows us to transfer data from JavaScript to ActionScript, the code of our animacón must do something to make this happen with the help of functions:
ExternalInterface. and ExternalInterface call. addCallback
These are functions of Flash to pass data between Javascript and Actionscript.
llenaDatos function () {
getFlashMovie (EjemploFBC "). PasaDatosDeSesion (
FB.getSession (). Session_key,
FB.getSession (). Secret,
FB.getSession (). Uid,
FB. getSession (). expires,
FB.getSession (). sig);}
Create the
Actionscript actionscript code is a bit more elaborate, I show below:
package {/ ** *
...
* @author lilingo
*/
import com.facebook.commands.users.GetInfo;
import com.facebook.data.users.FacebookUser;
import com.facebook.data.users.GetInfoData;
import com.facebook.Facebook;
import com.facebook.net.FacebookCall;
import com.facebook.utils.FacebookSessionUtil;
import com.facebook.events.FacebookEvent;
import com.facebook.session.WebSession;
import com.facebook.data.users.FacebookUser;
import flash.display.MovieClip;
import flash.display.SimpleButton;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.text.TextField;
import flash.external.ExternalInterface;
import flash.display.Loader;
import flash.net.URLRequest;
public class EjemploFBC extends MovieClip {
public var txtEstatus : TextField;
public var txtNombre : TextField;
public var imagenUsuario : MovieClip;
public var btnValidateLogin : SimpleButton;
public var facebookSession : FacebookSessionUtil;
public var facebook : Facebook;
public var session : WebSession;
public var user : FacebookUser;
public var user_id : String;
var miCargador : Loader;
public function EjemploFBC() {
/ / Listen to the events click the button "Request Login"
btnSolicitaLogin.addEventListener (MouseEvent.CLICK, solicitarDatosDeAccesoAFacebook)
/ / We register the function "fbUserLoggedIn"
ExternalInterface.addCallback (pasaDatosDeSesion "manejaDatosFBJavascrit);}
/ / Make the call to the function "solicitarDatosAcceso" in Javascript
solicitarDatosDeAccesoAFacebook public function (event: MouseEvent) {
ExternalInterface.call (solicitarDatosAcceso ");}
/ / This function will be invoked by javascript after that the user has entered a private function
manejaDatosFBJavascrit facebook (sSessionKey: String,
sSessionSecret: String,
suser: String,
iExpires: int,
sSignature: String): void {
/ / Create the session using our "API Key"
session = new ("--------------------", WebSession sSessionSecret, sSessionKey)
/ / We take a global variable the UserId of the session user_id = suser
;
/ / Create an instance of the Facebook and connect again (before it was in javascript)
facebook = new Facebook ();
session.addEventListener (FacebookEvent.CONNECT, manejaSesionAlConectarse)
facebook.startSession (session);
session.verifySession ();}
manejaSesionAlConectarse protected function (event: FacebookEvent): void {
session.removeEventListener (FacebookEvent.CONNECT, manejaSesionAlConectarse)
txtEstatus.text = "on";
if (event.error) {
txtEstatus.text = "(" + event.error.errorCode + ")" + event.error . errormsg;
} else if (event.success)
{/ / If the connection is exitosa traer mas datos del usuario,
//En dos arreglos solicitamos información del usuario:
//En el primero especificamos el "user_id"
//En el segundo el nombre y la imagen con el logotipo de facebook
var call:FacebookCall = new GetInfo([user_id], ["name", "pic_with_logo"]);
call.addEventListener(FacebookEvent.COMPLETE, manejaInformacionUsuario, false, 0, true);
facebook.post(call);
} else {
txtEstatus.text = "No Conectado";
}
}
protected function manejaInformacionUsuario(event:FacebookEvent) :
void {if (event.success & & event.data)
{if (event.data is GetInfoData) {user = FacebookUser
(GetInfoData (event.data). UserCollection.getItemAt (0));
if (! user) {
txtEstatus.text = "Error in processing XML";} else {
txtNombre.text = user.name;
/ / Load the user's picture with the logo
miCargador = new Loader (); var
archivoRequerido: URLRequest = new URLRequest (user.pic_with_logo)
miCargador.load (archivoRequerido)
miCargador.contentLoaderInfo.addEventListener (Event.COMPLETE, upload);
}}}
if (event.error) {
txtEstatus.text = "(" + event.error.errorCode + ")" + event.error.errorMsg;
}}
/ / The image has been read, then you can show them from the stage load it
function (event: Event) {
imagenUsuario.addChild (miCargador);}
}}
First of all in the constructor give functionality to a button for this function invokes "solicitarDatosAcceso" javascript:
ExternalInterface.call (solicitarDatosAcceso ");
solicitarDatosDeAccesoAFacebook public function (event: MouseEvent ) {
ExternalInterface.call (solicitarDatosAcceso ");}
After declare that function is responsible for receiving the data sends javascript when the user logs on to Facebook:
ExternalInterface.addCallback ( pasaDatosDeSesion "manejaDatosFBJavascrit)
Our role "manejaDatosFBJavascrit" is responsible for receiving all data and create a WebSession in flash, here again we send our API Key as we did in javascript.
After creating the WebSession create a handler that is responsible for finding out when the connection was made.
session.addEventListener (FacebookEvent.CONNECT, manejaSesionAlConectarse)
The "manejaSesionAlConectarse is executed when the connection is completed and in turn little sun is responsible for user's personal data:
var call:FacebookCall = new GetInfo([user_id], ["name", "pic_with_logo"]);
y facebook.post(call);
Los datos son solicitados con la clase GetInfo que recibe dos arreglos, el primero contiene el user_id (capturado y recibido desde javascript) y el segundo, es otro arreglo con los datos que nos interesan: nombre y url de la imagen con logo de facebook.
Antes de solicitar los datos, especificamos cual es la función que se encarga de manejar los datos del usuario una vez que se hayan recibido.
call.addEventListener(FacebookEvent.COMPLETE, manejaInformacionUsuario, false, 0, true);
function "manejaInformacionUsuario" processes information (name and logo with image) with the help of the object FacebookUser :
user = FacebookUser (GetInfoData (event.data). userCollection.getItemAt (0));
Note that the values \u200b\u200bare returned in an array of data and we are interested in the first position.
can see the example in this league:
There are some important things to consider and that may not be clear in the example. The first is usually your browser may not have made a connection with facebook before you load your animation, so you must take care to apply. In the example we do it through the button "request login " but more likely is that this action must be to load your animation automatically or the user can sueceder already logged into Facebook and you just need to bring data it automatically, this will depend on the experience of usability you want to give visitors to your page.
Download the example:
If you want to save the code you can download the file. Html,. Fla and. As in this league:
hope that the example is clear and useful.
No comments:
Post a Comment