Request for Facebook Login for Business #7835

wbrijesh · 2023-06-17T08:09:57Z

wbrijesh
Jun 17, 2023

Description 📓

There are two types of facebook apps, 1. login with facebook 2. business

In business apps you can add login for businees to get access to some feature, in my case ads_read and ads_management permissions

Purpose of the feature

login for business apps using nextauth

Potential problems

none, its almost same as a regular app for login but instead of scope you have response_type and instead of client_id, client_secret there is config_id

Potential alternatives

using facebook sdk directly in next.js without nextauth

How to reproduce ☕️

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Home</title>
</head>
<body>
<script>
    window.fbAsyncInit = function() {
        FB.init({
            appId            : 'APP_ID',
            autoLogAppEvents : true,
            xfbml            : true,
            version          : 'v17.0'
        });
    };
</script>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
<script>
function loginWithFacebook() {
    FB.login(
        function(response) {
            console.log("response: ", response);
        },
        {
            config_id: 'CONFIG_ID',
            response_type: 'code'
        }
    );
}
</script>
<p>hi edit</p>
<button onclick="loginWithFacebook()">Login</button>
</body>
</html>

Contributing 🙌🏽

Yes, I am willing to help implement this feature in a PR

tirk1 · 2023-08-25T16:35:04Z

tirk1
Aug 25, 2023

Yes, I would really like to get this functionality as I don't know how to use next auth at the moment while using facebook login for business

0 replies

ttibau · 2023-08-29T18:51:24Z

ttibau
Aug 29, 2023

Dear @wbrijesh how are you?

Do you need help to implement that? I don't know how can I help you but I'm willing too.

0 replies

mateus-de-oliveira · 2024-01-20T14:17:36Z

mateus-de-oliveira
Jan 20, 2024

Any solution?

0 replies

rasvanB · 2024-04-01T21:09:00Z

rasvanB
Apr 1, 2024

You can create your own custom provider.
This is the one i wrote for Facebook Login for Business.

const FacebookBusinessProvider = {
  id: "facebook_business",
  name: "Facebook for Business",
  type: "oauth",
  authorization: {
    url: "https://www.facebook.com/dialog/oauth",
    params: {
      scope:
        "pages_show_list ads_management business_management pages_read_engagement pages_manage_posts email",
    },
  },
  token: {
    url: "https://graph.facebook.com/oauth/access_token",
  },
  userinfo: {
    url: "https://graph.facebook.com/me",
    params: { fields: "id,name,email,picture" },
    async request({ tokens, client, provider }) {
      return await client.userinfo(tokens.access_token!, {
        // @ts-expect-error
        params: provider.userinfo?.params,
      });
    },
  },
  clientId: env.FACEBOOK_CLIENT_ID,
  clientSecret: env.FACEBOOK_CLIENT_SECRET,
  profile(profile) {
    return {
      id: profile.id,
      name: profile.name,
      email: profile.email,
      image: profile.picture.data.url,
    };
  },
} satisfies Provider;

2 replies

nickwinder Jun 15, 2024

Thanks @rasvanB!
Just a note to say, I had to change authorization.url to `https://www.facebook.com/v20.0/dialog/oauth" to get things working.

hsuabina Jul 3, 2024

This doesn't look look like a valid approach to implement Login with FB for Business.

As the OP said, in a FB Login for Business you don't pass scopes in the auth url, but a config_id you generate on the app's setting page.

This look like an implementation of the traditional Login with FB.

Mukhsin0508 · 2024-07-28T00:50:20Z

Mukhsin0508
Jul 28, 2024

Hello guys!

I need help with implementing Facebook login for business! I almost build most of it, but I am receiving Application Error and can't figure out what am I missing!

My code:
`

Facebook/views.py

import logging
from django.shortcuts import redirect, render
from django.urls import reverse
from dotenv import load_dotenv
from django.contrib.auth.decorators import login_required
from django.utils import timezone
from datetime import timedelta
import requests, os
from users.models import Accesstoken
from django.http import JsonResponse

