Facebook Login

To enable users to login with Facebook, you need to create an application with Facebook to serve as the OAuth provider.

Step-By-Step Guide

Follow the steps to below to configure Facebook login.

Step 1: Register Your App

To create your OAuth application, go to Facebook for Developers.

Next, select My Apps .


Then, click on Create App.


Select an app type. Learn more about Facebook's app types, set your app name, and set your app contact email.


Step 2: Add Facebook Login

On your Facebook application's dashboard, click the Facebook Login Set Up button.


Then, enable Client OAuth Login, enable Web OAuth Login, and set your Redirect URI (for example, http://localhost:3000/account/social/success).

Step 3: Enable public_profile advanced permission

Depending upon which Facebook application type you registered, you may need to enable public_profile advanced permission.

In App Review, select Permissions and Features, look for public_profile and click Get Advanced Access.


πŸ“˜

Advanced Permission

If you do not see the option to Get Advanced Access, either the app type you selected already has it by default or else it is not available with the app type you selected.


Step 4: Enter Credentials In Frontegg


πŸ‘

Test Environment

If you are still developing your app, create a Facebook test app and enter those credentials into the Frontegg Portal. See the guide. When ready for production, switch your credentials to your Facebook production app.


Copy the App ID and App Secret from Facebook Login.


Go to Authentication ➜ Settings ➜ Social Logins, click on the Facebook Login configure button and enter your Facebook information.


Step 5: Test Facebook Button

In your login screen, you should see a Facebook button that redirects to the Facebook OAuth Consent screen for login. Test it to make sure it works.


πŸ“˜

Set Who Can Login With Facebook

By default, only invited users can login with Facebook. If you want to allow new users to signup with Facebook, go to Authentication ➜ Settings ➜ Authentication flow and enable Allow Signups.


Create Test Environment

To test your app in a development environment, create a Facebook test app.

Step 1: Create Test App

To create a test app, click on your app name on the top left corner. Select Create Test App .


Give it a name and select Create Test App.


Step 2: Add Facebook Login

To add Facebook login, it is the same process as for the setup you did for the production app:

  • On your app's dashboard, click Set Up for Facebook Login.


Step 3: Enter Credential In Frontegg

From your Facebook test app, copy your App ID and App Secret and enter them into the Facebook Login configuration section of your Frontegg Portal.


Go to Authentication ➜ Settings ➜ Social Logins, click on the Facebook Login configure button and enter your Facebook information.


Did this page help you?