## Facebook integration

Integrating Facebook with Frontegg lets your application authenticate users with their Facebook account and read profile and page data through the [Meta Graph API](https://developers.facebook.com/docs/graph-api/). You configure the integration by creating a Meta for Developers app with the Facebook Login use case, then providing the App ID, App secret, and Frontegg redirect URL.

Prerequisites
- A [Meta for Developers](https://developers.facebook.com/) account.
- A [Meta Business Portfolio](https://business.facebook.com/) to associate with the app (you can also create one during app creation).


### Create a Meta app

#### Step 1: Open the Meta for Developers apps page

Sign in to the [Meta for Developers apps page](https://developers.facebook.com/apps/) with your Facebook account. Click **Create App** to start the app creation flow.

![Meta for Developers Apps page with Create App highlighted](/assets/facebook-1.1bfb9183e1bfb0eb5a54f652722adcc5414ae46db6ae72de462dac502cf0eaae.1ce25488.png)

#### Step 2: Add app details

Enter an **App name** (for example, `Frontegg Social Connector`) and confirm the **App contact email**. Meta uses this email for policy notifications, so set it to an address you check regularly. Click **Next**.

App name restrictions
Meta does not allow app names that contain reserved brand terms like `FB`, `Face`, `Book`, `Insta`, `Gram`, or `Rift`. Choose a neutral name (for example, `Frontegg Social Connector`) instead.

![App details step with Next highlighted](/assets/facebook-2.fafd64be25a0a1df91899c527ccf1d269a394c2152dd7aeb08091ce40bfa77e8.1ce25488.png)

#### Step 3: Select the Facebook Login use case

On the **Use cases** step, select **Authenticate and request data from users with Facebook Login**. This is the standard use case for OAuth integrations that need to read user profile and email. Click **Next**.

![Use cases step with Authenticate and request data from users with Facebook Login highlighted](/assets/facebook-3.40c6b2328e65067a77e116058548217f074d71b85d00c5b1d01d2ba623c81dc5.1ce25488.png)

#### Step 4: Connect a Business Portfolio

On the **Business** step, choose the Business Portfolio that will own this app, then click **Next**. You can connect an unverified portfolio now and complete business verification later when you submit for App Review.

![Business portfolio selection step with Next highlighted](/assets/facebook-4.6a4458522b1f9e6647b8af00962689ca2f4d1649c1e6f398e97e5d75ae6f9cbc.1ce25488.png)

#### Step 5: Review and create the app

Click **Next** through the **Requirements** step, review the **Overview**, then click **Create app**. Meta may ask you to re-enter your Facebook password to confirm.

![Overview step with Create app highlighted](/assets/facebook-5.b3e9168faeb671aea1ccf8b92e06143ef85f4fe2809661f931f668d46ee53778.1ce25488.png)

### Copy the credentials

#### Step 6: Find the App ID and App secret

In the app dashboard, navigate to **App settings → Basic**. The top of the page shows the **App ID** and **App secret**. Copy the **App ID** — this is your Frontegg **Client ID**. Click **Show** next to **App secret**, re-enter your Facebook password when prompted, and copy the value — this is your Frontegg **Client Secret**.

![App settings Basic page with App ID and App secret highlighted](/assets/facebook-6.35c447f857f2e98cb3f237367f189b96ddffd773680151a555509b9f87dcd02f.1ce25488.png)

### Configure permissions

#### Step 7: Add the required Facebook Login permissions

Navigate to **Use cases → Customize** on the **Authenticate and request data from users with Facebook Login** tile. On the **Permissions and features** tab, click **Add** next to each permission you need. `public_profile` is granted to every app by default, so at minimum add `email`.

The integration uses the following scopes:

| Scope | Description |
|  --- | --- |
| `public_profile` | Read the default public profile fields on the user node. Granted by default. |
| `email` | Read the user's primary email address. |
| `pages_show_list` | List the Facebook Pages the user manages. |
| `pages_read_engagement` | Read page engagement data and posts. |
| `pages_manage_posts` | Publish, edit, and delete posts on a Page. |
| `pages_read_user_content` | Read user-generated content on a Page (comments, ratings). |


Pages scopes require additional use cases
The `pages_*` scopes are not part of the Facebook Login use case. To request them, click **Add more to this use case** and add the **Manage everything on your Facebook Page** use case, then add the page permissions from its **Permissions and features** tab.

Standard access requires App Review
Permissions are initially **Ready for testing** — they work only for users assigned to the app under **App roles → Roles** or **Test users**. To grant access to any Facebook user, submit your app for [App Review](https://developers.facebook.com/docs/app-review/) and request **Standard access** for each scope.

![Permissions and features tab with email and public_profile highlighted](/assets/facebook-7.0e12dfd5db1405c403c4ca419a75113d27592adb1f8d5c738f5d5011bdf87df9.1ce25488.png)

### Configure the redirect URL

#### Step 8: Add the Frontegg redirect URL

In the same **Customize use case** view, open the **Settings** tab. Scroll to **Valid OAuth Redirect URIs** and add your Frontegg redirect URL:

- `https://YOUR_MCP_GATEWAY_URL/integration-callback`


Replace `YOUR_MCP_GATEWAY_URL` with the MCP Gateway URL from the Frontegg portal **Settings → Basic configuration** page. Press `Enter` to add the URI as a chip, then click **Save changes**.

![Facebook Login Settings page with Valid OAuth Redirect URIs and Save changes highlighted](/assets/facebook-8.47731134b422732df88e872993adc9ae20444852c25a0beaded848ddf0d3a8a2.1ce25488.png)

### Verify the OAuth flow

#### Step 9: Preview the consent screen

Open the Facebook OAuth dialog in a new tab to confirm that the redirect URL, App ID, and scopes are wired correctly:


```text
https://www.facebook.com/v24.0/dialog/oauth?client_id=YOUR_APP_ID&redirect_uri=https://YOUR_MCP_GATEWAY_URL/integration-callback&response_type=code&scope=public_profile,email
```

Facebook should display a consent screen titled "Frontegg Social Connector is requesting access to:" listing **Name and profile picture** and **Email address** — this is the screen end users see when authorizing the integration.

![Facebook OAuth consent screen showing the requested permissions](/assets/facebook-9.33b855b981fb2ba545175bf305267b4298d9540267f55b31fc6f7c2d7f6af7cc.1ce25488.png)

### Configure the Frontegg portal

Once you have your **App ID (Client ID)** and **App secret (Client Secret)**, enter them in the Frontegg portal:

1. Open the **Frontegg portal** and navigate to [ENVIRONMENT] → Integrations → Facebook.
2. Enter the **Client ID** and **Client Secret** in the corresponding fields.
3. Select the required **scopes**.
4. Click **Save**.


When a user authorizes the integration, Facebook prompts them to log in and grant the requested permissions to your app.

Keep your credentials secure
Never share or commit your App secret to version control.

### Additional resources

- [Facebook Login documentation](https://developers.facebook.com/docs/facebook-login/)
- [Meta Graph API documentation](https://developers.facebook.com/docs/graph-api/)
- [Permissions reference](https://developers.facebook.com/docs/permissions/)
- [Meta App Review process](https://developers.facebook.com/docs/app-review/)
- [Meta for Developers apps page](https://developers.facebook.com/apps/)
- [How to get your Redirect URL](/agen-for-work/connectors/redirect-url)