POST to API and show results for uploaded image

Need help APIs
1

So I’ve got an uploader on my page, and I’ve separately set up a call to an image recognition API in the standard Bubble API connector, but I’m struggling to join the two together in the Workflow.

Does anyone have any thoughts as to how I can dynamically POST off the URL of the content that’s been uploaded, and print the results that come back in the response in a text box underneath?

For reference here’s my API call. It works and comes back with data, but I don’t think I’ve set this up correctly to bring back a dynamic image that’s uploaded on my page.

Any thoughts would be greatly appreciated!

45
451312×950 108 KB

2

Attached the API response I receive, for reference, and I’m looking for the first web_entities_annotation value.

[
{
    "google-vision": {
        "candidates": [
            [
                {
                    "confidence": 0.9864287972450256,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "car"
                    }
                },
                {
                    "confidence": 0.981010913848877,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "land vehicle"
                    }
                },
                {
                    "confidence": 0.9527800679206848,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "vehicle"
                    }
                },
                {
                    "confidence": 0.9347805380821228,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "sports car"
                    }
                },
                {
                    "confidence": 0.8704596757888794,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "automotive design"
                    }
                },
                {
                    "confidence": 0.8630114793777466,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "motor vehicle"
                    }
                },
                {
                    "confidence": 0.7869872450828552,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "porsche 911 gt2"
                    }
                },
                {
                    "confidence": 0.7820715308189392,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "supercar"
                    }
                },
                {
                    "confidence": 0.7682875394821167,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "performance car"
                    }
                },
                {
                    "confidence": 0.7362502813339233,
                    "prediction": {
                        "type": "label_annotation",
                        "value": "luxury vehicle"
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 170,
                            "green": 117,
                            "red": 35,
                            "rgb": "35, 117, 170"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 78,
                            "green": 55,
                            "red": 35,
                            "rgb": "35, 55, 78"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 91,
                            "green": 158,
                            "red": 169,
                            "rgb": "169, 158, 91"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 143,
                            "green": 94,
                            "red": 27,
                            "rgb": "27, 94, 143"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 171,
                            "green": 128,
                            "red": 36,
                            "rgb": "36, 128, 171"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 211,
                            "green": 169,
                            "red": 52,
                            "rgb": "52, 169, 211"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 157,
                            "green": 131,
                            "red": 60,
                            "rgb": "60, 131, 157"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 186,
                            "green": 164,
                            "red": 100,
                            "rgb": "100, 164, 186"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 185,
                            "green": 158,
                            "red": 132,
                            "rgb": "132, 158, 185"
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "image_property_annotation",
                        "value": {
                            "blue": 112,
                            "green": 84,
                            "red": 57,
                            "rgb": "57, 84, 112"
                        }
                    }
                },
                {
                    "confidence": 1.2119250297546387,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "Porsche 911 GT2"
                    }
                },
                {
                    "confidence": 1.063349962234497,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "Porsche"
                    }
                },
                {
                    "confidence": 1.0506000518798828,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "Car"
                    }
                },
                {
                    "confidence": 0.8941349983215332,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "Porsche 911 GT3"
                    }
                },
                {
                    "confidence": 0.7191800475120544,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "2018 Porsche 911 GT2 RS"
                    }
                },
                {
                    "confidence": 0.7024999856948853,
                    "prediction": {
                        "type": "web_entities_annotation",
                        "value": "gt 2"
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "safe_search_annotation",
                        "value": {
                            "name": "adult",
                            "value": 0.2
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "safe_search_annotation",
                        "value": {
                            "name": "spoof",
                            "value": 0.2
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "safe_search_annotation",
                        "value": {
                            "name": "medical",
                            "value": 0.2
                        }
                    }
                },
                {
                    "confidence": 1,
                    "prediction": {
                        "type": "safe_search_annotation",
                        "value": {
                            "name": "violence",
                            "value": 0.2
                        }
                    }
                }
            ]
        ],
        "predictions": []
    }
},
{
    "duration": "0:00:02.467440"
}
]
3

One option would be like this:

Once you’ve setup the API, use it in a workflow, then take the “result from Step X” where step X is a previous step that called the API. That will allow you to use a “Create a thing” action with the results.

Then you could display that record’s field(s) in text, repeating group, etc. on the “Design” view.