Hi am trying to load html file in Download folder to render in my React Native application.

   <WebView
      originWhitelist={['*']}
      scrollEnabled={false}
      source={{
              uri: 'file:///storage/emulated/0/Documents/Test.html',
              baseUrl: '',
        }}
      style={{flex: 1}}
      allowFileAccess={true}
      allowUniversalAccessFromFileURLs={true}
      onLoadEnd={updateSource}
      onError={error => console.log('Error', error)}
    />

The above is what I have tried and failed. The above code ends up in showing a white blank page.

Any help is appreciated Thanks

Hi am trying to load html file in Download folder to render in my React Native application.

   <WebView
      originWhitelist={['*']}
      scrollEnabled={false}
      source={{
              uri: 'file:///storage/emulated/0/Documents/Test.html',
              baseUrl: '',
        }}
      style={{flex: 1}}
      allowFileAccess={true}
      allowUniversalAccessFromFileURLs={true}
      onLoadEnd={updateSource}
      onError={error => console.log('Error', error)}
    />

The above is what I have tried and failed. The above code ends up in showing a white blank page.

Any help is appreciated Thanks

• react-native
• react-native-webview

1 Answer 1

Please ensure that the path to your file is correct. It is also not completely clear if you have already handled read permissions in your app.

If you haven't, you need to also first grant them e.g., by using PermissionsAndroid.

You have also hardcoded the path to your file, which is probably problematic. A rather simpler way to manage your local file paths (for both iOS and Android) is by using react-native-fs.