download files with webview expo

I have questions about the documentation of the expo in the implementation of a webview in the standalone application, due to the amount of dynamic graphics I have on a page, I chose not to make a native version, but to render that page in my application through a webview, until then okay, but on the page there is the option to download a zip file of the documents referring to the graphics of the page, but just like in the native android, clicking the download button nothing happens, in the android studio the solution is to implement the mWebView.setDownloadListener (), so I’d like to know what and how can I use the equivalent with expo in a webview of a stand-alone application to perform downloads on web pages in my application?

thaks my friends

It would take a bit of creativity, but I would think it’d be possible to inject some code into the webview that would override the download buttons such that, instead of trying to download the file directly, they would send the file URL over to the React Native side so it could download the file using Expo.FileSystem.downloadAsync().

In short, the JS inside the webview can call a window.postMessage() function that will call back to the onMessage prop, if it exists.

In general, it’d be something like:

<WebView
            source={source}
            injectedJavaScript={codeThatForwardsOnClickToReactNative}
            onMessage={message => { /* download file from URL in message.url */}}
          />

And codeThatForwardsOnClickToReactNative would look something like:

// grab download URL somehow (e.g., read href of node)
// override onClick event handler with:
function() {
    var payload = { url: downloadUrl };
    window.postMessage(JSON.stringify(payload));
  }

1 Like

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.