hace unos dias tenia una tarea que tenia que hacer un facebbok conect y encontre este tutorial buscando en la web, que va de 10 funciona de las mil maravillas.
http://www.saaraan.com/2012/05/ajax-facebook-connect-with-jquery-php
Suponiendo que hacemos login en el index.php
este es el problema. cuando uno se loguea el hace la comprobacion y todo y luego te devuelve al index.php, mostrandote un array con los datos obtenidos en el archivo php en el que se hace la comprobacion.
Ejem;
Array
(
[id] => 10000000000000000
[name] => Juan Garcia
[first_name] => Juan
[last_name] => Garcia
[link] => http://www.facebook.com/asdadsdasd
[username] => dasdadasdas
[hometown] => Array
y si actualizo la pagina me muestra un mensaje personalizado con mi nombre y todo lo que le pida pero estos datos entan en el index.php no en el archivo en el cual se hace la comprobacion..
he hay mi duda lo que quiero hacer es que en vez de que me muestre el array del archivo que se hace la comprobacion, me muestre el mensaje directamente que esta en el index sin tener que yo actualizar la pagina.
Este problema lo expuse en el foro de php y me sugerienron que quitara el array y pusiera un echo con mis datos, lo hice y funciona pero haun asi, el primero me muestra lo que esta en el archivo de la comprobacion y cuando actualizo me muestra lo que esta en el index.
Y que viniera al foro de ajax por que hay es que esta el problema.
esta es mi funcion.
***************************************
<head>
<script>
function AjaxResponse()
{
var myData = 'connect=1'; //For demo, we will pass a post variable, Check process_facebook.php
jQuery.ajax({
type: "POST",
url: "process_facebook.php",
dataType:"html",
data:myData,
success:function(response){
$("#results").html('<fieldset style="padding:20px">'+response+'</fieldset>'); //Result
},
error:function (xhr, ajaxOptions, thrownError){
$("#results").html('<fieldset style="padding:20px;color:red;">'+thrownError+'</fieldset>'); //Error
}
});
}
function LodingAnimate() //Show loading Image
{
$("#LoginButton").hide(); //hide login button once user authorize the application
$("#results").html('<img src="ajax-loader.gif" /> Please Wait Connecting...'); //show loading image while we process user
}
function ResetAnimate() //Reset User button
{
$("#LoginButton").show(); //Show login button
$("#results").html(''); //reset element html
}
</script>
</head>
Y este es el Boton de facebook
<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({appId: '<?php echo $appId; ?>',cookie: true,xfbml: true,channelUrl: '<?php echo $return_url; ?>channel.php',oauth: true});};
(function() {var e = document.createElement('script');
e.async = true;e.src = document.location.protocol +'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);}());
function CallAfterLogin(){
FB.login(function(response) {
if (response.status === "connected")
{
LodingAnimate(); //Animate login
FB.api('/me', function(data) {
if(data.email == null)
{
//Facbeook user email is empty, you can check something like this.
alert("You must allow us to access your email id!");
ResetAnimate();
}else{
AjaxResponse();
}
});
}
});
}
</script>
