HTTPレスポンスヘッダとブラウザキャッシュの関係を調査

1. はじめに
2. 使用したツール
- Webサーバー側
- クライアント側
3. 使用する HTML (PHP) ファイル
4. 実験
5. まとめ
6. 参考

1. はじめに

Webサーバーからブラウザに返される HTTP レスポンスヘッダにいろいろな値をセットし、次回のアクセス時にブラウザがキャッシュを使うのかどうかを観察してみました。

今回、HTTP レスポンスヘッダの生成には PHP を使っており、PHP に特有の機能も試しています。

スポンサードリンク

2. 使用したツール

Webサーバー側

PHP

HTTP レスポンスヘッダを操作するために使いました。
公式サイト： PHP: Hypertext Preprocessor

クライアント側

Firefox

OWASP ZAP をローカルプロキシとして使用するよう設定しました。
HTTP のヘッダは、Firefox に標準搭載されている機能でも見ることができますが、条件付きリクエストの場合の表示が分かりにくかったため、外部のローカルプロキシツールを使うことにしました。
今回たくさんのパターンを試しましたが、1つのパターンをテストする毎に、Firefox の履歴データを全て削除しました。
公式サイト： Firefox

OWASP ZAP

ヘッダを見るために使いました。
公式サイト： OWASP ZAP

3. 使用する HTML (PHP) ファイル

Webサーバ側に以下のPHPファイルを用意し、ウェブブラウザはこのファイルにアクセスします。

<?php
  // ここにヘッダを出力するコードを書く。
?>
<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge" >
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>キャッシュのテスト</title>
</head>

<body>
  <h1>キャッシュのテスト</h1>

  <p>時間: <?php echo time(); ?></p>

  <a href="/cache-test/">このページへのリンクです。</a>

</body>
</html>

キャッシュが使用されたかどうか、画面を見れば分かるように、その時の時間を出力しています。
キャッシュが使われるかどうかを確かめるために、2回目のアクセスを行う方法として画面をリロード ( F5 や Ctrl + R などのキーボードショートカットキーでも可) してしまいがちですが、一般的なブラウザはリロードするとキャッシュを使わないようになっているため、画面上に同じページへのリンクを用意して、そこをクリックして 2回目のアクセスを行います。これであれば、ブラウザはリロードのために特別な動作は行わず、キャッシュが使えるなら使ってくれます。

4. 実験

パターン1

HTML (PHP)のヘッダ出力部分

特別なヘッダは何も出力しない。

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:08:49 GMT
Server: Apache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:12:05 GMT
Server: Apache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。

パターン2

HTML (PHP)のヘッダ出力部分

session_cache_limiter('nocache');

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:13:01 GMT
Server: Apache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:13:23 GMT
Server: Apache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。
- session_cache_limiter() は session_start() と合わせて使わないと意味がないので、パターン1と同じ動作になる。

パターン3

HTML (PHP)のヘッダ出力部分

session_cache_limiter('nocache');
session_start();

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:14:21 GMT
Server: Apache
Set-Cookie: PHPSESSID=q91oh00v6kvh8lo1jg36ltkul1; path=/
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, must-revalidate
Pragma: no-cache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Cookie: PHPSESSID=q91oh00v6kvh8lo1jg36ltkul1
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Thu, 29 Jun 2017 01:15:01 GMT
Server: Apache
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, must-revalidate
Pragma: no-cache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。
そもそもキャッシュされていないはず（no-store が指定されているので）。

パターン4

HTML (PHP)のヘッダ出力部分

session_cache_limiter('private');
session_start();

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:28:35 GMT
Server: Apache
Set-Cookie: PHPSESSID=vl3k9nvtk22gd2dtvd1kb0h6g1; path=/
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: private, max-age=10800
Last-Modified: Wed, 28 Jun 2017 07:07:11 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

リクエストが発生しない。

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。
- ブラウザは Expires より max-age を優先してくれるようだ。

パターン5

HTML (PHP)のヘッダ出力部分

