This is a migrated thread and some comments may be shown as answers.

Using FacebookConnect plugin (setup)

31 Answers 622 Views

Apache Cordova

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

31 Answers, 1 is accepted

answered on 08 Jan 2014, 05:21 PM

Hi Idan,

You should not be needing these IDs for your Icenium hybrid app. In other words, adding iOS platform in your Facebook App is needed only for native iOS applications.

Please, check this forum thread for details about integrating the FacebookConnect plugin into Icenium build. Also, there you will find modified version of the FacebookConnect plugin. I strongly recommend using it instead of the official one in GitHub. It is attached in this reply.

Further, as described in the forum post, you will need to replace the APP_ID and the APP_NAME in the plugin.xml file. The changes needed are as follows:

Remove the following lines:



<platform name="ios">

    <config-file target="config.xml" parent="/*">

        <feature name="org.apache.cordova.facebook.Connect">

            <param name="ios-package" value="FacebookConnectPlugin" />

        </feature>

    </config-file>

    <header-file src="src/ios/FacebookConnectPlugin.h" />

    <source-file src="src/ios/FacebookConnectPlugin.m" />

    <config-file target="*-Info.plist" parent="FacebookAppID">

        <string>537761576263898</string> <-Add your Facebook App ID here.

    </config-file>

    <config-file target="*-Info.plist" parent="FacebookDisplayName">

        <string>MyTestFBApp</string> <- Add your Facebook App Name here.

    </config-file>

    <config-file target="*-Info.plist" parent="CFBundleURLTypes">

        <array>

            <dict>

                <key>CFBundleURLSchemes</key>

                <array>

                    <string>fb537761576263898</string> <- Add your Facebook App ID here. Leave the fb at the beginning.

                </array>

            </dict>

        </array>

    </config-file>
You can find the Facebook App Name and ID from the Facebook developer dashboard, here.

I hope this helps.

Regards,
Kaloyan
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.

answered on 08 Jan 2014, 06:22 PM

I did everything that you said but the function FB.getLoginStatus() doesn't work. I don't get any errors in the console when debugging on my iPhone, but the callback function is not running.

My code:

FB.getLoginStatus(function(response) {

if (response.status === 'connected') {

var uid = response.authResponse.userID;

var accessToken = response.authResponse.accessToken;

facebookWallPost();

} else if (response.status === 'not_authorized') {

} else {

FB.login(

function(response) {

if (response.session) {

facebookWallPost();

} else {

}

},

{ scope: "email" }

);

}

});

I've added the following code lines:

<script src="cdv-plugin-fb-connect.js" type="text/javascript"></script> 

<script src="facebook-js-sdk.js" type="text/javascript"></script> 

I've set up the APP_ID and APP_NAME in the plugin.xml file.

Checking the app on my iPhone 5S using graphite. When I use the same code with the official plugin it worked. But you recommended to use the one that you linked for, and not it doesn't work. What am I doing wrong?

UPDATE: I've restored the first plugin and try to run it, and get the same results. Trying to find out why the function doesn't call the callback function...

Thanks

answered on 13 Jan 2014, 03:40 AM

I am also having trouble installing a Facebook plugin to work with Icenium. I've downloaded the modified version the Kaloyan suggested. However it was missing sources for Android, so I pasted them in from this git:

https://github.com/phonegap/phonegap-facebook-plugin

I will need to deploy on both iOS and Android. I've looked over the sample project included as well. I put in the 2 links to the cdv-plugin-fb-connect.js and to facebook-js-sdk.js into my index.html

I am getting an error on my android device that "Cordova Facebook Connect plugin fail on init!" and "Corda Facebook Connect plugin fail on auth.status!"

