Why does facebook business login for instagram get stuck at connect to instagram?

Question

I'm trying to implement facebook business login for instagram. Below is my constructed url and the href tag calling that URL. However, the flow gets stuck at connect to instagram with the error

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://www.facebook.com') does not match the recipient window's origin ('https://web.facebook.com'). DO

const FACEBOOK_LOGIN_URL = `https://www.facebook.com/${FACEBOOK_API_VERSION}/dialog/oauth?client_id=${process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_ID}&client_secret=${process.env.NEXT_PUBLIC_FACEBOOK_APP_SECRET}&display=page&extras={'setup':{'channel':'IG_API_ONBOARDING'}}&redirect_uri=${process.env.NEXT_PUBLIC_FACEBOOK_LOGIN_REDIRECT_URI}&response_type=token&scope=instagram_basic,pages_show_list,business_management,instagram_manage_messages,pages_manage_metadata,pages_messaging`;

     <a
          href={`${FACEBOOK_LOGIN_URL}`}
          className="flex flex-row items-center"
        >
          Login to Facebook
        </a>

I tried using "web.facebook.com" inplace of "www.facebook.com" and i still get the same issue.

Anyone run into this before and know how to fix it?

Answer 1

I see you're passing client_secret in the url.

I think that's a bad idea because that's sensitive information that should not be publicly available. Also, the docs for Business Login for Instagram does not specify a field called client_secret.

Just want to chime in because I'm facing the same issue. I can add that if I sign into Instagram with a "normal" profile, then it makes me convert it to a professional account. I'm still stuck at the same place as you afterwards, though.

Answer 2

In my case in desktop it works fine because it opens a popup for the Instagram credentials, and when logged in it closes the popup and the onboarding goes to the next step automatically to select the pages and so on. But on mobile, when clicking the start button in the first step for the Instagram configuration, instead of the popup it asks me to open the Instagram app or continue the login in the browser. If I select the Instagram app then it opens but it doesnt do anything, just shows the timeline. If I select the browser, it opens a new tab and when logged in on Instagram it redirects to Facebook and keeps in a loop reloading the page