ホームページ制作で絶対設定したいサーバー基本設定.htaccessの設定9選

folder_openWEB制作
ワードプレス

プロが教えるワンランク上のホームページ制作講座。

今回は.htaccessに記述することで、ホームページのセキュリティを高め、表示速度も改善してくれる夢の様なおすすめ設定をご紹介します。

どれも.htaccessに貼り付けるだけで簡単に使える設定ばかりなので、是非ホームページ制作の役に立てて下さい。
Xサーバー系で動作確認済みのコードです。

 

 

mod_deflateでgzip圧縮を有効にして転送量を削減・高速表示する

mod_deflate
mod_deflateはコンテンツを圧縮して、転送量を減らすことが出来るモジュールです。
転送量が減ることでWEBサイトの高速表示が可能になります。

但し、サーバーの処理は増えるため、能力の低いサーバーの場合は逆にレスポンスが低下します。

まぁ最近のサーバーはどれも高速なので、たいがいはmod_deflateの導入でプラスになります。

下のコードはWEBフォントもmod_deflateで圧縮させています。


#WEBフォントの圧縮定義
<IfModule mod_mime.c>
AddType font/opentype .otf
AddType font/eot .eot
AddType font/truetype .ttf
AddType application/font-woff .woff
</IfModule>

#サーバーでのgzip圧縮を有効
<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE font/opentype font/eot font/truetype application/font-woff
</IfModule>

 

mod_expiresでブラウザキャッシュを有効にして転送量を削減する

mod_expires
mod_expiresはブラウザに画像やCSSなどファイルをキャッシュさせるモジュールです。
キャッシュの処理を定義することで、画像やCSSなどを再度読み込むことがなくなり表示スピードが高速化されます。

#mod_expiresでキャッシュを設定
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType text/css "access plus 1 days"
ExpiresByType image/gif "access plus 1 weeks"
ExpiresByType image/jpeg "access plus 1 weeks"
ExpiresByType image/png "access plus 1 weeks"
ExpiresByType application/x-javascript "access plus 1 weeks"
</IfModule>

 

E-tagを無効にして転送量を削減する

E-tag
ETagとはキャッシュされているコンポーネントの有効性を検証する仕組みでブラウザのキャッシュ管理に使われます。

ETagにinode情報が含まれていると良くないセキュリティ上の理由もあるので無効にします。

#E-tags
<Files ~ "\.(css|js|html?|xml|gz)$">
    FileETag MTime Size
</Files>
<Files ~ "\.(gif|jpe?g|png|flv|mp4|ico)$">
    FileETag None
</Files>

 

Expire Headerを有効にして転送量を削減する

Expire Header
Expiresヘッダーはサーバーに新しいファイルが存在しているかどうかを確認せず、ブラウザでキャッシュ済みのファイルを強制的に適用します。

キャッシュを強制的に読み込む期間を指定することで、一定期間はPCに保存されたキャッシュファイルを読み込むことになり、結果的に転送量を削減出来ます。

E-Tagよりも重要度が高く優先されます。

# Expire Header
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf|gz)$"> # 24weeks
    Header set Cache-Control "max-age=14515200, public"
</FilesMatch>
<FilesMatch "\.(xml|txt)$"> # 2DAYS
    Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>
<FilesMatch "\.(html|htm)$"> # 2HOURS
    Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>
#Defer parsing of JavaScript
<FilesMatch "(?i)^.*\.(ico|flv|jpg|jpeg|png|gif|js|css|pdf)$">
    ExpiresActive On
    ExpiresDefault A2592000
</FilesMatch>
<ifmodule mod_deflate.c>
    AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
</ifmodule>

 

X-Frame-Optionsを使用してセキュリティを高める

X-Frame-Options
X-Frame-Optionsはiframe内からWebページが読み込まれるのを防止するHTTPレスポンスヘッダです。
クリックジャッキング攻撃を防止するなどの目的で用意されたものだそうです。

