Using FacebookConnect plugin (setup)

32 posts, 0 answers
  1. Idan
    Idan avatar
    76 posts
    Member since:
    Oct 2012

    Posted 06 Jan 2014 Link to this post

    Hi,

    I installed FacebookConnect plugin (compatible with Cordova 3). From what I've read, I need to setup a Facebook app which I did. But When I adding platforms ("add platform") in facebook dashboard, it asks ne for the Bundle ID, iPhone Store ID, iPad Store ID. I don't have them because I didn't launch the app yet (testing).

    I did set up the provisioning profile for testing and testing the app on my iPhone. However, I want to know how can I get the Bundle ID, iPHone Store ID and iPad Store ID so I can use the FacebookConnect plugin in my app? (if it's necessary to do so).

    Thanks in advanced.
  2. Kaloyan
    Admin
    Kaloyan avatar
    872 posts

    Posted 08 Jan 2014 Link to this post

    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:
    1. Remove the following lines:
      <!-- ios -->
      <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>
    2. 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.
  3. Idan
    Idan avatar
    76 posts
    Member since:
    Oct 2012

    Posted 08 Jan 2014 Link to this post

    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> <!-- cordova facebook plugin -->
    <script src="facebook-js-sdk.js" type="text/javascript"></script>  <!-- facebook js sdk -->


    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
  4. Steve
    Admin
    Steve avatar
    10941 posts

    Posted 09 Jan 2014 Link to this post

    Hi Idan,

    The second link that my colleague provided contains a working Icenium app that integrates the FaceBook plugin. Please run it on your end and compare the differences with your project.

    Regards,
    Steve
    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.
  5. Allan
    Allan avatar
    2 posts
    Member since:
    Jan 2014

    Posted 12 Jan 2014 Link to this post

    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

  6. Kaloyan
    Admin
    Kaloyan avatar
    872 posts

    Posted 15 Jan 2014 Link to this post

    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.
  7. Kaloyan
    Admin
    Kaloyan avatar
    872 posts

    Posted 21 Jan 2014 Link to this post

    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.
  8. Il_maca
    Il_maca avatar
    8 posts
    Member since:
    Nov 2009

    Posted 30 Jan 2014 in reply to Kaloyan Link to this post

    Hi, i've imported the latest .zip file posted, but it has a problem. If i removed the facebook app permission and i try the login, is showed an error message:

    Cordova Facebook Connect plugin fail on login! The app was removed. Please log in again.

    How to resolve this problem?
  9. Il_maca
    Il_maca avatar
    8 posts
    Member since:
    Nov 2009

    Posted 31 Jan 2014 in reply to Il_maca Link to this post

    Ok, this isn't a problem. Sorry. 
    I have another question:
    How to find new ".a" file of ios facebook framework? Is possibile integrate it without problems?
  10. Kaloyan
    Admin
    Kaloyan avatar
    872 posts

    Posted 04 Feb 2014 Link to this post

    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)
  11. Il_maca
    Il_maca avatar
    8 posts
    Member since:
    Nov 2009

    Posted 11 Feb 2014 in reply to Kaloyan Link to this post

    Thank you ;)
  12. Il_maca
    Il_maca avatar
    8 posts
    Member since:
    Nov 2009

    Posted 25 Feb 2014 in reply to Il_maca Link to this post

    Ok, after a lot of research, i can explained my first question. But is offtopic in this post. I will make a new post.
  13. Görkem
    Görkem avatar
    1 posts
    Member since:
    Jul 2014

    Posted 04 Aug 2014 Link to this post

    Hi, I tried using the plugin in app builder cordova 3.0 and 3.5.
    Can get it run in 3.0 but not in 3.5? I have not tried 3.2 because my push plugin does not support it.

    Greetings
  14. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 06 Aug 2014 Link to this post

    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.

     
  15. Don
    Don avatar
    66 posts
    Member since:
    Jun 2012

    Posted 14 Sep 2014 in reply to Anton Dobrev Link to this post

    Is there any timeframe that you can give us for a version that supports Cordova 3.4 in AppBuilder (i.e. is this something you guys are actively working on)?  I know I'm biased because my app uses it, but I believe that direct Facebook SDK integration in AppBuilder would be valuable to a lot of projects given how ubiquitous that FB is.
  16. Don
    Don avatar
    66 posts
    Member since:
    Jun 2012

    Posted 14 Sep 2014 in reply to Don Link to this post

    Oops I meant Cordova 3.5, not 3.4.
  17. Don
    Don avatar
    66 posts
    Member since:
    Jun 2012

    Posted 16 Sep 2014 Link to this post

    FYI:  Here's a thread I created addressing why getting official plugin for Facebook in Apache Cordova/PhoneGap (https://github.com/Wizcorp/phonegap-facebook-plugin) working in AppBuilder is important:  http://www.telerik.com/forums/mobile-apps-built-with-appbuilder-can't-be-submitted-to-facebook-app-center .
  18. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 17 Sep 2014 Link to this post

    Hello,

    The Telerik team is still researching the issue with the plugin.  Our aim is to construct a compatible with AppBuilder version of the plugin. However, we will need some more time in order to investigate the issue thoroughly and reconfigure the plugin which currently contains a lot of unsupported files for import in AppBuilder.

    We will update this thread with more information till the end of the 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.

     
  19. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 19 Sep 2014 Link to this post

    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.

     
  20. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 25 Sep 2014 Link to this post

    Hello,

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

    In order to build your application with the plugin:
    • 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.

     
  21. Viswanadh
    Viswanadh avatar
    2 posts
    Member since:
    Feb 2015

    Posted 18 Feb 2015 in reply to Anton Dobrev Link to this post

    I am getting output as below and on click on each button nothing is happening
  22. Viswanadh
    Viswanadh avatar
    2 posts
    Member since:
    Feb 2015

    Posted 18 Feb 2015 in reply to Viswanadh Link to this post

    Attached is the screen shot, after the setup this is what we are seeing on the screen, and on click nothing is happening
  23. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 20 Feb 2015 Link to this post

    @Viswanadh

    Please note that the plugin will not run in the AppBuilder simulator. It exposes a native logic that should run on a physical mobile device. Perhaps this is the reason for the behavior you observed. I assume that there is an error in the developer console of the AppBuilder simulator that states the exact reason.

    Could you please deploy your app to a connected device and try again?

    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.

     
  24. Jon
    Jon avatar
    13 posts
    Member since:
    Feb 2015

    Posted 20 Apr 2015 in reply to Anton Dobrev Link to this post

    Hi -

    Is the FB plugin installed from AppBuilder in Visusal Studio via bower compatible?

    I get "Unsupported file type .bat" when using the appbuilder CLI to try and build for android using the FB  plugin installed from Visual Studio via "properties".

    What should we be using to get Facebook to work with AppBuilder?

    Thank you

  25. Jon
    Jon avatar
    13 posts
    Member since:
    Feb 2015

    Posted 20 Apr 2015 in reply to Jon Link to this post

    Should I use the marketplace or use the zip file in this thread to get Facebook login to work?
  26. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 23 Apr 2015 Link to this post

    @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.

     
  27. Jon
    Jon avatar
    13 posts
    Member since:
    Feb 2015

    Posted 25 Apr 2015 in reply to Anton Dobrev Link to this post

    Awesome! I'm going to try this plugin this weekend and will report back.
  28. Anton Dobrev
    Admin
    Anton Dobrev avatar
    539 posts

    Posted 28 Apr 2015 Link to this post

    @Jon

    Please, take your time to incorporate and test the plugin and let me know how it goes.

    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.

     
  29. kamakshi
    kamakshi avatar
    1 posts
    Member since:
    Nov 2014

    Posted 02 May 2015 Link to this post

    how to install facebook plugin in telerik. how to i  get app_id  working with telerik
  30. Zdravko
    Admin
    Zdravko avatar
    657 posts

    Posted 06 May 2015 Link to this post

    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.

     
Back to Top