apacheのキャッシュが効きません


MacOSX SierraにHomebrewでapache2を入れ、png画像とhtmlを配置しています。

画像をキャッシュしたいと思い、以下のようにhttpd.confの設定をしました。  
強制的にdiskキャッシュするためのモジュールのインポートと、diskキャッシュの設定と、ヘッダの設定です。

Last-
modefiedとExpireがレスポンスヘッダに乗っていないとキャッシュされないと(どこかで)見たためこちらも追記しており、両方正常にレスポンスヘッダに乗っていることを確認しています。

[code]

    LoadModule cache_module modules/mod_cache.so
    LoadModule disk_cache_module modules/mod_disk_cache.so
    
    <IfModule mod_cache.so>
        <IfModule mod_disk_cache.so>
            CacheRoot /tmp/cache
            CacheEnable disk /
            CacheIgnoreCacheControl On
            CacheIgnoreNoLastMod On
            CacheDefaultExpire 86400
            CacheMaxExpire 172800
        </IfModule>
    </IfModule>
    
    <IfModule mod_expires.c>
      ExpiresActive on
      ExpiresDefault 
      ExpiresByType image/png 
      <IfModule mod_headers.c>
        Header append Cache-Control "public, max-age=86400"
        Header set Expires "Mon, 26 Jul 2017 05:00:00 GMT"
      </IfModule>
    </IfModule>
    
[/code]

その後、/tmp/cacheを作成しパーミッションを777にしてapacheをrestartし、chromeのdeveloperツールのネットワークを開き、htmlのaタグから画像にアクセスし、1回目でStatus
200、2回目で(from disk
cache)と表示されていることを確認しているのですが/tmp/cacheには何もファイルが残っていません。また、chromeを再起動してから再び画像にアクセスするとStatus200となります。

Webサーバの設定でブラウザを再起動してもローカルのキャッシュを表示する方法はありますか？

1回目のアクセス時のレスポンスヘッダです。

[![1回目](https://i.stack.imgur.com/LyrSAm.png)](https://i.stack.imgur.com/LyrSA.png)

２回目以降です。  
[![2回目以降です](https://i.stack.imgur.com/jwXVkm.png)](https://i.stack.imgur.com/jwXVk.png)

↓  
ご指摘頂き、apacheの設定の仕方が間違っていたことがわかりました。

[code]

        Header append Cache-Control "public, max-age=86400"
    
[/code]

を

[code]

        Header set Cache-Control "public, max-age=86400"
    
[/code]

とすることでChromeを再起動させてもapacheにアクセスログが表示されないことを確認しました。  
ただ、safariではアクセスがされてしまい、固有のバグのようでした。  
ローカルキャッシュの活用を考えていますが、やりたいこととしては必要のない画像取得の通信を出来るだけ減らしたい、更新のない同じ画像を何度もapacheからダウンロードさせるのは避けたいが更新があれば通信させるということです。  
オフラインでも動くことは求めておらず、画像はバナーや商品画像など様々なものがあるためマニフェストファイルに画像を指定するApplicationCacheよりローカルストレージを使い、キャッシュを更新したいときはAPIから更新フラグを受け取り、更新する場合はclearCacheするという方法を用いたいと思います。

↓

と思ったのですがAPIからキャッシュクリアするフラグを入れるのは悪手だということがわかりました。  
どれだけの期間フラグをtrueにするかの問題とか、フラグがtrueになっている間はアプリを起動するたびにキャッシュ削除→画像再取得という状態になってしまうので、画像URLを変更しようと思います。




サーバーサイドキャッシュとクライアントサイドキャッシュは別物です。それぞれ区別して考える必要があります。一度指摘しましたが、修正してもなお「サーバーサイドキャッシュの設定を行ったがクライアントサイドキャッシュが行われていない」旨が質問されていて、質問者さん自身が何を求めているのかわかっていない印象を受けます。

まずサーバーサイドキャッシュについてですが、`/tmp/cache`ディレクトリに対して何を求めているのでしょうか？
質問文からはディスクの別領域に置かれている画像ファイルをこのディレクトリ下にコピーされることを期待しているように読み取れますが、コピーする意義がありません。  
動的に生成されたコンテンツや`Content-Encoding:
gzip`などで圧縮されたコンテンツが置かれる場所と考えるべきです。（IISは後者も置いていましたがApacheは置かなかったような…うろ覚えです。）

次にクライアントサイドキャッシュについてですが、設定内容だけでなくブラウザー側で受信したレスポンスヘッダーも提示していただかないことにはわかりません。  
レスポンスヘッダーとは全く別アプローチの[アプリケーションキャッシュ](https://developer.mozilla.org/ja/docs/Web/HTML/Using_the_application_cache)という機構もあります。こちらも一つの選択肢としてお考え下さい。

* * *

レスポンスヘッダーの画像を確認しましたが

>
[code]

>     Header append Cache-Control "public, max-age=86400"
>     Header set Expires "Mon, 26 Jul 2017 05:00:00 GMT"
>  
[/code]

のヘッダーが含まれていません。まずは設定内容が正しく反映できているかを確認すべきですし、それができていなければあらゆる設定に意味を持たないと思います。

>
> アプリケーションキャッシュはサ‌​ーバ側で更新することが難しい(間違った画‌​像を配信した場合にすぐ更新するのが難しい‌​)と聞いてローカルストレージを優先して試‌​そうと考えています

そもそもWebサーバーと通信しないようにしたいという質問だったはずです。通信しない以上、どのような方法であれWebサーバー側での更新内容を知ることはできません。  
最初に指摘しましたが、 **どこで何をキャッシュさせたいのか考え直すことをお勧めします。**

