Getting information from Facebook inside PhoneGap Build

Question

Editted, per JesseMonroy650's request:

I've done a couple of hybrid apps before, though none commercially released. I am using PhoneGap Build. Located here: https://build.phonegap.com/ I am not using any Desktop app.

Original content:

I am trying to get data from Facebook inside PhoneGap Build.

I've got a simple script that seems like it should work based on the API:

<script>
            document.addEventListener("deviceready", onDeviceReady, false);

            function onDeviceReady() {

                var fbLoginSuccess = function(userData) {
                    alert("UserInfo: " + JSON.stringify(userData));
                    facebookConnectPlugin.getAccessToken(function(token) {
                        alert("Token: " + token);
                    }, function(err) {
                        alert("Could not get access token: " + err);
                    });
                }
                facebookConnectPlugin.login(["public_profile"],
                        fbLoginSuccess,
                        function(error) {
                            alert("" + error)
                        }
                );
            }
</script>

And I believe I've setup my config.xml correctly:

<gap:plugin name="com.phonegap.plugins.facebookconnect" version="0.9.0">
    <param name="APP_ID" value="<ACTUAL APP ID HERE>" />
    <param name="APP_NAME" value="<ACTUAL APP NAME HERE>" />
</gap:plugin>

But I don't get any alert about this (or console log, when I try that).

1. So my question is - am I correctly using the PhoneGap Build Facebook API here? What should I do differently?

2. This is a less important question - bonus points if someone can point out how I can get the same process working in the browser without installing Cordova locally - if that's even possible

Answer 1

For your first question:

Add the below to your config.xml and ensure you place your config.xml in the root folder with your index.html file:

<gap:plugin name="com.phonegap.plugins.facebookconnect">
    <param name="APP_ID" value="..." />
    <param name="APP_NAME" value="..." />
</gap:plugin>

Add the following to the of your index.html file and every .html file that you want to access the plugin scripts:

<script scr="phonegap.js"></script>
<script src="cdv-plugin-fb-connect.js"></script > 
<script src="facebook-js-sdk.js"></script >

Now, read and follow the documentation located here. Be sure to pay attention to the paragraph titled "Facebook Requirements and Set-Up".

Once complete, upload your zipped project to build.phonegap.com and wait for your project to be compiled.

For your 2nd question:

It's not possible to test it on browser by any means without installing Cordova. Currently it's "out of the box"

Answer 2

I think you have some semicolons missing (like the one declaring fbLoginSuccess var), give it a try with this code

<script>
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {

    var fbLoginSuccess = function (userData) {
        alert("UserInfo: " + JSON.stringify(userData));
        facebookConnectPlugin.getAccessToken(function (token) {
            alert("Token: " + token);
        }, function (err) {
            alert("Could not get access token: " + err);
        });
    };
    facebookConnectPlugin.login(["public_profile"],
            fbLoginSuccess,
            function (error) {
                alert("" + error);
            }
    );
}
</script>