I am also curious about this plugin (https://github.com/mgcrea/cordova-facebook-connect) as the setup instructions for that one don't require you to setup specific Android and IOS platforms on the Facebook dashboard, whereas the newest plugin suggested here does need that manual setup.

Looking for any tips on how I can get this thing working. Thanks

answered on 15 Jan 2014, 05:11 PM

Hi Allan,

I managed to reproduce this on my side. Debugging it I found that the following exec from the cdv-plugin-fb-connect.js fails:

cordova.exec(function() {

var authResponse = JSON.parse(localStorage.getItem('cdv_fb_session') || '{"expiresIn":0}');

if (authResponse && authResponse.expirationTime) {

var nowTime = (new Date()).getTime();

if (authResponse.expirationTime > nowTime) {

// Update expires in information

updatedExpiresIn = Math.floor((authResponse.expirationTime - nowTime) / 1000);

authResponse.expiresIn = updatedExpiresIn;

localStorage.setItem('cdv_fb_session', JSON.stringify(authResponse));

FB.Auth.setAuthResponse(authResponse, 'connected');

}

console.log('Cordova Facebook Connect plugin initialized successfully.');

}, (fail?fail:null), 'org.apache.cordova.facebook.Connect', 'init', [apiKey]);

I will try to go deeper, but please aware that all custom Cordova plugins are 3rd party software and as such do not fall in to the product support scope. I suggest you to contact the plugin authors and see if they can assist you with this problem.

Regards,
Kaloyan
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.

answered on 21 Jan 2014, 03:32 PM

FBConnect.zip

Hi Allan,

I managed to integrate the latest Apache Cordova Facebook Plugin into Icenium hybrid application. It works well on both iOS and Android devices. However, as said in its Wiki you need to set up the platforms of the Facebook app for iOS and Android. For iOS, only fill in the Bundle ID field with your application identifier (found in the Properties of the Icenium application). For Android, you will need to add your application Key hash (check how to do this here).

As there were some further set ups I had to make in order to run the plugin successfully, I am attaching the reworked version here.

Regards,
Kaloyan
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.

answered on 04 Feb 2014, 12:39 PM

Hello Il_maca,

I am not sure I understand your first question correctly. Maybe, this is something that you should contact Facebook about. You can try posting on StackOverflow as Facebook engineers actively participate there.

About your second concern, integrating native libraries (different than the ones that Cordova uses) inside AppBuilder project is accomplished by using of a custom plugin. More about this, can be found here.

I hope this answers your questions.

Regards,
Kaloyan
Telerik

Icenium is now Telerik AppBuilder, and is part of the Telerik Platform. For more information on the new name, and to learn more about the Platform, register for the free online keynote and webinar on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT)

answered on 06 Aug 2014, 03:57 PM

Hello Görkem,

Which version of the plugin are you testing with? The one included in the sample app attached in this thread is compatible only with Cordova 3.0.

The last version of the plugin (GitHub repo) supports Cordova 3.5, but unfortunately is not compatible with AppBuilder. It contains files that are not compatible with the AppBuilder plugin engine. The AppBuilder team will need some time to identify the compatibility issues in this version of the plugin and will update this thread with the results.

Depending on the scenario of your app there might be other valuable approaches, for example, the SocialSharing plugin.

Please, let us know if you have further questions.

Regards,
Anton Dobrev
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

answered on 19 Sep 2014, 03:39 PM

Hello,

Just a quick update.

We investigated thoroughly the issue with the plugin. We can share the following results from the current stage of the research:

The Telerik team will need to update the AppBuilder plugin engine that builds the plugins in the cloud for a project in order to support the import of the plugin in its current form. This is considered for the next AppBuilder 2.6 release.

The Telerik team is working on a workaround that will enable the usage of the plugin inside an AppBuilder project. We expect that a workaround will be available in approximately in the very near future, possibly next week.

Best regards,

Anton Dobrev
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

answered on 25 Sep 2014, 09:40 AM

Hello-FB-Plugin.zip

FacebookConnect-0-7-1-AppBuilder.zip

Hello,

Please find attached the AppBuilder-compatible version of the plugin.

In order to build your application with the plugin:

Import it in your favorite AppBuilder client.

Navigate to Plugins > Facebook-AB > plugin.xml from the Project Navigator in the right and open it.

Remove the two <preference> tags with names – APP_ID and APP_NAME

Locate the $APP_ID and $APP_NAME configurations for Android and iOS.

Replace them with the App ID that you obtained from FB and its name.

Do not forget to add the APP ID also in the CFBundleURLSchemes for iOS. It must look something like fb1111111111111111 after the replacement with an actual App ID.

We prepared a small sample project based on the previous sample Connecting AppBuilder Projects to Facebook with the new plugin and the slightly changed methods of the plugin’s API. It is also attached in the thread. You can import it in AppBuilder following the instructions for recreating existing projects from archive. Do not forget to configure the plugin.xml as explained above.

Let me know if further questions or suggestions arise.

Regards,
Anton Dobrev
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

answered on 23 Apr 2015, 09:10 AM

@Jon

Indeed, we'd suggest that you use the Facebook plugin version available in the Telerik Verified Plugins Marketplace. This version of the plugin contains the latest versions of the FB SDKs and is tailored to work with Telerik AppBuilder projects. Also, it will simplify the generation of hash tokens for your FB app for Android.

The plugin is not available via Bower, but you can follow the instructions at the top of the plugin's page to install it in your project.

The steps for installing the plugin to AppBuilder project in Visual Studio are:
- Navigate to the the AppBuilder tab
- Choose the Manage Packages option
- Select the Plugin Marketplace and search for the respective plugin.
- Click Install to install the plugin to your project.

Let me know if this works for you and if you have further questions.

Best regards,

Anton Dobrev
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

answered on 06 May 2015, 02:12 PM

Hello Kamakshi,

Thank you for contacting us.
You can install the plugin following the steps from here. The description on plugin's page explains in details how you can create app ID and what are the needed settings. You will find there a sample app representing the usage of the plugin in case you want to take advantage of it.
Once acquired the app ID can be set as plugin's variable by following the description here.

If there is anything that requires further assistance please let us know.

Regards,
Zdravko
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.

answered on 02 Sep 2015, 07:03 AM

Hello,

a have a strange problem. I installed the following Facebook DEMO App: http://plugins.telerik.com/cordova/plugin/facebook
and everything was fine. I was able to login, to access my username, id, etc. But after I connected my device to Appbuilder in debugging mode I'm not able to login again. I receive the following error: "App Not Setup: This app is still in development mode, and you don't have access to it. Switch to a registered test user or ask an app admin for permissions."
I did everything from here http://stackoverflow.com/questions/29817602/facebook-app-is-public-but-gives-error-app-not-setup-when-logging-in but I still have the problem. And everything happened when I connected my device to debugging mode.

answered on 07 Sep 2015, 07:31 AM

@Hristo

Indeed, this error is returned when the configuration of the app in the Facebook developers portal is not for a LIVE app - e.g. you can use only your Developer account to authenticate in the app via Facebook.

I am afraid that the device connection to AppBuilder does not affect this workflow - one case I can think of, though, is that you might have another app (for example a testing app) that you have used previously for Facebook integration synced to the device because it is opened in AppBuilder.

The suggestions in the SOF (set the app to Live or add testing accounts) thread are what you need exactly to do.

Can you double check the above and let me know the results.

Regards,
Anton Dobrev
Telerik

Visit the Telerik Verified Plugins Marketplace and get the custom Cordova plugin you need, already tweaked to work seamlessly with AppBuilder.