Edit

Set up sign-up and sign-in with a Facebook account using Azure Active Directory B2C

  • Article

Before you begin, use the Choose a policy type selector at the top of this page to choose the type of policy you’re setting up. Azure Active Directory B2C offers two methods to define how users interact with your applications: through predefined user flows or through fully configurable custom policies. The steps required in this article are different for each method.

Note

In Azure Active Directory B2C, custom policies are designed primarily to address complex scenarios. For most scenarios, we recommend that you use built-in user flows. If you've not done so, learn about custom policy starter pack in Get started with custom policies in Active Directory B2C.

Prerequisites

Create a Facebook application

To enable sign-in for users with a Facebook account in Azure Active Directory B2C (Azure AD B2C), you need to create an application in Facebook App Dashboard. For more information, see App Development.

If you don't already have a Facebook account, sign up at https://www.facebook.com. After you sign-up or sign-in with your Facebook account, start the Facebook developer account registration process. For more information, see Register as a Facebook Developer.

  1. Sign in to Facebook for developers with your Facebook developer account credentials.
  2. Select Create App.
  3. For the Select an app type, select Consumer, then select Next.
  4. Enter an App Display Name and a valid App Contact Email.
  5. Select Create App. This step may require you to accept Facebook platform policies and complete an online security check.
  6. Select Settings > Basic.
    1. Copy the value of App ID.
    2. Select Show and copy the value of App Secret. You use both of them to configure Facebook as an identity provider in your tenant. App Secret is an important security credential.
    3. Enter a URL for the Privacy Policy URL, for example https://www.contoso.com/privacy. The policy URL is a page you maintain to provide privacy information for your application.
    4. Enter a URL for the Terms of Service URL, for example https://www.contoso.com/tos. The policy URL is a page you maintain to provide terms and conditions for your application.
    5. Enter a URL for the User Data Deletion, for example https://www.contoso.com/delete_my_data. The User Data Deletion URL is a page you maintain to provide away for users to request that their data be deleted.
    6. Choose a Category, for example Business and Pages. This value is required by Facebook, but not used for Azure AD B2C.
  7. At the bottom of the page, select Add Platform, and then select Website.
  8. In Site URL, enter the address of your website, for example https://contoso.com.
  9. Select Save Changes.
  10. From the menu, select the plus sign or Add Product link next to PRODUCTS. Under the Add Products to Your App, select Set up under Facebook Login.
  11. From the menu, select Facebook Login, select Settings.
  12. In Valid OAuth redirect URIs, enter https://your-tenant-name.b2clogin.com/your-tenant-name.onmicrosoft.com/oauth2/authresp. If you use a custom domain, enter https://your-domain-name/your-tenant-id.onmicrosoft.com/oauth2/authresp. Replace your-tenant-id with the id of your tenant, and your-domain-name with your custom domain.
  13. Select Save Changes at the bottom of the page.
  14. To make your Facebook application available to Azure AD B2C, select the Status selector at the top right of the page and turn it On to make the Application public, and then select Switch Mode. At this point, the Status should change from Development to Live. For more information, see Facebook App Development.

Configure Facebook as an identity provider

  1. Sign in to the Azure portal as the global administrator of your Azure AD B2C tenant.
  2. If you have access to multiple tenants, select the Settings icon in the top menu to switch to your Azure AD B2C tenant from the Directories + subscriptions menu.
  3. Choose All services in the top-left corner of the Azure portal, search for and select Azure AD B2C.
  4. Select Identity providers, then select Facebook.
  5. Enter a Name. For example, Facebook.
  6. For the Client ID, enter the App ID of the Facebook application that you created earlier.
  7. For the Client secret, enter the App Secret that you recorded.
  8. Select Save.

Add Facebook identity provider to a user flow

At this point, the Facebook identity provider has been set up, but it's not yet available in any of the sign-in pages. To add the Facebook identity provider to a user flow:

  1. In your Azure AD B2C tenant, select User flows.
  2. Click the user flow that you want to add the Facebook identity provider.
  3. Under the Social identity providers, select Facebook.
  4. Select Save.
  5. To test your policy, select Run user flow.
  6. For Application, select the web application named testapp1 that you previously registered. The Reply URL should show https://jwt.ms.
  7. Select the Run user flow button.
  8. From the sign-up or sign-in page, select Facebook to sign in with Facebook account.

If the sign-in process is successful, your browser is redirected to https://jwt.ms, which displays the contents of the token returned by Azure AD B2C.

Create a policy key

You need to store the App Secret that you previously recorded in your Azure AD B2C tenant.

  1. Sign in to the Azure portal.
  2. If you have access to multiple tenants, select the Settings icon in the top menu to switch to your Azure AD B2C tenant from the Directories + subscriptions menu.
  3. Choose All services in the top-left corner of the Azure portal, and then search for and select Azure AD B2C.
  4. On the Overview page, select Identity Experience Framework.
  5. Select Policy Keys and then select Add.
  6. For Options, choose Manual.
  7. Enter a Name for the policy key. For example, FacebookSecret. The prefix B2C_1A_ is added automatically to the name of your key.
  8. In Secret, enter your App Secret that you previously recorded.
  9. For Key usage, select Signature.
  10. Click Create.

Configure a Facebook account as an identity provider

  1. In the SocialAndLocalAccounts/TrustFrameworkExtensions.xml file, replace the value of client_id with the Facebook application ID:

    <TechnicalProfile Id="Facebook-OAUTH">
  <Metadata>
  <!--Replace the value of client_id in this technical profile with the Facebook app ID"-->
    <Item Key="client_id">00000000000000</Item>

Upload and test the policy

Update the relying party (RP) file that initiates the user journey that you created.

  1. Upload the TrustFrameworkExtensions.xml file to your tenant.
  2. Under Custom policies, select B2C_1A_signup_signin.
  3. For Select Application, select the web application named testapp1 that you previously registered. The Reply URL should show https://jwt.ms.
  4. Select the Run now button.
  5. From the sign-up or sign-in page, select Facebook to sign in with Facebook account.

If the sign-in process is successful, your browser is redirected to https://jwt.ms, which displays the contents of the token returned by Azure AD B2C.

Next steps