header("Cache-Control: no-cache");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // 過去の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:45:54 GMT
Server: Apache
Cache-Control: no-cache
Expires: Sat, 26 Jul 1997 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:47:06 GMT
Server: Apache
Cache-Control: no-cache
Expires: Sat, 26 Jul 1997 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。

パターン6

HTML (PHP)のヘッダ出力部分

header("Cache-Control: no-cache");
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // 過去の日時
session_start();

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:48:27 GMT
Server: Apache
Cache-Control: no-store, no-cache, must-revalidate
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Set-Cookie: PHPSESSID=h56trk1v4trp1th5mmnvlsbhh1; path=/
Pragma: no-cache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Cookie: PHPSESSID=h56trk1v4trp1th5mmnvlsbhh1
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:49:49 GMT
Server: Apache
Cache-Control: no-store, no-cache, must-revalidate
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Pragma: no-cache
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。

パターン7

HTML (PHP)のヘッダ出力部分

header("Cache-Control: no-cache");
header("Expires: Sat, 14 Oct 2020 05:00:00 GMT"); // 未来の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:51:13 GMT
Server: Apache
Cache-Control: no-cache
Expires: Sat, 14 Oct 2017 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:51:52 GMT
Server: Apache
Cache-Control: no-cache
Expires: Sat, 14 Oct 2017 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザはキャッシュを使わない。
- Expires は無視された。
- Cache-Control: no-cache があるから？

パターン8

HTML (PHP)のヘッダ出力部分

header("Expires: Sat, 14 Oct 2020 05:00:00 GMT"); // 未来の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:54:33 GMT
Server: Apache
Expires: Sat, 14 Oct 2017 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。
- Expires が効いているようだ。
- Cache-Control: no-cache がなければ、Expires を尊重してくれるようだ。

パターン9

HTML (PHP)のヘッダ出力部分

header("Cache-Control: max-age=7776000");
header("Expires: Sat, 14 Oct 2020 05:00:00 GMT"); // 未来の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 07:57:17 GMT
Server: Apache
Cache-Control: max-age=7776000
Expires: Sat, 14 Oct 2017 05:00:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。
- Expires もあるし、Cache-Control: max-age=7776000 もあるので、ブラウザはキャッシュを使ってくれた。

パターン10

HTML (PHP)のヘッダ出力部分

session_cache_limiter('public');
session_start();

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 08:15:22 GMT
Server: Apache
Set-Cookie: PHPSESSID=ars31rm7g771kjshncqptgo7e0; path=/
Expires: Wed, 28 Jun 2017 11:15:22 GMT
Cache-Control: public, max-age=10800          <-- 3時間
Last-Modified: Wed, 28 Jun 2017 08:14:02 GMT  <-- レスポンスが返ってきた時間
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。
- Expires と max-age が効いているようだ。

パターン11

HTML (PHP)のヘッダ出力部分

session_cache_limiter('private_no_expire');
session_start();

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 08:18:14 GMT
Server: Apache
Set-Cookie: PHPSESSID=tgo9oas9egpnv0uqmc984u6bm7; path=/
Cache-Control: private, max-age=10800          <-- 3時間
Last-Modified: Wed, 28 Jun 2017 08:18:02 GMT   <-- レスポンスが返ってきた時間
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。
- max-age が効いているようだ。

パターン12

HTML (PHP)のヘッダ出力部分

header("Cache-Control: public, max-age=0");
header("Last-Modified: Mon, 03 Jan 2011 17:45:57 GMT");  // 過去の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:14:57 GMT
Server: Apache
Cache-Control: public, max-age=0
Last-Modified: Mon, 03 Jan 2011 17:45:57 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
If-Modified-Since: Mon, 03 Jan 2011 17:45:57 GMT
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:16:10 GMT
Server: Apache
Cache-Control: public, max-age=0
Last-Modified: Mon, 03 Jan 2011 17:45:57 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザのキャッシュは使用されない。
- If-Modified-Since がリクエスト（条件付きリクエスト）されるが、サーバー側で 304 ステータスを返すような処理はないので、用意されたコンテンツが 200ステータスで返される。

パターン13

HTML (PHP)のヘッダ出力部分