X-Frame-Optionsに設定可能な値はDENYとSAMEORIGIN の2つ。
DENY iframe全面禁止
SAMEORIGIN 同じサイト内のページで読み込まれた場合だけ許可

# X-Frame-Options
<ifmodule mod_headers.c>
Header set X-XSS-Protection "1; mode=block"
Header always set X-Content-Type-Options "nosniff"
Header always set X-Download-Options: noopen
Header set X-Powered-By: ""
Header always append X-Frame-Options SAMEORIGIN
</ifmodule>

 

SSLサイトのおススメ設定 HSTS

HSTS（HTTP Strict Transport Security）
サイトにHttpではなくHttpsで必ず接続するように、サーバーがブラウザに指示するHTTPヘッダーです。
この指示を受け取ったブラウザは、以降そのサイトに対して自動的にHTTPSで接続するようになります。

httpへのアクセスをhttpsへリライト
mod_rewriteを使ってhttpへのアクセスを強制的にhttpsへ切り替えます。

# HSTS
Header set Strict-Transport-Security "max-age=31536000; includeSubDomains"
# https
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</IfModule>

※SSLサイト以外には使わないでください。

Secure Cookieでsecure属性を追加する

Secure Cookie
折角SSLで暗号化してもCookieで「secure属性」を指定しないと、外部から盗聴される可能性があります。
早速設定しまよう。

# Secure Cookie
<IfModule mod_php5.c>
php_flag session.cookie_httponly on
php_flag session.cookie_secure On
</IfModule>

 

WORDPRESS重要ファイルへのアクセスをブロックする

WORDPRESSのコアファイルへのアクセスをブロックする基本的なセキュリティ記述です。
まだ対応していない方は早速対応しましょう。

# WP_BLOCK
<Files wp-config.php>
Order allow,deny
Deny from all
</Files>
<FilesMatch "^(wp-config\.php|wp-mail\.php|install\.php|xmlrpc\.php)">
Order allow,deny
Deny from all
</FilesMatch>

 

.htaccessへのアクセスをブロックする

色々設定してきましたが、.htaccessに不正アクセスされたらおしまいです。
なので.htaccess自体へのアクセス制限をしましょう。

 <Files ~ "^.*\.([Hh][Tt][Aa])"> order allow,deny deny from all satisfy all </Files>

XサーバーならそのままコピペOK　全ての設定が入った.htaccess

# HSTS
Header set Strict-Transport-Security "max-age=31536000; includeSubDomains"
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTPS} off
RewriteRule ^(.*)$ https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
</IfModule>

# MIME Type
<IfModule mime_module>
    AddType text/cache-manifest .appcache
    AddType image/x-icon .ico
    AddType image/svg+xml .svg
    AddType application/x-font-ttf .ttf
    AddType application/x-font-woff .woff
    AddType application/x-font-woff2 .woff2
    AddType application/x-font-opentype .otf
    AddType application/vnd.ms-fontobject .eot
</IfModule>

# Gzip
<IfModule mod_mime.c>
AddType font/opentype .otf
AddType font/eot .eot
AddType font/truetype .ttf
AddType application/font-woff .woff
</IfModule>

<IfModule mod_deflate.c>
SetOutputFilter DEFLATE
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSI[E] !no-gzip !gzip-only-text/html
SetEnvIfNoCase Request_URI \.(?:gif|jpe?g|png|ico)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI _\.utxt$ no-gzip
#DeflateCompressionLevel 4
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-httpd-php
AddOutputFilterByType DEFLATE font/opentype font/eot font/truetype application/font-woff
</IfModule>


