アクセス元の情報を表示するプログラムを作る

今は、様々なブログやアプリ、サービスで、アクセス解析のためにユーザの情報を取得しています。ここでは、簡易にアクセスしてきた人のIPアドレス等のアクセス情報を表示させるプログラムを作ってみたので記事にしてみました。HTML、Javascript、PHP、ipinfo、CSS少々で作った1ファイルプログラムになります。

前提

まず、前提として、プログラムとはいうものの、ブラウザ上で動く、基本的な取得情報を組み合わせたものになります。それっぽい情報が表示されますが、このプログラムでは、今、皆さんが普通にインターネットを使用する上で、当たり前に取得、確認、利用されている情報なので、怖がる必要はありません。本当に個人情報や詳細な情報を取得するとなると、OSやブラウザなどの特権、操作権限を奪う位しないと、情報は取れないようにブラウザ側、OS側のセキュリティが動いてくれます。法律なども個人の情報の取り扱いは厳格になっており、取得した情報は何かに利用、蓄積する場合は同意が必要など、昨今は大変厳しくなっております。今回、記載するプログラムも、表示するだけで、ログに蓄積や解析のため、何かに利用することもありません。

はじめに

それでは、はじめに、1つのファイル、プログラムで表示できるもの、表示させたい情報が何かを考えます。調べてみたところ、下記は難しい操作やコードはなくても表示させることが出来ることがわかりました。

  1. アクセスしてきた端末のIPアドレス
  2. アクセスしてきた時刻
  3. アクセスしてきた国と地域
  4. アクセスしてきたブラウザ
  5. このプログラムにアクセスする直前のURL

全体コード

完成形のコードを載せます。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>アクセス情報</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f0f0f0;
margin: 0;
padding: 0;
}
.container {
max-width: 600px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}h1 {
text-align: center;
}p {
font-size: 18px;
}span {
font-weight: bold;
color: #0073e6;
}
</style>
</head>
<body>
<div class="container">
<h1>アクセス情報</h1>
<p>IPアドレス:<?php echo $_SERVER['REMOTE_ADDR']; ?></p>
<p>アクセス時刻: <?php echo date('Y-m-d H:i:s'); ?></p>
<?php
$ip = $_SERVER['REMOTE_ADDR'];
$json = file_get_contents("https://ipinfo.io/{$ip}/json");
$data = json_decode($json);
if ($data && isset($data->country) && isset($data->region)) {
$country = $data->country;
$region = $data->region;
echo "<p>アクセス元の国: $country</p>";
echo "<p>アクセス元の地域: $region</p>";
} else {
echo "<p>位置情報が取得できませんでした。</p>";
}
?>
<p>ブラウザ情報: <span id="browserInfo"></span></p>
<p>直前のURL（リファラー）: <span id="referrerInfo"></span></p>
</div>
<script>
document.addEventListener("DOMContentLoaded", function () {
// ブラウザ情報を取得
var browserInfo = navigator.userAgent;
document.getElementById("browserInfo").textContent = browserInfo;// リファラー情報を取得
var referrerInfo = document.referrer;
document.getElementById("referrerInfo").textContent = referrerInfo;
});
</script>
</body>
</html>

下記の３つはPHPで取得表示させます。

  1. アクセスしてきた端末のIPアドレス
  2. アクセスしてきた時刻
  3. アクセスしてきた国と地域

IPアドレスと時刻はPHPの基本コードで取得表示。アクセスしてきた国と地域を表示させるにあたっては、ipinfo というIPアドレスから国、地域を表示させるサービスを利用して表示をさせています。

４，５はJavascriptで取得表示をさせます。

 

完成版のデモ動作確認用ページ

このHTMLファイルはPHPで組み込んでいるのでWebサーバ等にファイルを置かないと動作しないため、下記に動作確認用のデモ動作確認用ページを作りました。動作確認用にアクセスしてみていただければと思います。アクセスをすると下記画面のように表示されます。

https://prevendoll.com/prototype/access.php

 

おわりに

基本的なコードだけで、アクセス情報を表示させることが出来ました。一般的なアクセス解析はもっと精度も高く、仕組みも複雑なものですが、これらの情報は改良、安定運用にために使われるので、適切なレベルであれば取得、利用は慌てず、容認すべきものであると個人的には思います。ただ、これらの情報は悪用すれば、その人がどこで何をどうしたまで確認しようと思えば出来てもしまうので、怪しいサイト、サービス、運営元といった場合には安易に許可、提供しないように注意が必要ではありますので、判断には気を付けたいところであります。