API Connector - use most JSON APIs directly from Bubble

We are really excited to announce that in addition to Blockspring and Zapier, you can now also connect to other services using the API Connector!

This really opens up a lot of opportunities to use services like Lyft, Etsy and a lot more, without having to write any code.

We put together two video tutorials to help you get up to speed - one to create a BMI calculator and another to get a listing from Etsy.

There are a lot of ways we can grow this feature - looking forward to your feedback, here for feature requests and via support@bubble.is for bugs.

Cheers!

21 Likes

Hi George,

Great Feature.

Is it possible set set parameters for a get call based on an input from your site. Such as search etsy listings to display listings based on there title, the title been inputted on our app page.

Thanks

P.s i get this message when i try and call my own API using my own domain.

It works when i try the domain attached to bubble such as APPNAME.bubbleapps.io.

1 Like

You can set call parameters for all call types, including GET. See the Etsy video tutorial.
I’d have to see your call (email us at support@bubble.is if there are private details) to understand what happens.

Great work guys! Looks like this opens up a number of possibilities.

I am trying to connect to an OAuth2 application, which redirects the user back to my site with a code. I am to then exchange the code for an access token by making a POST call, and including the code in the parameters.

My question is, how do I include the the code from the redirect in the parameters of the next call?

3 Likes

Yes! Great work!!

1 Like

You can create a page that gets the parameter (your token in this case) from the URL and on page load makes the POST call you need. We will soon enable better OAuth support, but for now try this.

1 Like

Having a small issue getting this to work with repeating groups. Trying to display a repeating group with a setlist using their json API. When I try to set the repeating group data source, all items return red errors. What am I doing wrong?

Is this going to enable me to be able to use midi functionality on my websites?

Very cool… Great Job guys!

1 Like

Hi,

First of all, congrats guys for this new feature !:smiley:

I would like to know if this feature can allow us to stock and display some HTML content such as heading tags, text, etc. on the API connector and then display them as a fully understandable and readable written code by robots in body pages of an app?

So far as I know, Bubble does not offer yet the ability to set different tags in the body of all pages of an app. Feel free to correct me if I’m wrong ! :wink:

If not, maybe an easier, less api call function on page load and with less settings operations for bubblers option would be to have something like this on page settings ? :

a) Add a button called " Add a tag into the Body"

b) Adding sections for the code we want to add for example “My h1 heading” or wich would enable bubblers to have access on styles settings, x and y values at least on it :

Does it makes sense and is it something easy to implement?

Thanks a lot! :smile:

Does this support nested calls?

I’m currently testing the following out:

But when I initialize it, it gives me ----> {“errors”:{“fulfillment_service”:“expected String to be a Hash”}}

I’m not too familiar with API calls so I’m guessing “fulfillment_service” is nested but Bubble can’t support this yet?

Thank you. Makes sense. Am I able to get an access token. How do I pass that into the next GET call? Their documentation tells me to pass the access token as a bearer token by including an Authorization header with the value of Bearer, but I can’t get the call to initialize in Bubble due to an “invalid_token” error. Obviously I’m not including credentials (client_id, client_secret, code) in this get call. Should I be?

It should work. Did you set the Content-Type header to application/json?

This depends on the token expiration. If the token is valid for say minutes or an hour, you can include it as a client-safe header for the second call. If the token nevee expires obtain it and then manually save it as a private header parameter on the call.

We’ll enable native OAuth support soon, it looks like it’s needed. This will make the process transparent and secure, since it will be handled by our server.

1 Like

Thank you Jean-Pierre.
What are you trying to achieve? If you’d like to edit the page HTML, look into the HTML component to add things. I’m not sure it would help with SEO if that’s what you’re looking to do.

Not sure, but if you want to you can add an HTML embed with the HTML component.

1 Like

Hi Bam,

We only load the first element of an array (changing that soon) so that might be what you are seeing. Can you please include a screenshot of the result of the initialize call mapping, and of the editor where you use this? Email us at support if you have confidential data.

Hey @georgeciobanu

how would i use the API connector and place a value in the url below. This API provider requires the data to be passed in the url (Red area). this is aside from other data required in parameters

thanks

Hi Ali,

If there’s no other way to pass the parameter (via body, header or parameters) we can create a client-safe checkbox for the url and let you configure it as well.

1 Like

So it will be like the parameter section? OK let me know when as blockspring now requires me to have a paid membership and I rather use this plugin.