チュートリアル - Apacheブラウザのキャッシュ設定| ステップバイステップ

Apache Browser Caching機能を設定する方法を知りたいですか？このチュートリアルでは、Ubuntu Linuxを実行しているコンピュータでApache Browser Caching機能を設定するために必要なすべての手順を説明します。

•Ubuntuのバージョン：18.04

ハードウェアリスト：

次のセクションでは、このWordpressチュートリアルを作成するために使用される機器のリストを示します。

上記の各ハードウェアは、AmazonのWebサイトにあります。

WordPress Playlist:

このページでは、Wordpressのインストールに関連する動画の一覧にすばやくアクセスできます。

Playlist

私たちのYouTubeチャンネルに登録することを忘れないでください FKIT.

WordPressの関連チュートリアル：

このページでは、Wordpressのインストールに関連するチュートリアルの一覧にすばやくアクセスできます。

チュートリアルのリスト

チュートリアル - Apacheブラウザのキャッシュ設定

まず、Apache Webサーバーをインストールする必要があります。

Linuxコンソールで、次のコマンドを使用してApacheをインストールします。

# apt-get update
# apt-get install apache2

これで、次のApacheモジュールを有効にする必要があります。

•mod_headers
mod_expires

mod_headersとmod_expiresを有効にするには、次のコマンドを使用します。

# a2enmod headers
# a2enmod expires

# systemctl restart apache2

apache2.conf構成ファイルを編集します。

# vi /etc/apache2/apache2.conf

ファイルの最後に、目的のブラウザキャッシュ設定を入力します。

一例として、私たちの設定です。

<IfModule mod_expires.c>
ExpiresActive On
FileETag None
ExpiresDefault "access plus 14 days"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/javascript "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType text/css "now plus 1 month"
ExpiresByType image/ico "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 month"
ExpiresByType text/html "access plus 1 days"
</IfModule>

新しい設定を有効にするには、Apacheを再起動する必要があります。

# systemctl restart apache2

必要に応じてブラウザのキャッシング時間を指定する必要があることに注意してください。

テスト - Apacheブラウザのキャッシュ設定

ブラウザのキャッシュ設定をテストするには、画像を含む基本的なHTMLページを作成しましょう

# cd /var/www/html
# wget https://techexpert.tips/wp-content/uploads/2017/12/TechExpert-Logo-Small.png
# vi test.html

test.htmlファイルの内容は次のとおりです。

<html>
<body>
<h1>TEST header</h1><br>
<img src="TechExpert-Logo-Small.png">
</body>

</html>

Apache Browser Caching機能をテストするために必要なソフトウェアをインストールします。

# apt-get update
# apt-get install wget curl

次のコマンドを使用して、WGETを使用してHTML文書にブラウザのキャッシュ機能をテストします。

200.200.200.200をサーバーのIPアドレスに変更する必要があることに注意してください。

# wget -S http://200.200.200.200/test.html

設定前のブラウザキャッシュの設定結果は次のとおりです。

HTTP request sent, awaiting response...
HTTP/1.1 200 OK
Date: Fri, 14 Dec 2018 16:58:36 GMT
Server: Apache/2.4.29 (Ubuntu)
Last-Modified: Fri, 14 Dec 2018 16:19:49 GMT
ETag: "64-57cfdcce7b707"
Accept-Ranges: bytes
Content-Length: 100
Vary: Accept-Encoding
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html
Length: 100 [text/html]

設定後のブラウザキャッシュの設定結果は次のとおりです。

HTTP request sent, awaiting response...
HTTP/1.1 200 OK
Date: Fri, 14 Dec 2018 17:05:04 GMT
Server: Apache/2.4.29 (Ubuntu)
Last-Modified: Fri, 14 Dec 2018 16:19:49 GMT
Accept-Ranges: bytes
Content-Length: 100
Cache-Control: max-age=86400
Expires: Sat, 15 Dec 2018 17:05:04 GMT
Vary: Accept-Encoding
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html
Length: 100 [text/html] Saving to: ‘test.html.3’

ご覧のとおり、この設定では、HTMLドキュメント用に1日のキャッシュが指定されています。

ExpiresByType text / html「アクセスプラス1日」

WGETの結果は、HTMLファイルが明日まで保持されることを示しています。

•有効期限：2018年12月15日17:05:04 GMT

次のコマンドを使用して、ブラウザのキャッシュ機能をCURLを使用してPNGイメージにテストします。

# curl -svo /dev/null http://200.200.200.200/TechExpert-Logo-Small.png

設定前のブラウザキャッシュの設定結果は次のとおりです。

* TCP_NODELAY set
* Connected to 34.220.19.99 (34.220.19.99) port 80 (#0)
> GET /TechExpert-Logo-Small.png HTTP/1.1
> Host: 34.220.19.99
> User-Agent: curl/7.58.0
> Accept: */*
>
< HTTP/1.1 200 OK
< Date: Fri, 14 Dec 2018 17:24:32 GMT
< Server: Apache/2.4.29 (Ubuntu)
< Last-Modified: Sat, 24 Nov 2018 02:49:53 GMT
< ETag: "483-57b60277af640"
< Accept-Ranges: bytes
< Content-Length: 1155
< Content-Type: image/png
<
{ [1155 bytes data]

設定後のブラウザキャッシュの設定結果は次のとおりです。

* TCP_NODELAY set
* Connected to 34.220.19.99 (34.220.19.99) port 80 (#0)
> GET /TechExpert-Logo-Small.png HTTP/1.1
> Host: 34.220.19.99
> User-Agent: curl/7.58.0
> Accept: */*
>
< HTTP/1.1 200 OK
< Date: Fri, 14 Dec 2018 17:18:04 GMT
< Server: Apache/2.4.29 (Ubuntu)
< Last-Modified: Sat, 24 Nov 2018 02:49:53 GMT
< Accept-Ranges: bytes
< Content-Length: 1155
< Cache-Control: max-age=2592000
< Expires: Sun, 13 Jan 2019 17:18:04 GMT
< Content-Type: image/png
<
{ [1155 bytes data]

ご覧のように、私たちの設定ではPNG画像用に1ヶ月のキャッシュが指定されています。

ExpiresByTypeイメージ/ png「アクセスプラス1ヶ月」

CURL結果は、PNGファイルが1月13日まで保持されることを示しています。

•有効期限：Sun、2019年1月13日17:18:04 GMT