header("Cache-Control: public, max-age=172800");
header("Last-Modified: Fri, 30 Jun 2017 09:14:00 GMT");  // 未来の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:22:34 GMT
Server: Apache
Cache-Control: public, max-age=172800
Last-Modified: Fri, 30 Jun 2017 09:14:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されない。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。

パターン14

HTML (PHP)のヘッダ出力部分

header("Cache-Control: public, max-age=172800");
header('ETag: "12345678"');

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:30:25 GMT
Server: Apache
Cache-Control: public, max-age=172800
ETag: "12345678"
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

なし

HTTP レスポンスヘッダ

なし

画面の時間表示

更新されなかった。

キャッシュが使われたか？

ブラウザのキャッシュが使用された。

パターン15

HTML (PHP)のヘッダ出力部分

header("Cache-Control: public, max-age=0");
header('ETag: "12345678"');

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:32:32 GMT
Server: Apache
Cache-Control: public, max-age=0
ETag: "12345678"
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
If-None-Match: "12345678"
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 09:33:00 GMT
Server: Apache
Cache-Control: public, max-age=0
ETag: "12345678"
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザのキャッシュは使用されない。
- If-None-Match がリクエストされるが（条件付きリクエスト）、サーバー側で 304 ステータスを返すような処理はないので、用意されたコンテンツが 200ステータスで返される。

パターン16

HTML (PHP)のヘッダ出力部分

header("Last-Modified: Fri, 30 Jun 2017 09:14:00 GMT");  // 未来の日時

1回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Connection: keep-alive
Upgrade-Insecure-Requests: 1
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 14:55:27 GMT
Server: Apache
Last-Modified: Fri, 30 Jun 2017 09:14:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

2回目のアクセス

HTTP リクエストヘッダ

GET https://misc.laboradian.com/cache-test/ HTTP/1.1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:54.0) Gecko/20100101 Firefox/54.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ja,en-US;q=0.7,en;q=0.3
Referer: https://misc.laboradian.com/cache-test/
Connection: keep-alive
Upgrade-Insecure-Requests: 1
If-Modified-Since: Fri, 30 Jun 2017 09:14:00 GMT
Host: misc.laboradian.com

HTTP レスポンスヘッダ

HTTP/1.1 200 OK
Date: Wed, 28 Jun 2017 14:56:02 GMT
Server: Apache
Last-Modified: Fri, 30 Jun 2017 09:14:00 GMT
Content-Length: 416
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=UTF-8

画面の時間表示

更新された。

キャッシュが使われたか？

ブラウザのキャッシュは使用されない。
- If-Modified-Since がリクエストされるが（条件付きリクエスト）、サーバー側で 304 ステータスを返すような処理はないので、用意されたコンテンツが 200ステータスで返される。
- Last-Modified の日時が未来であっても、次に同じURLにアクセスしたら、条件付きリクエストが送られる。

5. まとめ

max-age と Expires を使って、未来を示す期間・日時を指定すれば、動的なページであってもウェブブラウザはキャッシュを使ってくれる。
- Expires は HTTP/1.0 からあるフィールドである。Cache-Control: max-age は、HTTP/1.1 で追加されたフィールドである。古いブラウザのことも考えて、両方指定しておくとよい。
ブラウザは Expires より max-age を優先してくれる。
- このルールは、RFC 7234 – Hypertext Transfer Protocol (HTTP/1.1): Caching に記述されている。
Webサーバー側で 「条件付きリクエストに対する判定処理」 を実装しておき、条件が合致しなければ304 ステータスコードを返すようにしておけば、Last-Modified もしくは ETag を使うことによって、ブラウザのキャッシュを使わせることができる。

HTTPレスポンスヘッダとブラウザキャッシュの関係を調査

1. はじめに

2. 使用したツール

Webサーバー側

クライアント側

3. 使用する HTML (PHP) ファイル

4. 実験

パターン1

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン2

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン3

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン4

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン5

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン6

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン7

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン8

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン9

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン10

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン11

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン12

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン13

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン14

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン15

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

パターン16

HTML (PHP)のヘッダ出力部分

1回目のアクセス

2回目のアクセス

5. まとめ

6. 参考