load_dotenv()

logger = logging.getLogger(name)

Environment variables

FACEBOOK_REDIRECT_URL = os.getenv('FACEBOOK_REDIRECT_URL')
FACEBOOK_APP_ID = os.getenv('FACEBOOK_APP_ID')
FACEBOOK_APP_SECRET = os.getenv('FACEBOOK_APP_SECRET')
BASE_GRAPH_API_URL = 'https://graph.facebook.com/v20.0/'

@login_required
def facebook_login(request):
"""Redirects user to Facebook login page."""
fb_login_url = (
f"https://www.facebook.com/dialog/oauth?"
f"client_id={FACEBOOK_APP_ID}&"
f"redirect_uri={FACEBOOK_REDIRECT_URL}&"
f"response_type=code&scope=pages_show_list,pages_manage_metadata,pages_messaging,pages_read_engagement,business_management,instagram_basic,instagram_manage_messages"
)
logger.info(f'Redirecting to Facebook login URL: {fb_login_url}')
return redirect(fb_login_url)

@login_required
def facebook_login_success(request):
try:
code = request.GET.get('code')
if not code:
logger.error('Code not provided')
return JsonResponse({'error': 'Code not provided'}, status=400)

    logger.info(f'Received code: {code}')
    
    # Exchange the code for a short-lived access token
    access_token_url = (
        f"{BASE_GRAPH_API_URL}oauth/access_token?"
        f"client_id={FACEBOOK_APP_ID}&"
        f"redirect_uri={FACEBOOK_REDIRECT_URL}&"
        f"client_secret={FACEBOOK_APP_SECRET}&"
        f"code={code}"
    )
    logger.info(f'Requesting short-lived access token from URL: {access_token_url}')
    access_token_response = requests.get(access_token_url)
    access_token_data = access_token_response.json()
    logger.info(f"access_token_response: {access_token_data}")  # Print the full response

    if 'access_token' not in access_token_data:
        logger.error('Failed to obtain short-lived access token')
        return JsonResponse({'error': 'Failed to obtain short-lived access token'}, status=400)
    
    short_lived_access_token = access_token_data['access_token']
    logger.info(f'Obtained short-lived access token: {short_lived_access_token}')
    
    # Get page access token
    try:
        accounts_url = (
            f"{BASE_GRAPH_API_URL}me/accounts?"
            f"access_token={short_lived_access_token}&"
            f"fields=connected_instagram_account,access_token"
        )
        logger.info(f'Requesting page access token from URL: {accounts_url}')
        accounts_response = requests.get(accounts_url)
        accounts_data = accounts_response.json()
        logger.info(f"accounts_url_response: {accounts_data}")  # Print the full response

        if 'data' not in accounts_data or not accounts_data['data']:
            logger.error('No accounts found or no Instagram account connected')
            return JsonResponse({'error': 'No accounts found or no Instagram account connected'}, status=400)
        
        # Assuming the first account here.
        page_access_token = accounts_data['data'][0].get('access_token')
        if not page_access_token:
            logger.error('No page access token found')
            return JsonResponse({'error': 'No page access token found'}, status=400)
        
        logger.info(f'Obtained page access token: {page_access_token}')
    except Exception as e:
        logger.error(f'Error fetching page access token: {str(e)}')
        return JsonResponse({'error': 'Error fetching page access token'}, status=500)
    
    # Convert to long-lived access token
    try:
        long_live_access_token_url = (
            f"{BASE_GRAPH_API_URL}oauth/access_token?"
            f"grant_type=fb_exchange_token&"
            f"client_id={FACEBOOK_APP_ID}&"
            f"client_secret={FACEBOOK_APP_SECRET}&"
            f"fb_exchange_token={page_access_token}"
        )
        logger.info(f'Requesting long-lived access token from URL: {long_live_access_token_url}')
        long_live_access_token_response = requests.get(long_live_access_token_url)
        long_live_access_token_data = long_live_access_token_response.json()
        logger.info(f"long_live_access_token_response: {long_live_access_token_data}")  # Print the full response

        if 'access_token' not in long_live_access_token_data:
            logger.error('Failed to obtain long-lived access token')
            return JsonResponse({'error': 'Failed to obtain long-lived access token'}, status=400)
        
        long_lived_access_token = long_live_access_token_data['access_token']
        logger.info(f'Obtained long-lived access token: {long_lived_access_token}')
    except Exception as e:
        logger.error(f'Error converting to long-lived access token: {str(e)}')
        return JsonResponse({'error': 'Error converting to long-lived access token'}, status=500)

    # Save the access token
    try:
        expires_in = long_live_access_token_data.get('expires_in', 5183944)
        expires_at = timezone.now() + timedelta(seconds=expires_in)
        
        Accesstoken.objects.update_or_create(
            user=request.user,
            page_id=accounts_data['data'][0]['id'],
            defaults={'access_token': long_lived_access_token, 'expires_at': expires_at}
        )
        
        logger.info("Successfully connected to Facebook and converted short-lived token to long-lived token")
    except Exception as e:
        logger.error(f'Error saving access token: {str(e)}')
        return JsonResponse({'error': 'Error saving access token'}, status=500)

    # Display inline success message before redirecting
    context = {'message': 'Successfully connected to Facebook. Redirecting to messenger...'}
    return render(request, 'fb_integration/success.html', context)