<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresDefault "access plus 1 seconds"

  ExpiresByType text/css "access plus 1 weeks"
  ExpiresByType text/js "access plus 1 weeks"
  ExpiresByType text/javascript "access plus 1 weeks"
  ExpiresByType image/gif "access plus 1 weeks"
  ExpiresByType image/jpeg "access plus 1 weeks"
  ExpiresByType image/png "access plus 1 weeks"
  ExpiresByType image/svg+xml "access plus 1 year"
  ExpiresByType application/pdf "access plus 1 weeks"
  ExpiresByType application/javascript "access plus 1 weeks"
  ExpiresByType application/x-javascript "access plus 1 weeks"
  ExpiresByType application/x-shockwave-flash "access plus 1 weeks"
  ExpiresByType application/x-font-ttf "access plus 1 month"
  ExpiresByType application/x-font-woff "access plus 1 month"
  ExpiresByType application/x-font-woff2 "access plus 1 month"
  ExpiresByType application/x-font-opentype "access plus 1 month"
  ExpiresByType application/vnd.ms-fontobject "access plus 1 month"
</IfModule>


# Expire Header
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf|gz)$"> # 24weeks
    Header set Cache-Control "max-age=14515200, public"
</FilesMatch>
<FilesMatch "\.(xml|txt)$"> # 2DAYS
    Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>
<FilesMatch "\.(html|htm)$"> # 2HOURS
    Header set Cache-Control "max-age=7200, must-revalidate"
</FilesMatch>
#Defer parsing of JavaScript
<FilesMatch "(?i)^.*\.(ico|flv|jpg|jpeg|png|gif|js|css|pdf)$">
    ExpiresActive On
    ExpiresDefault A2592000
</FilesMatch>
<ifmodule mod_deflate.c>
    AddOutputFilterByType DEFLATE text/text text/html text/plain text/xml text/css application/x-javascript application/javascript
</ifmodule>

# Enable Keep-Alive
<IfModule mod_headers.c>
    Header set Connection keep-alive
</IfModule>

#E-tags
<Files ~ "\.(css|js|html?|xml|gz)$">
    FileETag MTime Size
</Files>
<Files ~ "\.(gif|jpe?g|png|flv|mp4|ico)$">
    FileETag None
</Files>

# X-Frame-Options
<ifmodule mod_headers.c>
Header set X-XSS-Protection "1; mode=block"
Header always set X-Content-Type-Options "nosniff"
Header always set X-Download-Options: noopen
Header set X-Powered-By: ""
Header always append X-Frame-Options SAMEORIGIN
</ifmodule>

# Secure Cookie
<IfModule mod_php5.c>
php_flag session.cookie_httponly on
php_flag session.cookie_secure On
</IfModule>

# WP_BLOCK
<Files wp-config.php>
Order allow,deny
Deny from all
</Files>
<FilesMatch "^(wp-config\.php|wp-mail\.php|install\.php|xmlrpc\.php)">
Order allow,deny
Deny from all
</FilesMatch>

以上　.htaccessに記述するだけでセキュリティを高め、表示速度を改善するおススメの設定９選でした。

関連記事:ホームページの品質検査に使えるツール10選

 

Share Me!
前の投稿
SEOに強くなる！WORDPRESSホームページのブログ作成5つの技
次の投稿
WooCommerceのストライプカード決済にJCBアイコンを表示させる

関連記事

ミシナ・カズノリ
ミシナ・カズノリ WEBクリエーター・ITエンジニア
iT-STUDIO代表 40歳で会社を辞め日本一周車中泊の旅へ。 その後厄年起業しWEBデザイン、システムエンジニアリングのビジネスを行っているフリーランスです。
趣味はオーディオ・自作PC・MAC・車・カメラ・キャンプ・料理と多趣味。特にPCは小5の時に買ってもらったMSXから数えて30年以上のキャリア＆組み上げた総数が100台を超える変態っぷり。Linux系も大好物です。
2019年川崎町青根温泉の別荘地に移住。田舎暮らししながら最新のIT系仕事をやってます。日々の生活からお役立ち情報まで気ままに綴っています。 宮城県川崎町在住
1974年生まれ。

Instagram

Archive

keyboard_arrow_up