mirror of
https://github.com/status-im/react-native-webview.git
synced 2025-02-23 17:28:37 +00:00
a6010d93e0
`onFileDownload` is called with the URL that you can use to download the file. When RNCWebView detects that the HTTP response should result in a file download, `onFileDownload` is called. The client can then provide code to download the file. RNCWebView determines that a file download should take place if either of the following is true: 1. The HTTP response contains a `Content-Disposition` header that is of type 'attachment' 2. The MIME type of the response cannot be rendered by the iOS WebView
56 lines
1.2 KiB
TypeScript
56 lines
1.2 KiB
TypeScript
import React, {Component} from 'react';
|
|
import {Alert, Platform, View} from 'react-native';
|
|
|
|
import WebView, {FileDownload} from 'react-native-webview';
|
|
|
|
const HTML = `
|
|
<!DOCTYPE html>\n
|
|
<html>
|
|
<head>
|
|
<title>Downloads</title>
|
|
<meta http-equiv="content-type" content="text/html; charset=utf-8">
|
|
<meta name="viewport" content="width=320, user-scalable=no">
|
|
<style type="text/css">
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font: 62.5% arial, sans-serif;
|
|
background: #ccc;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<a href="https://www.7-zip.org/a/7za920.zip">Example zip file download</a>
|
|
</body>
|
|
</html>
|
|
`;
|
|
|
|
type Props = {};
|
|
type State = {};
|
|
|
|
export default class Downloads extends Component<Props, State> {
|
|
state = {};
|
|
|
|
onFileDownload = ({ nativeEvent }: { nativeEvent: FileDownload } ) => {
|
|
Alert.alert("File download detected", nativeEvent.downloadUrl);
|
|
};
|
|
|
|
render() {
|
|
const platformProps = Platform.select({
|
|
ios: {
|
|
onFileDownload: this.onFileDownload,
|
|
},
|
|
});
|
|
|
|
return (
|
|
<View style={{ height: 120 }}>
|
|
<WebView
|
|
source={{html: HTML}}
|
|
automaticallyAdjustContentInsets={false}
|
|
{...platformProps}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|
|
}
|