Converting Image Selected From App To BASE64

Questions about Thunkable Web API's
1

I really want help for a project of mine i have been trying to make, so here is what i want to make

In the app when the user clicks on button and selects the image i want to convert the image to base 64

I have tried this method from the above link andd it works but i dont want to click the button from webviewer i want to select the image from my app and send it to web viewer to convert it to base 64

I would like someone to help me in this regard

2

Hello @sleepyboy170026bzpk, welcome to Thunkable! :tada:

The only way to pass the image into the web viewer is a URL, so you will need to upload the image to Cloudinary first.

Here are some examples: https://community.thunkable.com/t/upload-images-to-cloudinary-using-web-api-only/1701875/8

https://community.thunkable.com/t/solved-how-do-i-base64-encode-an-image/1858457

Be sure to check out How to ask Great Questions v2.0, the Community Guidelines, and our Getting Started Guide to make the best of your Thunkable Community experience!

3

thanks for your help, actually i was uploading the images in cloudinary itself but i dint want to use cloudinary thats why i was seeking for an alternate solution that solution being Gdrive so is there any other way without cloudinary because i do not want to do that, alslo while reading the forums i came across a post which said that using zapier or make.com we can connect Gdrive so can u guide and help me out through this

4

Hello @sleepyboy170026bzpk
As mentioned in our docs, Google Drive Image links don’t work inside the app!
Could you please share the reason you would like to stop using Cloudinary?

5

i know that google drive link don work the app so what im trying to achieve is that when i upload and image to my app by selecting the image when i click a button in the app and then the image is converted into base 64 which is then sent to my Gdrive using google script, the sending to Gdrive part i have achieved myself but converting the image selected to base 64 is something i cannot achieve the way i want to which is mentioned properly in my first message in this topic

The reason i dont want to use cloudinary is that its not that fast for me and also not very scalable in terms of storage and money.

Just one again read my first post to understand what I’m trying to achieve

Thanks
Im waiting

6

Hi @sleepyboy170026bzpk
Thank you for snaring more information.
I understand what you need to build but the solution is to use HTML code to do this.
It is not exactly what you need but just as an example here is a new module that converts the image from camera to base64: https://community.thunkable.com/t/capture-images-to-base64-with-camera-on-web-now-possible-via-module/3751343

7

Hi @ioannis
The solution which u have given is really great but when i use it

  1. It takes very long to convert the base 64 image
  2. It almost crashes the app when testing it with live in the phone “Thunakble Live isn’t responding” andd when i select wait option in the popup on my phone then after 5 seconds or so the base 64 comes on the label
  3. As i said its a wonderful project but this project Thunkable
    and the one which u shared in the above post are not very diff

Once again ill just clarify what i want to achieve
i want to select the image from within the app that is i want to click the button added by me in the app andd then that button sends the image to the webviewer but the above projects have it in such a manner where the button is already present in html code and take the image from there
or
If you know any way to connect sent the files through zapier or make.com using the webviewer html code, please do help me with that

Thanks for your efforts and cooperation
If you have any other solutions do let me know.

8

Hi @ioannis
Any updates…

9

Hi @sleepyboy170026bzpk
Thanks for your feedback but building this for you is going beyond our available scope of support.
If you share specific blocks and HTML code anyone in the community could help you.

10

@ioannis
Thanks for your support just one last help does anyone in the commmunity know any way to link up zapier and Gdrive using the webviewer component

11

You don’t need to link web viewer directly with these tools. You can use the message received from Web Viewer component and send it to these tools using Web API blocks.

12

yes @ioannis i certainly know that i have to do that, i just need a guide or an example project done by anyone from the community or some valuable insight on how to atleast start with it

13

For anyone facing the same challenge here is a reference model of uploading images to Gdrive without converting to base 64 but in mit app inventor u can do the same in thukable and achieve the same result i think so

1 Like