How to add OAuth facebook login in Ionic/Angular?

You can make use of $cordovaOauth.facebook in the ngCordova library of Ionic Framework:

http://www.ngcordova.com

Here are two references that might put you in the right direction on using it:

https://www.thepolyglotdeveloper.com/2015/02/make-facebook-mobile-app-ionic-framework/ http://ionicframework.com/blog/oauth-ionic-ngcordova/

If your service depends on the accuracy of the login data, you may want to validate via the back-end as well. However this RESTful approach is similar to the JavaScript library.

Regards,

Getting Facebook login working in the mobile hybrid app is half the battle. The other half is sharing the credentials with the backend. I just finished implementing this against a Flask backend so I thought I'd share what worked.

Let the user insert his username and password in the Ionic app and POST those to my server and then use those to authenticate the user on facebook and get a token for it. This obviously totally defies the purpose of OAuth, but I guess it would work.

This would be a very bad idea (as you pointed out, it violates the principles of OAuth), and in fact it wouldn't work. There is no endpoint where you can programmatically hand Facebook a login and password, and get a token in response (legally, and without scraping). Instead, getting a token requires a callback with user interaction, whether it's performed on the frontend or on the backend. Consider the case of two-factor authentication in Facebook where the user needs to retrieve and enter a code sent to their mobile phone.

Use Facebooks Javascript authentication which returns the token to the app. I can then POST the token to my server to save it for later usage.

Yup, this is how it should be done. This is called cross-client authentication. Facebook has a page which explains auth tokens that is conceptually helpful and discusses lots of different scenarios but unfortunately does not include many helpful code fragments.

You can directly pass the access token to the backend as part of the login process. The backend can then validate the token. Assuming you are using the standard Flask-Security and Flask-Social packages on the backend, you can wrap the Flask-Social login view to authenticate the user using the token passed from the frontend. You can find sample code in this gist: https://gist.github.com/lrettig/7ca94ba45961207a7bd3

Also note that this token is typically only valid for a couple of hours. If you need the backend to use the Facebook SDK on behalf of the user on an ongoing basis, you'd need to swap it for a Long-Term token.

Another side note that confused me for a while: I noticed that, after authenticating with Facebook on the frontend, I was handed an access token, whereas using a Python SDK on the backend, I was handed a code instead, which needs to be exchanged for a token before any query can be performed. I'm not sure why the difference, but codes and tokens are also described in the Facebook docs.