Offline webview(cache) support

[RasAlGhul1]

Is there anyway to show the cached version when there is no internet? At the moment it shows only an error that there is no internet.

      <WebView
        cacheMode="LOAD_CACHE_ELSE_NETWORK"
        cacheEnabled
        sharedCookiesEnabled={true}
        startInLoadingState
        onError={() => console.warn("error")}
        source={{
                uri: "http://google.nl",
              }
        }
      />

[liudmyla-schastlyvets]

Any updates here?

[RasAlGhul1]

No, sounds like no one has done this yet?

[github-actions]

Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like still searching for solutions and if you found one, please open a pull request! You have 7 days until this gets closed automatically

[liudmyla-schastlyvets]

@RasAlGhul1, how did you solve the problem?

[cernadasjuan]

It may be very useful

[Chasty]

I need offline support for WebView, still no answers??

[wflanagan]

Hello all,

So, this problem is something that’s been plaguing us for more than a year now.

The case for this to be reopened, and fixed, is this: When a person is using your app on Wifi, and they then switch to their phone’s internet (everyone’s phone does this several times a day), the applications built on this tech momentarily “error.” Our customers see this, and complain about it.

Yes, when the connection is re-established, the app will reload. And, yes, we’ve implemented custom logic that will show a nicer error than the one that shows by default. BUT, why show the error at all if the page can simply continue to be shown, or be reloaded from the cache?

[ajaxsys]

I think we can open a local default web page ( cached local ) when offline, instead page like this:

[Nico-T-Ihle]

Hey if you want to show your own custom error srceen try this:

1. First install react-native-community/netinfo
2. dont forget if your on mac go to your /ios and do pod install
3. Then import {useNetInfo} from "@react-native-community/netinfo"; in your Project

if you did this remove your return and use this instead for reandering your content

if(netInfo.isConnected != false) { console.log("y wifi")
console.log("y wifi") return ( <WebView source={ YOUR URL } ) }
else if(netInfo.isConnected != true)
{ console.log("n wifi"); return( <WebView source={ YOUR CUSTOM HTML } scalesPageToFit={true} /> ) }

notice you can use HTML In webview https://reactnative.dev/docs/0.63/webview

you just check if you have a connection if yes then show your site and if you no connectio then your your custom html site .

hope i could help somebody