How to integrate Paypal with Bubble using Oauth2

Hi All,

I just wanted to share with everyone how I was able to integrate Oauth2 for Paypal since Emmanuel spent a good deal of time with me over email to fix the issues I was having. Keep in mind that this pertains only to Paypal, however some of the notes I make below could carry over to other applications.

The initial issue I was having was that Bubble was not recognizing the access token from Paypal because Paypal uses Basic Auth in order to request the token. This functionality was missing from Bubble and was added by Emmanuel throughout our triaging of the issue. Otherwise, we were just doing some trial and error testing to get the setup right in the API connector panel. In general, please follow the below instructions to set up paypal properly:

You must have a valid Paypal developer account in order to add this functionality. Once you set up a developer account, you will receive “sandbox” credentials to test the functionality.
This tripped me up the most…the redirect URL that you place in your Paypal developer dashboard must be the URL for the same page in in which the link to your paypal authorization resides. E.g., if you click on a button on http://www.mysite.com/signin, the redirect URL in your paypal developer dashboard must be that exact link and nothing different or else you will get a relying party validation error and not see the Paypal login. Also, once you place the redirect URL in the appropriate box it might take up to 3 hours for the settings to take effect.
You must ensure that when you initially set up the Oauth2 authorization call you DO NOT add any sequential page actions in the workflow panel or else you won’t get the success message that you set up the Oauth2 connection correctly with Paypal.
Finally, please find below the proper parameters to use in the API connector panel:
-Scope: openid
-Authentication goes in the header-checked
-APi uses the refresh token mechanism-checked
-Request an access token uses Basic Auth-checked
-App ID: Comes from Paypal dev dashboard
-client secret: Same as above
-Login dialog redirect: https://www.sandbox.paypal.com/webapps/auth/protocol/openidconnect/v1/authorize
-Access token endpoint: https://api.sandbox.paypal.com/v1/oauth2/token
-User Profile endpoint: https://api.sandbox.paypal.com/v1/identity/openidconnect/userinfo?schema=openid
-User ID key path: user_id
-User email key path: email

This should clear up a lot but if anyone has any further questions feel free to post here or message me personally. Thanks!

11 Likes

Thank you for posting this!

2 Likes

Sure no problem!

1 Like

does use of Basic Auth by PayPal pose some security problem? (would expect them to use highest possible). Or wasn’t Bubble supporting some lower level of security there before and implementing this is better than before?

Hi! I tried to follow the steps but I got lost pretty soon, can you show us screenshots of the process? that would help us a lot :slight_smile:

Hi jr_veg

I actually gave up on this because I wanted to be able to post a payment to paypal using API connector. I don’t have screenshots anymore unfortunately. Also the api connector changed they have a v2 now so that might be what’s causing your issues.