Force React Native webview to ignore cached version of webview

Question

Context

A heavy HTML and JS project is currently working, which is a reaction to its own project. All HTML and JS are referenced locally (nothing more than http).

Problem

Whenever I make changes to HTML or JS, I don't see the changes (after updating my own code or just starting it again), so I have to completely remove the application.

Question

Is there a way to ignore the cached version of these files (I assume there is a caching mechanism)

I did not find any valid resource regarding this topic, so any feedback would be greatly appreciated, thanks.

Answer 1

I assume that you are using the React Native WebView component to render HTML and JavaScript. This component uses its own UIWebView and WebView components, so you can change the RN of WebView using the same procedures as for them. For example, in the case of iOS, you can do the following:

[[NSURLCache sharedURLCache] removeAllCachedResponses]; [[NSURLCache sharedURLCache] setDiskCapacity:0]; [[NSURLCache sharedURLCache] setMemoryCapacity:0]; 

You can put this code in your didFinishLaunchingWithOptions method AppDelegate.m . Based on this answer .

In the case of Android, you cannot access the cache if you do not have access to the WebView instance (as per this answer ), so you can create your own WebView using the RN WebView code in combination with the caching functionality. It is not as difficult as it may seem.

Answer 2

For android, the "Application Information" option in the "Storage" section will allow you to clear the cache. Here's how you can force reload any resources that you show in WebView.

Answer 3

For me, I used https://github.com/joeferraro/react-native-cookies and it clears cookies for me

 CookieManager .clearAll(true) .then((res) => { console.log('LoginScreen CookieManager.clearAll =>', res) })