How do I get the browser to use the cache instead of reloading from the server?

Question

I have a search results page, when a user clicks on a result, then clicks the back button I want it to load the search results from the cache instead of going to the server, kind of like how google does it. I'm sending the HTTP headers:

Date: Thu, 23 Jun 2016 18:53:05 GMT
Server: WSGIServer/0.1 Python/2.7.9
Vary: Cookie
Last-Modified: Wed, 22 Jun 2016 00:00:00 GMT
ETag: a
Cache-Control: public, max-age=300
X-Frame-Options: SAMEORIGIN
Content-Type: text/html; charset=utf-8

But when I navigate back to the results using the back button it retrieves the page from the server, which in this case is a development Django server running on my laptop.

Answer 1

Have you tried .htaccess? Setting Expires and Cache-Control in your .htaccess may solve this. Expiries:

<ifModule mod_expires.c>
 ExpiresActive On
 ExpiresDefault "access plus 5 seconds"
 ExpiresByType image/x-icon "access plus 2592000 seconds"
 ExpiresByType image/jpeg "access plus 2592000 seconds"
 ExpiresByType image/png "access plus 2592000 seconds"
 ExpiresByType image/gif "access plus 2592000 seconds"
 ExpiresByType application/x-shockwave-flash "access plus 2592000 seconds"
 ExpiresByType text/css "access plus 604800 seconds"
 ExpiresByType text/javascript "access plus 216000 seconds"
 ExpiresByType application/javascript "access plus 216000 seconds"
 ExpiresByType application/x-javascript "access plus 216000 seconds"
 ExpiresByType text/html "access plus 600 seconds"
 ExpiresByType application/xhtml+xml "access plus 600 seconds"
</ifModule>

And Cache-Control:

<ifModule mod_headers.c>
  <filesMatch "\.(ico|jpe?g|png|gif|swf)$">
    Header set Cache-Control "public"
  </filesMatch>
  <filesMatch "\.(css)$">
    Header set Cache-Control "public"
  </filesMatch>
  <filesMatch "\.(js)$">
    Header set Cache-Control "private"
  </filesMatch>
  <filesMatch "\.(x?html?|php)$">
    Header set Cache-Control "private, must-revalidate"
  </filesMatch>
</ifModule>