Ginger Opariti
Ginger Opariti

Reputation: 1292

User permission dialog doesn't pop-up for tab application

I have a strange behavior for an application that I have implemented and that captures the user's info when accessed. The application, if accessed from outside Facebook URL, pops-up correctly a JavaScript permission dialog. But when I inserted this application as a tab application into a Facebook page the permission request dialog doesn't pop-up anymore. Moreover, I have also placed in an FB.getLoginStatus() implementation the detection of the user's current login status in Facebook, with a JavaScript alert pop-up window if the user is not logged in. When the application is called from 'outside' the alert is triggered. When the application is on a Facebook page tab it doesn't. Is this the correct behavior? If so, how can I enable the permission request in a Facebook tab application. I'm using both JS and PHP Facebook SDKs.

Edit 1 (following CBroe comment): I'm using the following calls in the application's content.php markup (executed on page load):

<!-- Facebook JS SDK initialization -->
  <div id="fb-root"></div>
  <script>initFacebookJSSDK();</script>
<!-- End of Facebook JS initialization -->
<script>checkAccessPermission();</script>
<?php include_once 'sites/www.mysite.com/custom_code/custom_index.php';?> // I'm doing  
custom code under Drupal

The JavaScript functions are implemented in the custom.js file, as following:

function initFacebookJSSDK()    {
window.fbAsyncInit = function() {
    FB.init({
      appId      : 'xxxxxxxxxxxxxxxxxx', // Application's ID
      channelUrl : 'www.appsite.com/channel.html', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true,  // parse XFBML
      oauth      : true // enable OAuth
    });
.........
    });
.........
}
function getPerms() {
    FB.login(function(response) {
        if (!response.authResponse) {
            //user refused to grant permissions, redirect to the 'index' page
        window.location = "/index";
        }
    }, {scope:"email"}); // I request the permission to get the email address
}
function checkAccessPermission()    {
FB.getLoginStatus(function(response) {
    if (response.status === 'connected') {
          //user has granted permissions to the application
      var uid = response.authResponse.userID; // not used
          var accessToken = response.authResponse.accessToken; // not used
    }
    else if (response.status === 'not_authorized')
        // user is logged into Facebook but didn't grand permissions to the app
          getPerms();
    else {
        //user has not granted permissions, redirect to the 'index' page
    alert('Please connect with your Facebook account');
    window.location = "/index";
      }
 });
}

The PHP script - file 'custom_index.php' contains the following snippets:

$config = array();
$config["appId"] = FB_APP_ID;
$config["secret"] = FB_SECRET_ID;
$config["cookie"] = true;
$facebook = new Facebook($config);
// get user UID
$fb_user_id = $facebook->getUser();
// user's first visit, force the permission request window
if ($fb_user_id == 0)  {
    $location = $facebook->getLoginUrl(array('scope' => 'email'));
    ..........
}
// user already gave permission, get the profile and process
if ($fb_user_id != 0)  {
    $access_token = $facebook->getAccessToken();
    $user_profile = $facebook->api('/me', array('access_token'=>$access_token));
    ..........
}

Again, it works very well when the user visits the site outside Facebook, but the permission request pop-up window doesn't show-up when it runs as Facebook tab application (frame inside Facebook). To note that, concerning my previous posting, now the JavaScript statement:

alert('Please connect with your Facebook account');

is executed in both cases, including when the application is run as tab app inside Facebook (I had just to clear the browser's cache).

Upvotes: 0

Views: 2362

Answers (2)

Ginger Opariti
Ginger Opariti

Reputation: 1292

Here is the solution. All the code above is correct and stays in place. I just added a jQuery function on the link that pulls-up the 'content.php' page, as following (the class '.open-content-page' is on the parent page of 'content.php'):

$(document).ready(function () {
            $(".open-content-page").click(function()    {
            checkAccessPermission();
            });
});
})(jQuery);

Upvotes: 1

C3roe
C3roe

Reputation: 96216

You’re calling your JS function without any user interaction – have you made sure it’s not just your browser’s popup blocker that keeps the dialog from coming up? (Maybe it distinguishes between popups called from a „simple” page vs popups from pages embedded in iframes on other domains.)

Since you can’t rely on your site’s users having their popup blockers set very liberal, it’s generally a better idea to call facebook dialogs on user interaction, f.e. when the user clicks a link/button. Popups called on user interaction are less likely to get blocked than popups that want to open all by themselves.

Upvotes: 0

Related Questions