# \[Solved\] Setting Image picture to a png retrieved from QR Code api **URL:** \ **Category:** Questions about Thunkable X\ **Tags:** solved, image, qrcode, webapi\ **Created:** [January 8, 2021, 4:20pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379 "2021-01-08T16:20:19Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 4:20pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/1 "2021-01-08T16:20:19Z")
in my app, i was tooling with a system to get a qr code from an api. issue is, setting the _set image 1 to_ block seems to just crash or bug out whenever i try to set it as the _response_ from the api. As far as i know, its not being returned in json format or anything like that. any ideas? i tried using the qr and setting it as the value on the _set cell_ block, but no dice, airtable returns an “invalid attachment” response. didn’t know if anyone had tried this before link to the API: [QR code API](http://goqr.me/api/) ---
**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\ **Post date:** [January 8, 2021, 4:34pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/2 "2021-01-08T16:34:44Z")
First I would recommend you find out what is in the response. the easiest way is to send the unaltered response to a label or text\_input. Is it sending HTML? URL? JSON? It would surprise me if it were sending the actual image. Could you show your blocks and the results of this test? ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 5:37pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/3 "2021-01-08T17:37:28Z")
The sample url [http://api.qrserver.com/v1/create-qr-code/?data=HelloWorld!&size=100x100](http://api.qrserver.com/v1/create-qr-code/?data=HelloWorld!&size=100x100) returns a QR code but not in a formatted way (e.g. JSON). So I don’t think you can use that API with Thunkable. There’s not a way to “grab” the image… you really need a text response, ideally JSON, where you can parse out the filename that ends in .png. The documentation does indicate that you can specify the output format as JSON _when reading a QR code_ but it doesn’t seem to offer that option when _creating a QR code_. A quick Google search did not turn up any QR code generator APIs that return JSON. Well, I did find one (Mussa Studios listed on [this page](https://blog.api.rakuten.net/top-qr-code-apis/)) but it was not secure so I didn’t look at it. ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/9/4/949848cdb6bdadd6fb659a66c69f68d8d18ec668.png) ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 5:49pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/4 "2021-01-08T17:49:29Z")
That’s what I thought, I’ll have to do this manually, or until they add this feature. I just thought I was doing something wrong because it allowed me to put the _response_ onto the _set imagine to_ block ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 5:50pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/5 "2021-01-08T17:50:47Z")
Thunkable doesn’t do a ton of error checking when placing blocks in the editor. It does some. One option would be to simply create the url you want for the API and then use a web viewer to display the QR code in Thunkable. It’s a little messy, perhaps, but it could work. ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 6:02pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/6 "2021-01-08T18:02:16Z")
The idea is that they sign up, it makes a qr from the vin, and displays it on their screen ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 6:16pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/7 "2021-01-08T18:16:45Z")
Well, it’s possible with a webviewer. Here’s a demo: [https://x.thunkable.com/copy/f6089e61df8155e6c2beb8b6462d1de3](https://x.thunkable.com/copy/f6089e61df8155e6c2beb8b6462d1de3) **Edit:** new version without webviewer: [https://x.thunkable.com/copy/c67e9de0c06a1eb9feaa1635a77197ef](https://x.thunkable.com/copy/c67e9de0c06a1eb9feaa1635a77197ef) ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/6/4/64a66194e4b5754412db5d35a9a3183302631032.png) Also a web app version: [thunkablecompanion](https://thunkable.site/web-build/index.html?webAppId=JXWKXzJ9f) ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 6:23pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/8 "2021-01-08T18:23:58Z")
Oh, no, I know that part, but I don’t think I can automate it’s creation and saving to airtable with thunkable The only thing I found a lead with was somehow converting. The image to base 64. But I don’t think I can do that for what I’m doing here ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 6:29pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/10 "2021-01-08T18:29:27Z")
So you’re wanting to store the image of the QR code in Airtable? Nope, I don’t think you can do that. It would be a pain to make the user do all this but you could generate the QR code on their device using the webviewer method above and then ask them to take a screenshot and tap a button in your app to upload the screenshot to Airtable from their photo album. Again, messy! > [@bluerfox15uht9](#): > > The only thing I found a lead with was somehow converting. The image to base 64. But I don’t think I can do that for what I’m doing here But again, you don’t actually have the image. It’s not a block value in Thunkable that you can manipulate. All you have is a web url. That’s not going to allow you to access the image that’s generated. ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 6:29pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/11 "2021-01-08T18:29:28Z")
Oh, shoot! I tried with web viewer and it just rendered x blank screen!! This might work, they’ll just have to either save their png or screen shot it… For now… ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 6:30pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/12 "2021-01-08T18:30:04Z")
Did you see the screenshot I posted above, with the demo link? Does that not work for you? **I also updated the project link.** ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 6:41pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/13 "2021-01-08T18:41:53Z")
I’ll try it in a bit! I’m actually at work 🤣 I’ll do some fiddling on my break, thanks man. ---
**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\ **Post date:** [January 8, 2021, 6:47pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/14 "2021-01-08T18:47:07Z")
> [@tatiang](#): > > [http://api.qrserver.com/v1/create-qr-code/?data=HelloWorld!&size=100x100](http://api.qrserver.com/v1/create-qr-code/?data=HelloWorld!&size=100x100) I had a thought. I bet there’s a way to extract an image from a url using an API. And you know what? There is! I don’t have it working yet but how sweet would that be if you could generate a url from the VIN # and then extract the QR code image with an API and have the png filename/url for use in your app? I think it’s possible now. This looks promising: [AI Platform | DataRobot](https://algorithmia.com/algorithms/util/SmartImageDownloader) although it doesn’t appear to be free. I tried this one for a bit, too, but couldn’t quite get the API call to work: [https://urlmeta.org](https://urlmeta.org) ---
**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\ **Post date:** [January 8, 2021, 7:39pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/15 "2021-01-08T19:39:56Z")
I think we are thinking a bit too hard about this problem. I was surprised that the API is returning an actual image. Since that is the case you can display the image thus ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/a/6/a6ec0f7dd07eb855e8c2aa293a8500dce572099c.png) I haven’t worked with cloudinary (media DB) in a while, bit I THINK you can pass it the URL as a target ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 8:07pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/16 "2021-01-08T20:07:43Z")
It was just returning a png, but I can’t use it for anything, I can’t set an image to it, I can’t put it into firebase in an “attachment” collum, nothing. It’s a pain in the butt, because it just crashed when you try ---
**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\ **Post date:** [January 8, 2021, 8:11pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/17 "2021-01-08T20:11:08Z")
The blocks above work for me. ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 8:21pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/18 "2021-01-08T20:21:49Z")
You can set an image to the qr code png? ---
**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\ **Post date:** [January 8, 2021, 8:35pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/19 "2021-01-08T20:35:07Z")
![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/f/b/fb567e4e871dbba1add1e26efddd416e18625638.png) ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/5/b/5b82f4fd3606a24b55810fdc04e689eb4ec1c948.png) ---
**Author:** ![bluerfox15uht9](https://avatars.discourse-cdn.com/v4/letter/b/3be4f8/32.png) [@bluerfox15uht9](https://community.thunkable.com/u/bluerfox15uht9)\ **Post date:** [January 8, 2021, 10:35pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/20 "2021-01-08T22:35:48Z")
Ohh, okay, so instead of using an API block, use the text itself? Although, I’m not familiar with the “busy” block 🤔 Did you make a function? ---
**Author:** ![drted](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/drted/32/92694_2.png) [@drted](https://community.thunkable.com/u/drted)\ **Post date:** [January 8, 2021, 10:37pm UTC](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379/21 "2021-01-08T22:37:25Z")
Ignore busy and ready (custom functions). Sorry about that. [Next page](https://community.thunkable.com/t/solved-setting-image-picture-to-a-png-retrieved-from-qr-code-api/1042379.md?page=2)