web
投稿日
投稿者 dennie

URLにファイル名なしでWEBページを表示させる

Webページ(htmlファイルなど)をブラウザに表示させる事は、単にインターネット上に公開されているファイルを読み込むことという説明は以前した通りです。

参考

【超入門】ホームページってどうして見れるのか？

しかし、URLを見るとファイル名の表記がない事がほとんどです。
今回はファイル名がないURLのwebページをブラウザに表示させる方法を説明します。

やりたいこと

ブラウザからファイル名なし(正確にはファイル名の拡張子なし)のURLでアクセスした場合、ブラウザのURLはファイル名なしで表示されたまま、ブラウザ画面にはファイル(html)の内容をwebページを表示するという感じです。

・ブラウザのURL
https://dennie.tokoy/tour/room

・ブラウザ画面に表示されるwebページの内容
https://dennie.tokyo/tour/room.html

補足

https://dennie.tokoy/tour とアクセスすると、https://dennie.tokoy/tour/index.html のwebページが閲覧出来ますが、この話とは別の話になります。

前提

今回は .htaccess ファイルを使用します。.htaccess ファイルが使える状態である事を前提として説明します。

なお、.htaccess ファイルは以下にあるものとします。

・.htaccess ファイルの置き場所
https://dennie.tokyo/tour

記載内容

.htaccess ファイルの内容は下記の通りです。

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}\.html -f
RewriteRule ^(.*)$ $1.html

RewriteEngine on

URLのリライトを行う機能をONにする ことなんですが、何も考えずとりあえず先頭に記載するというくらいで大丈夫です。

RewriteCond

リライト行う条件 を記載します。単に条件を記載するというくらいの認識で大丈夫です。なお、今回の例はRewriteCondが2回書かれているので、この二つの条件はAND条件となります。

REQUEST_FILENAME

” REQUEST_FILENAME “ は送信されたリクエスト(URL) のファイル名を意味します。以下を参考にして下さい。

参考

【apache】REQUEST_FILENAME

-d

“-d” はディレクトリを意味しています。そして、” ! “ が否定を意味します。
なので、” !-d “ はディレクトリではない(存在しない)場合 という意味になります。

-f

“-f” はファイルを意味しています。%{REQUEST_FILENAME}.html -f という記述は、ファイル名が.htmlファイルだった場合となります。

今回の例について

1つ目のRewriteCond

RewriteCond %{REQUEST_FILENAME} !-d

例えば、以下のようにアクセスしたとします。

・リクエストURL
https://dennie.tokoy/tour/room

REQUEST_FILENAME は “/room” になります。なので今回は “room” というディレクトリが存在しない場合 という条件になります。

2つ目のRewriteCond

RewriteCond %{REQUEST_FILENAME}\.html -f

例えば、以下のようにアクセスしたとします。

・リクエストURL
https://dennie.tokoy/tour/room

REQUEST_FILENAME は “/room” になります。なので今回は “room.html” というファイルが存在する場合 という条件になります。

RewriteRule

URLのリライトを行います。リライトについての詳しい説明は割愛しますが、RewriteRuleの記載形式は以下のようになります。

RewriteRule 正規表現パターン 置換URL [フラグ]

今回の場合、正規表現パターンは “^(.*)$” になります。これは任意の文字列という意味です。
置換URLは “$1.html” となります。”$1″ はリクエストされたURLを意味しています。

今回の例について

RewriteRule ^(.*)$ $1.html

例えば、以下のようにアクセスしたとします。

・リクエストURL
https://dennie.tokoy/tour/room

^(.*)$ は 任意の文字にマッチする となりますので、言い換えるとなんでもマッチするので今回のURLもマッチします。


$1 は “https://dennie.tokoy/tour/room” となります。なので $1.html は “https://dennie.tokoy/tour/room.html” となります。

したがって、ブラウザに表示される画面は、“https://dennie.tokoy/tour/room.html” へリライト(表示)されます。

なお、リライトはブラウザのURLには影響しません。なので、ブラウザのURLは “https://dennie.tokoy/tour/room” のままとなります。

© DeNnie.Lab All Rights Reserved.