except Exception as e:
    logger.error(f'Error during Facebook login success: {str(e)}')
    return JsonResponse({'error': 'An error occurred during Facebook login success'}, status=500)

def messenger(request):
return render(request, 'dashboard/messenger.html')

{% load static %} <title>Messanger</title> <style> body { background: linear-gradient(125deg, #1e1e1e 25%, #282828 75%); color: #fff; font-family: Arial, Helvetica, sans-serif; text-align: center; padding: 50px; }

        .messenger-container {
            width: 100%;
            max-width: 800px;
            margin: 0 auto;
            background: rgba(0, 0, 0, 0.7);
            border-radius: 10px;
            padding: 20px;
            text-align: left;    
        }

        .message {
            background: #333;
            padding: 10px;
            border-radius: 5px;
            margin: 10px 0;
        }

        .message.user {
            background: #555;
            text-align: right;
        }

        .message input {
            width: 100%;
            padding: 10px;
            border-radius: 5px;
            border: none;
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <h2>Messanger</h2>
    <div class="message">
        <p>Hello! How can I help you today?</p>
    </div>
    <div class="message user">
        <p>I need some information!</p>
    </div>
    <input type="text" placeholder="Type a message...">
</div>
</body>

<title>Facebook Login Success</title>

After Connecting to the Facebook, it is not redirecting me to the success.html page but instead I receive a Application error at this url in chrome: https://sales-io-platform.herokuapp.com/facebook/facebook_login_success/?code=code_returned_from_facebook

What can I do to solve this problem?

0 replies

dumpstate · 2024-09-09T06:29:19Z

dumpstate
Sep 9, 2024

Passing config_id as authorization parameter does solve the problem for me:

FacebookProvider({
    clientId: process.env.FACEBOOK_CLIENT_ID,
    clientSecret: process.env.FACEBOOK_CLIENT_SECRET,
    authorization: {
        params: {
            config_id: '...login for business configuration id...'
        }
    }
})

Not sure any other form of explicit support for 'Facebook Login for Business' is needed. But an example in the documentation would be very handy.

0 replies

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Request for Facebook Login for Business #7835

{{title}}

Replies: 6 comments 2 replies

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{title}}

{{editor}}'s edit

{{editor}}'s edit

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Select a reply

Request for Facebook Login for Business #7835

Description 📓

Purpose of the feature

Potential problems

Potential alternatives

How to reproduce ☕️

Contributing 🙌🏽

Replies: 6 comments · 2 replies

Facebook/views.py

Environment variables

{{ message }}

Replies: 6 comments 2 replies