Phonegap Build cordova-plugin-facebook4 plugin not working on iOS

Question

I am creating a phonegap build app which contains a facebook login. Below are some details. - The app has a Login with facebook button

It uses cordova-plugin-facebook4 plugin (https://www.npmjs.com/package/cordova-plugin-facebook4)
The integration code is below:

facebookConnectPlugin.login( ["public_profile"],
    function ( userData ) {
        alert( "login" );
        //fetch user info using graph api
        facebookConnectPlugin.api( "me/?fields=id,name,email,gender", ["email", "public_profile"],
            function ( result ) {
                alert( "login success" );
                //store access token in local storage
                facebookConnectPlugin.getAccessToken( function ( token ) {
                    console.log( "Token: " + token );
                } );
            },
            function ( error ) {
                alert( "Failed: " + error );
            } );
    }, function ( error ) { alert( "error" ); }
);

The above code works fine for on the android app.

- The above code does not work in iOS app

Device used for testing: IPad mini iOS version 10.x.

On developer.facebook.com, the app settings for iOS platform are as follows:

Bundle ID: same value as widget id in config.xml for phonegap

iPhone store id: empty

url scheme suffix: empty

ipad store id: empty

Single Sign On toggle: YES

Below is the current behavior for iOS iPad: 1. User clicks on Login using Facebook in the iOS app 2. User is taken to facebook permissions page in safari browser 3. User enters user id and password 4. User is asked for permission and User clicks "Confirm" 5. Safari shows a popup asking "Open in App?" 6. User clicks Open 7. User is taken to the same app and the same page and displayed the same login link.

Note that the control is not passed back to continue the script at all, its almost that the app was relaunched from start.

Safari web inspector does not show any errors.

GapDebug on mac (i am using a virtualbox Yosemite mac version) does not show any errors.

Please help as I am not very sure at this point, what else I am missing.

Jeffrey Rajan Jeffrey Rajan · Accepted Answer · 2017-06-06T10:43:17

I know its late to answer for this question but it might help other to fix this issue. So here is the solution

<meta http-equiv="Content-Security-Policy" content="default-src * gap://ready; style-src 'self' 'unsafe-inline'; img-src 'self' data:; script-src * 'unsafe-inline' 'unsafe-eval'">

add this in index.html. gap://ready is required for iOS 10

Phonegap Build cordova-plugin-facebook4 plugin not working on iOS

1 Answers