Does ng-crodova has Facebook login?


#1

Hi, i’m looking for the quickest way to use facebook login in my ionic app

can any one expline the best way to do this with ionic?

please see post below
||
||
V


#2

Ok i found out that it has, in the CLI i called :
cordova plugin add https://github.com/phonegap/phonegap-facebook-plugin.git

and added the $cordovaFacebookConnect as a dependency in my controller.

Now it gets confusing, because i want to let the user try to log in with his credentials but im not sure the correct order of things i should do next…

this is what i think i need to do:

$scope.FBlogin = function() {
    $cordovaFacebookConnect.init(APP_ID).success(function (){
        $cordovaFacebookConnect.showDialog();
        $cordovaFacebookConnect.login();
    });
};

but i fail to understand if this is correct, cause i also noticed the getAccessToken() & api(path, permission) functions…

can anyone light the way to use this?


UPDATE:
in app.js i have

.run(function($ionicPlatform) {
        $ionicPlatform.ready(function() {
            // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
            // for form inputs)
            if (window.cordova && window.cordova.plugins.Keyboard) {
                cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
                cordova.plugins.Keyboard.disableScroll(true);
                cordova.plugins.facebookConnect.init(myAppIdGoesHere);
            }
            if (window.StatusBar) {
                // org.apache.cordova.statusbar required
                StatusBar.styleDefault();
            }
        });
    })

and in the controller i have:

$scope.FBlogin = function() {
    console.log('$cordovaFacebookConnect: ', $cordovaFacebookConnect);
    $cordovaFacebookConnect.showDialog();
};

but when i click that button to activate th FBlogin function i get 2 strange things in the console:
from the log() i get the object show me the functions,
and from the showDialog() call i get :

ReferenceError: facebookConnectPlugin is not defined

`

p.s. This was tested on a desktop running windows, in my android 4.1.2 everything quickly blinked and nothing happend


#3

any one with an idea about this?


#4

Hey there! So you’re trying to add facebook login? Have you checked out this blog post?

http://ionicframework.com/blog/authentication-in-ionic/

Mainly, check out this sample project


#5

Hi @mhartington, thanks for your answer.
I’m writing for android at the moment and in the auth0-ionic project it says that it requires ios-sim installed.

what’s that and can i do it with out it?


#6

That was just for the example. In that demo, we only used iOS out of preference.

You’ll be able to follow that example using android with out any issues.


#7

Ok, i think this is an over kill for me… what i only need in my app is that the user could enter his details and i need to get his FacebookID and the FacebookSessionID.

What would you recommand the best way to do that @mhartington?


#8

Hmm,

http://coenraets.org/blog/2014/04/facebook-phonegap-cordova-without-plugin/

For the quickest way, you may want to check out this micro-library which should handle your use case. Quick, simple, and light weight :smile:


#9

Hmmmmm, this look very interesting! i’ll give it a shot and let you know!

thanks!


#10

OK! this suits my needs far better than the rest of the solutions, but there is one thing i dont understand, in my FB app in the Valid OAuth redirect URIs i did as the blog says
and iv’e put:

https://www.facebook.com/connect/login_success.html

and this:

http://localhost:8383/myApp/index.html#/sign-in

as this is where the page is calling the function and it’s Controller should handle everything
(it’s a tabs app btw…)

but when the facebook popup comes up i get an error:

Given URL is not allowed by the Application configuration.: One or more of the given URLs is not allowed by the App’s settings. It must match the Website URL or Canvas URL, or the domain must be a subdomain of one of the App’s domains.

P.S this DOES work on the phone(but i can’t debug it on my computer because of issue stated above…)

is that normal @mhartington?


#11

Hmm, not too sure, as I’ve only seen demos of this, but never implemented it myself.

Actually had a conversation with another user who was do the same thing, suggested this example to him, but he came up with his own solution which could work too.


#12

It would be very nice to see a ng-cordova social login plugin using native phone api.
It’s a common use case in mobile apps and i think it would benefit a lot to ionic users.
As nice as Auth0 could be, it’s a third party layer beetween authentification and your app, and it’s a commercial solution (https://auth0.com/pricing).
I’m currently using Coenraets solution, it’s working, but it’s far from perfect.


#13

The example provided in this post shows a good example of how to setup facebook integration using only the facebook APIS

Also, you can use the ng-cordova plugin as well


#14

Hi, Now that this is live https://github.com/Wizcorp/phonegap-facebook-plugin/blob/develop/platforms/pg-build/README.md , do you think there will be an easy access ng-cordova method to connect?


#15

Hi there,

I had the same problem.
I solved it by following the official guide here :

Go to the Setup without Eclipse (just CLI) section and follow the steps.
Please note, I had to change one path on step 6 and 9:

android update project --subprojects --path “platforms/android” --target android-19 --library "FacebookLib"
This step needs to be replaced by
android update project --subprojects --path “platforms/android/com.phonegap.plugins.facebookconnect” --target android-19 --library “FacebookLib”

cd FacebookLib
This step needs to be replaced by
cd com.phonegap.plugins.facebookconnect/FacebookLib/

I don’t know if it’s specific of my configuration, but it solved my problem.

Cheers

NB:

Don’t know if it’s related, but instead of using the git link to install it automatically, I also manually cloned the repo and installed it with cordova plugins add /PathToPlugin/phonegap-facebook-plugin --variable APP_ID="2222" --variable APP_NAME="myApp"


#16

Just a note here, I’m pretty sure the wizcorp Facebook plugin is now the official repo for cordova.

We are using it in production but only use the login functionality to fetch the user key and then send it to the server for further actions such as fetching the user or creating posts. This is because the additional features such as getting user info is broken on Android.

There is also an issue with the login error callback which should be fixed soon.


#17

Hi,

I recently added oauth support to ngCordova. Facebook is one of the providers that is now supported:

http://ngcordova.com/docs/#Oauth

I also made a full working example of how to sign into Facebook using ngCordova in your Ionic application:

I hope that helps if you’re still having trouble.

Regards,


#18

An official way for ionic to support various social logins will be very useful.