GET request: Constructing the URI - Solved!

I’m using the Bubble “API connector” plugin to connect (GET) to an external endpoint.

The endpoint point return the details (JSON) of flight (Airline, Departure Airport, Arrival Airport, etc).

I’ve defined the Bubble “API connector” like so:

I want to append some dynamic values to the URI before the GET request i initiated:

https://external.endpoint/AA/8704/2016/06/21

These dynamic values are captured from the user using an input form.

AA = Airline Code, here AA = American Airlines
8704 = Flight Number
2016 = Departure Date, Year
06 = Departure Date, Month
21 = Departure Date, Date

Question:

  • How can I configure the workflow so that the input values can be appended to the GET request and correct URI constructed?

I’m pretty sure Bubble doesn’t support this yet. You can only send stuff as parameters or in the body. @emmanuel will know better though.

Make the URI client safe and add dynamic elements to it.

1 Like

I see that you can make the URI client safe, but can you add dynamic elements to it? I just tried and was unable to. What kind of request does it have to be?

Edit: Aha! I see now. You can do it when you actually make the call from the app, not at the API connector level. Makes total sense.

2 Likes

Exactly.

I figured out the solution soon after posting this.

You need to define the API connection as “Action” to be able to use it in a workflow. Also, here you need to define how the response from the external endpoint will be mapped to data types (text, date, number, etc).

If you use the bubble API connector, you can only use it as you @dannycvega described.

@NigelG is correct - make the URI client safe and add dynamic elements to it.

For me it meant, that as the user is adding the inputs, I’m dynamically constructing my URI. Once the user clicks on “Submit”, the linked workflow fires and I can connect to my external endpoint from bubble, get the response and update my “flight” thing.

Cheers!

3 Likes

Yes, in the API Connector you set it up with a working URI and Parameters so it pulls back valid data.

That is how you map the data to bubble.

Then, if it is client safe, you can override the URL …

Either when it is set up to be Data

Or Action…

3 Likes

if i override the the API connector URI with a custom URI as @NigelG suggests, can bubble still use any parameters that are not client safe (like a private/secret API key?). if not, is it safe to include my secret API key in my “override” URI?

the reason i ask is that i’m using an API that has several “special query fields”. in these cases, a colon ( : ) is used instead of an equal sign to assign a value to the parameter. here’s a link to the documentation that illustrates this pretty well.

https://webhose.io/documentation

so, for example, to get API results that only include news articles written in English, i have to use language:english rather than language=english as my language parameter syntax. i don’t think i can use the colon symbol in the parameter assignment fields in the API connector plugin in bubble, so i’m looking for a workaround.

related question for @emmanuel – would it be possible for a change to be made in bubble so i could choose the symbol that assigns parameters? so for certain fields (like “language” in this example), could i use a colon instead of an equal sign for some parameters? i’m open to other suggested workarounds as well.

thanks!

I think it would be worth trying to get the API to work with something like POSTMAN first, so you understand how it works.

From a quick look, you don’t need to dynamically build the URI, it is static.

Token would be a parameter.

And “q” is also a parameter that you build, “language” goes in the parameter, it isn’t a parameter in itself. Trying to put a “:” in there won’t work. In fact you need a “%3A” not a “:” because parameters need encoding.

If you look at some of the examples…you can see how this works.

https://webhose.io/search?token=&format=json&q=thread.section_title%3A(restaurants)

Which when the parameter is decoded …

https://webhose.io/search?token=&format=json&q=thread.section_title:(restaurants)

https://webhose.io/search?token=&format=json&q=obama%20performance_score%3A%3E8

Which when the parameter is decoded …

https://webhose.io/search?token=&format=json&q=obama performance_score:>8

So your language one will be q=language%3Denglish I think.

Not meaning to scare you with the complexity, this looks perfectly doable. But you really do need to understand how REST APIs work a little to use the Connector.

So have a read around, and get ir working in POSTMAN first.

thanks @NigelG

i have started using postman these last couple of weeks, and it’s been a huge help. i’ll use it some more to get a better handle on the query parameters for this API.

also, i took a second (and third :slight_smile: ) look at your explanation above regarding overrides. i think that was the answer i was looking for. it’ just took several re-reads to get my brain around it. thanks so much for your help!

Glad you are making progress on APIs. They can be pretty complex, and everyone seems to make theirs just a little different :slight_smile:

1 Like

@NigelG Hi Nigel,

I’m new to bubble and also with limited coding knowledge.

I’ve tried to follow the steps you described in this post, but couldn’t find the place override the URL either when it’s set up to be data or action.

Can you please help me?

Regards,

Hi there, struggling with the same issue due to the fact that the setting “client safe” has been removed from the API Connector UI…Any way to achieve the same as described above?

I am making an API call to imgix using https://bubble.imgix.net/ as base…after that the link to the actual image stored on AWS should dynaically be displayed lead by “http://” …All I do not get to work is make the last part (path to the image) dynamic on API call…

Just found the answer!!
Set “Use as Action”
GET path = https://bubble.imgix.net/http:[url]
url paramer = current cells image (without anything else before)

2 Likes