Webapp Image input -> workflow -> webapp image output

Hi I am trying to get an image input in webapp and use python in workflow to transform it and send back to webapp for display. I am running into 2 problems:

  1. Every time I run the code block with python it show NonType with startTrigger.data as input
  2. I am not certain how to accept the image response on the webapp side for the result

Hello @dogmomdiana!

I think we can find a work around to get an image from an input component and be able to transform/display it in the webapp.

A workflow is not a bad idea as python has a ton of useful libraries for file manipulation, but the webapp won't be able to receive this data directly. If we did plan on using a workflow we would have to upload the image/data to a database, which we could then query from a webapp.

What kind of data transformation are you looking to acomplish?

If you are using a File Input component, you can get the base64 string from the component and pass it into an Image component with the following set up.

As fileInput1 is the component I used to upload an image to a webapp, then .value holds an array of object, with each object being a file that has been uploaded. So I use zero to key into this array at the first index, since I only have one file.

Now that I am accessing the image file's object, I can use its .base64Data property to grab a string of the image's data which can be turned into an image and displayed by the Image component when it is set to URL as the source option :+1: