ExternalInterface.callback not working

Question

I'm trying to do a Facebook app that runs a .swf ion the canvas page. I need to get the Facebook user id, that I tried to do using AS3 Facebook Graph Api, but it didn't work, so I've been trying to get the id by calling the FB.getUserID(); and expose the obtained id by getting the Flash movie and calling a method inside it using the ExternalInterface class. I try to trace the is in a text field inside the swf but it is not working, I mean the id never gets to the Flash movie.

Here is my Javascript code:

   <div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
var swf = null;



      FB.init({ appId: 'APP_ID',            
            status: true, 
            cookie: true,
            xfbml: true,
            oauth: true});

    FB.Canvas.setAutoResize(false);
    FB.Canvas.setSize({ height: 720, width: 600 });
  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
    var uid = "";

   FB.Event.subscribe('auth.statusChange', function(response) {
          if (response.authResponse) {
                 uid = FB.getUserID();
                 console.log('User Id = '+ uid);
          }
          else
          {
              FB.login();
          }
   });


    // Call a flash function exposed with External Interface.
       document.getElementById("chimpInvader").setUID(uid);



   // Custom Facebook Calls.
   // Call getAccessToken() from flash using External Interface,
    function getAccessToken(){
       FB.login(function(response) 
       {
           if (response.authResponse) 
           {
             var access_token =   FB.getAuthResponse()['accessToken'];
             //Log your access token so you can be sure the javascript is worjking,.
             console.log('Access Token = '+ access_token);

              swf = document.getElementById("chimpInvader");

              // Call a flash function exposed with External Interface.
              swf.setAccessToken(access_token);
           }
           else 
           {           
             console.log('User cancelled login or did not fully authorize.');

           }
     }, {scope: ''});


   }
   var movieName = "chimpInvader";
    // Get Swf 
    function getSwf(movieName) {
         if (navigator.appName.indexOf("Microsoft") != -1) {
             return window[movieName];
         } else {
             return document[movieName];
         }
     }

</script>

And here is my AS3 code inside a .as file that is called when the .swf runs:

package
{
    import flash.display.MovieClip;
    import flash.events.ProgressEvent;
    import flash.display.Loader;
    import flash.net.URLRequest;
    import flash.events.Event;
    import flash.external.ExternalInterface;

    public class PreloaderMc extends MovieClip
    {
        public static var user_id: String = ""; 
        function PreloaderMc():void
        {
            var mLoader = new Loader();             
            ExternalInterface.addCallback("setUID", getFId);            
            var mRequest:URLRequest = new URLRequest ("chimpInvader.swf");
            mLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, oncomplete);
            mLoader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS,loading);
            mLoader.load(mRequest);
        }
        function getFId(uid):void
        {
            user_id = uid.toString();
            txtId.text = "Method Called!";
            trace("Getting id");
        }

        function oncomplete(e:Event)
        {
            addChild(e.currentTarget.content);
        }
        function loading(evt:ProgressEvent)
        {
            var porcentaje:Number = (evt.bytesLoaded/evt.bytesTotal)*100;
            trace (porcentaje);
            preloadertext.text = String(Math.round(porcentaje));
        }
    }
}

I really appreciate any help I can get in this matter.

Answer 1

Did your swf file is under the same domain as your canvas page? Do you access the swf file with https? If not, you may have a cross site scripting problem. I had the same problem a fiew weeks back. Took me 1 day to solve my crosssite scripting problems.