How to disable cache on chrome for Android?

Question

How to disable cache on chrome for Android ?

I change my page content, and refresh the page, but the content still is old.

I have set the nginx config like below, but it has no effect.

#disable cache
add_header Cache-Control "no-cache, no-store, must-revalidate";
add_header Pragma no-cache;
add_header Expires 0;

Is there a way to get my newest page without manually clear cache again and again?

Answer 1

This may not be the easiest way, but it will 100% work and should be part of your development setup anyway.

Using Google Chromes web tools on Windows or Mac will allow you to do " remote debugging ".

1. Enable remote debugging on Android device through Developer Menu in settings.
2. Connect phone to PC using USB
3. Open Google Chrome and access the developer console (F12)
4. Click on the three dots (top right) > more tools > Remote devices.
5. Scroll down to select your mobile device, at this stage you should see all chrome instances open on your phone. Select the instance you wish to "force reload and disable cache" by pressing Inspect
6. Another screen should appear allowing you to access the network tab and select "Disable Cache"

Answer 2

Currently there is no way to disable cache on chrome for Android but it is possible to clear the cache.

UPDATE: As of now there is a way to disable cache with requires your phone to be connected and needs remote debugging, please refer to Dean Meehan's answer for more info
Follow these steps to clear the cache.

http://www.refreshyourcache.com/en/chrome-android/

1. Click on the menu button (three dots in the topright corner).
2. Click on Settings in the menu.
3. Click on Privacy in the menu.
4. Click on Clear browsing data... at the bottom.
5. Select Empty the cache from the list.
6. Confirm clear browsing data.

Answer 3

I know the question is asking about disabling cache on chrome for Android, but this may help people looking for a solution to mobile development.

To see changes on your website with your Android device use the New incognito tab in chrome web menu.

1. Click top right drop down menu in chrome browser
2. Click "New incognito tab"
3. Navigate to your website and see all your most recent changes.

IMPORTANT: To see new changes after viewing with incognito, you must close the incognito mode completely and reopen due to the current tab also caching.

Answer 4

To disable the cache first you'll have to disable scripts / css caching on the ones you are editing.

In order to do that, add a timestamp to your file inclusions :

<link rel='stylesheet' href='/static/css/main.css?t={{ts}}'/>
<script type='text/javascript' src='/static/scripts/main.js?t={{ts}}'></script>

{{ts}} being a timestamp (I'm using jinja templating).

Then if you edit your html page, you could change the request adding a random parameter to it as such :

test 1 : mywebsite.com/this_page

test 2 : mywebsite.com/this_page/?i=1

test 3 : mywebsite.com/this_page/?i=2

...

It's more a hack than a real solution, but chrome kindly ignores the cache-control meta, so there aren't lots of clean way to do it.

Answer 5

The following bash script will rename

<script src="path/to/app.js"></script>

to

<script src="path/to/app.js?t=18:15:45></script>

in an index.html file, which will prevent mobile caching.

#!/bin/bash

time=$(date +"%T")
sed -i "s/app.js/app.js?t=${time}/" ./path/to/index.html

Answer 6

Download this app : App Cache Cleaner

1. Open the app
2. Go to the app settings via the '3 dotted' button

screenshot

3. Tick mark the option to show widgets and the rest is upto you

You may as well disable Chrome's Data Compression policy and preloading of pages.

As of now, there are no 'disable cache' option in chrome

screenshot2

PS:i cud not show pictures because of my low rep, help me increase that too ;p