Working with the Web component


#1

This brief article explains how to use the Web component to download files from the internet.

Using the attached sample app you can download the icon of the [Thunkable Extension Directory]
(http://domhnallohanlon.com/thunkable_extensions/). The app checks to see whether or not a file name is specified, and reacts accordingly. Please note that if you are going to give your user the ability to choose the file name themselves, the file type must be specified.

Design

In the Design View make sure that the Save Response is set to true (checked). You can also specify a Url if you wish. Both of these can also be done programatically through the blocks editor if you prefer.

Code

This first bit of code waits for the button to be pressed before trying to download the image. The IF block makes sure that a File name has been specified. If no file name is specified then a default name will be automatically generated. The progress dialog is used here to improve UX.

Once we have received a response back from the servers, the progress dialog is dismissed, all of the event variables are displayed in the label and the file that we have downloaded is displayed in Image1.

Here’s a quick overview of the variables that this event creates:

url This is the exact same as the Web1.Url property. It’s the URL or web address where the file was downloaded from.

responseCode This variable returns the HTTP response status code that indicates the status of the response, i.e was the request successful, or did it fail. Codes in the 200s are successful responses, for example 200 mean “ok” and 202 means “accepted”, whereas codes in the 400s are client errors. For example a 403 means “forbidden” and 404 means “not found”.

responseType This variable returns the MIME type of the file that has been downloaded. For example, text, audio, image etc.

fileName Unless you specify a file name then a randomly generated file name will be used by default.

Source Code

You can try this demo for yourself by downloading the attached .aia file.

download.aia (2.5 KB)

References

Read through the documentation of the Connectivity Components for more information.
https://thunkable.com/reference/components/connectivity_components.html

Thanks!

If you found this article useful don’t forget to hit the like button below :heart: or you can follow me on Twitter!


[Free] Extended Web Viewer Extension
How to download files from WebViewer site
Can I download in-app
Download Direct Links Won't Work!
Built App Downloader
Webviewer (downlaods not working)
Downloading files with the WebViewer
Webview error and Extended webview error
#2