Forum Documentation Showcase Pricing Learn more

Manual Oauth login for Facebook

Can anyone explain how to go about doing a manual OAUTH login flow for Facebook? I need to do this so I can get the access token that comes back.

Hard Mode … (this assumes you know what you are doing)…

Set up your app on facebook developer portal. Add in the callback URL on your app.

In bubble … Have button that launches an external website …

https://www.facebook.com/v3.3/dialog/oauth? client_id=xxxxx&redirect_uri=https://yourapp.bubbleapps.io/version-test/callback

Once that is working you will see that you get a code back on the redirect … something like …

https://yourapp.bubbleapps.io/version-test/callback?code=AQD7c7A2av7NkgSmsRqeRp1kx7GZsmliCOIrd4tzkNw10vLNhdJ3sJImBUbJ8HOv3yNj0gBTG_3Cz2zs7XQQgXgYKHlFXZuOEry_-fWHcf3FkKfSdCrcnVBlR4sX6CscMmN2HgeTP4eoZuTzZHAlykZoZ7HOdPnCB6xCWOUN084IMG7fEr63J0xuTRnvrq2rddllT61fnKHG4QkmZFvjBUaHg5UWeDuQtwcDdVK4Fa_lV4Y4oXHi44bOk-D1R2cJIbbUHV3QpElu-1vNsW0yzY1ner4B4nToxHLXFT1srQKMZ2xVBwITAfZuPHmH0JQKdIU#_=_

(note I haven’t used “state” here … you probably should but it is ok for now).

Set up a call in the API Connector (don’t connect it to the page yet !)…

GET https://graph.facebook.com/v3.3/oauth/access_token

client_id = xxxx
redirect_uri = the same as the one above
client_secret = yyyy
code = grab the code from the URL above

Don’t do anything else at this point, as it takes a lot of manual stuff to get the bits working, do it all manually in the editor, don’t do it automatically (e.g. the code is one time, so if you have a page action on load early on, it will use up the token straight away, so leave it be until you have initialised all the API calls).

Now, you have have your access token, you will have basic profile scope only (name and id). If you need more you can request in the first step (add… ,scope=user_gender or whatever you need but bear in mind you may need an app review).

Simplest thing to test … get the profile using another API connector…

GET https://graph.facebook.com/v3.3/me

access_token = from the call above.

Now on page load on callback call an API Connector and grab the code parameter from the URL and pass it.

Once all these are up and running, you can call the API connector on page load. Get the token, and then display the name on the page.

This is current as of now. It will most probably change :slight_smile:

Thanks so much, this worked great!

1 Like