プログラミング

アクセス元のグローバルIPアドレスが表示されるだけのWebページを作る (Content-Type を変えた2種類)(PHP利用)

投稿日:2019年1月10日 更新日:

1. はじめに

アクセス元の グローバルIPアドレス が表示されるだけのWebページを作ってみましょう。

少し工夫して、以下の2通り作成します。

  1. HTMLバージョン
  2. プレーンテキストバージョン

プログラミング言語としては、PHP を使います。PHP なら、たいていのレンタルサーバーで何も設定せずに使えます。

2. 手順(HTMLバージョン)

HTMLのコンテンツ(ページ)として作成する場合です。

(1) ウェブサーバー上にディレクトリを用意します

ウェブサーバーのドキュメントルートとなるディレクトリ以下に、今回アクセスするためのディレクトリを作ります。

例えば myip というディレクトリを作ります。

(2) index.php ファイルを作成します

(1) で作成したディレクトリ内に、index.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>My IP address</title>
</head>
<body>
<?php echo $_SERVER['REMOTE_ADDR']; ?>
</body>
</html>

基本的には一般的な HTML が書いてあるだけなのですが、body の中に「アクセス元のIPアドレス」を出力するPHPのコードを記述しています。(参考:PHP: $_SERVER – Manual

※ HTML の中に文字列を出力する場合、通常は HTMLエスケープ処理を通して出力しないと危険なのですが、$_SERVER['REMOTE_ADDR'] に格納されたIPアドレスに悪意のある文字列がセットされることは考えにくいため、ここではそのまま出力しています。

(3) この Webページにアクセスします

作成した Webページにアクセスします。(1) で作成したディレクトリの位置に応じた URL にアクセスします。

例えば、ドキュメントルートとなるディレクトリ直下に myip という名前のディレクトリを作成した場合は、http(s)://ドメイン/myip/ という URL になります。

こんな感じで表示されます
こんな感じで表示されます

デモページを作ってみました。

実際にアクセスし、ブラウザのデベロッパーツールで中身を見てみると、Content-Type が、「text/html」になっていることが分かります。これは HTMLコンテンツであることを意味しています。

Chromeブラウザのデベロッパーツールで確認したところ
Chromeブラウザのデベロッパーツールで確認したところ

3. 手順(プレーンテキストバージョン)

プレーンテキストのコンテンツとして表示する場合です。

(1) ウェブサーバー上にディレクトリを用意します

ウェブサーバーのドキュメントルートとなるディレクトリ以下に、今回アクセスするためのディレクトリを作ります。

例えば myip2 というディレクトリを作ります。

(2) index.php ファイルを作成します

(1) で作成したディレクトリ内に、index.php というファイルを作成します。

そのファイルに以下を記述してください。

<?php
header("Content-Type: text/plain;charset=UTF-8");
echo $_SERVER['REMOTE_ADDR'];
?>

Webサーバーからクライアントに返すレスポンスヘッダの一部を PHP の header() 関数で出力しています。具体的には、コンテンツの種類を表す「Content-Type」という項目に、「text/plain」を指定しています。つまりこれは、HTML文書ではなく「ただのテキストデータ」として扱うように ウェブブラウザに指示することになります。実際、どこにも HTMLタグは書いていません。
(参考:MIME タイプ | MDN

その下は、HTMLバージョンの時と同様に、アクセス元のIPアドレスを出力しています。

(3) この Webページ(実際はただのテキストページ)にアクセスします

作成した Webページにアクセスします。(1) で作成したディレクトリの位置に応じた URL にアクセスします。

例えば、ドキュメントルートとなるディレクトリ直下に myip2 という名前のディレクトリを作成した場合は、http(s)://ドメイン/myip2/ という URL になります。

こちらも、デモページを作ってみました。

ウェブブラウザ上に表示される内容としては、HTMLバージョンとほぼ同じになりますが(*1)、これは HTMLページではなく、あくまでテキストのコンテンツです。ブラウザのデベロッパーツールで確認すると、Content-Type が「text/plain」になっています。

Chromeブラウザのデベロッパーツールで確認したところ
Chromeブラウザのデベロッパーツールで確認したところ
(*1) HTMLバージョンとテキストバージョンでは表示される文字のフォントやサイズが少し違っていると思います。これはなぜかというと、ウェブブラウザは独自に「デフォルトで適用するスタイルシート」を持っており、HTMLバージョンの場合はこれが適用されるためです。

4. プレーンテキストバージョンの利点

プレーンテキストとして作成したページはシンプルである分、他から利用しやすいという利点があります(その代り、装飾などはできませんが)。

例えば、ターミナルエミュレータで以下のコマンドを実行すると、そのデバイスのグローバルIPアドレスを表示することができます。

$ wget -qO - https://misc.laboradian.com/myip2/

以下でも同様です。

$ curl https://misc.laboradian.com/myip2/

HTMLバージョンだと、HTMLタグがいろいろと入っているため、肝心のIPアドレス部分を取り出すのにもう一手間必要になります。

5. おわりに

アクセス元のグローバルIPアドレスが表示されるWebページの作り方を2種類説明しましたが、今回の内容の場合であれば、プレーンテキストとして作成した方が使い勝手がよいでしょう。

単純な Webページですが、これも1つのWebサービスです。更に他の項目も表示して発展させたい方は、以下の記事を参考にしてください。

Web Programming

ブラウザがウェブサーバーに送っている情報を表示するウェブページを作ってみよう(HTML/CSS/JavaScript/PHP)

2016.11.08

その他の関連記事

Windows

Windows 10 で自分のIPアドレスを調べる方法

2018.06.08

📂-プログラミング

執筆者:labo


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

Web

OpenID Connect の処理フロー

OpenID Connect の処理フローを図にしました。

Web Programming

ソフトウェアにおける日付・時刻フォーマット

目次ソフトウェアにおける日付・時刻フォーマット参考情報ISO 8601RFC 5322RFC 7231Common Log Format ソフトウェアにおける日付・時刻フォーマット ソフトウェア(特に …

docker

Docker を使って特定のバージョンのPHPコマンドを実行する方法

PHP: Supported Versions を見てみると、現在サポートされているPHPのバージョンは、7.2系統、7.1系統、7.0系統、5.6系統の4種類であることが分かります。PHP: Dow …

Web Storage を使ったサンプルページを作りました

Web Storage を使ったサンプルページを作りました。 目次1. スクリーンショット2. デモページ3. 動作4. ソースコード5. 参考情報 1. スクリーンショット スクリーンショット 2. …

Web Programming

サーバーからブラウザを通じてデスクトップ通知する方法(Push API を利用)

Push API を使ってサーバーからブラウザにメッセージを送る方法について説明しています。