🟨 WebViewExtra - Upload/Download Files with webviewer (and much more...)

Extensions
, , , ,
187

I am building a File Compressor App using Kodular and the WebViewExtra extension.

​My App's Logic:

  1. ​The user selects a file (Image, PDF, etc.) inside my HTML interface.
  2. ​The JavaScript compresses the file in the browser's memory and creates a blob: URL.
  3. ​I need to download this compressed result to the phone's storage (e.g., if I compress a PDF, it should save as .pdf; if an image, as .jpg).

​The Problem:

My HTML triggers the download using a blob: URL. Since this file doesn't exist on a server (it's only in RAM), the standard download fails.

​My Request:

Could someone please share a screenshot of the Blocks?

I need to see exactly how to set up the DownloadNeeded event in WebViewExtra to:

  1. ​Intercept the blob: URL.
  2. ​Save it to the Downloads folder with the correct extension (PDF, JPG, ZIP, etc.).

​I would really appreciate a screenshot of the blocks to see how to wire up the url, mimetype, and contentDisposition correctly
Screenshot_2026-01-17-06-57-45-755_com.android.chrome

188

blobs can only be downloaded to the Download directory (now fixed in V2.3)

To get the file, the html has to be on a server - somewhere (although in more recent testing, things did appeaar to be working correctly for a local (in assets) html file on companion)

I used my text-doc-saf extension to read the file, the download happens "outside" the app so the app does not have any rights to view the file, unless you use saf. media files may behave differently.

html:

<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href="https://www.w3schools.com/w3css/5/w3.css" rel="stylesheet">

<title>Demo Blob Download</title>
<style>
</style>


<body class="w3-content w3-padding-large">

<script>
const data = "Hello, world!";  
const blob = new Blob([data], { type: "text/plain" });

const blobUrl = URL.createObjectURL(blob);

const link = document.createElement("a");
link.href = blobUrl;
link.innerHTML = "Download Blob";
link.download = "downloaded-blob.txt";
document.body.appendChild(link);


</script>
</body>
</html>

blocks (6)
blocks (6)581×684 58.6 KB

getBlob.aia (43.8 KB)

image
image1045×1423 43.5 KB

If localhost is used (assets) for the same html file, it fetches the text directly to the browser. Not sure how this would work with other file formats.

image

image
image1052×1281 32.3 KB

189

UPDATE V2.3 and V2.31

  1. In this update it is now possible to download bloburls to Download, Documents or ASD.
  2. V2.31 removes camera and microphone permissions settings, for those that do not require it.
1 Like