コピペ可!IPアドレス確認サイトの作り方

howto
この記事は約6分で読めます。
この記事は、最終更新日(2022-01-05)から1年以上経過しています。
記事の情報が古い可能性があります。ご了承ください。

ウェブサイトに訪問者のIPアドレスを表示させたいけど、どうすればいいかわからない!と言う方もチラホラ居ると思うので、今回は訪問者のIPアドレスを表示するサイトの作り方をIP確認サイトを運営している私が教えます!

スポンサーリンク

そもそもIPとは?

wikiPediaにはこう書いてあります。

IPアドレス(アイピーアドレス、IP address;InternetProtocol address)とは、インターネット・プロトコル (IP)において、通信の相手先を識別するための番号である。インターネットアドレスとも呼ばれる

引用:Wikipedeia

つまりネット上の住所です。リアルの住所とは一切関係ありません。

よくIPアドレスから住所割り出すとか話有りますがIPアドレスからリアルの地理情報を取得しても、分かるのはキャリアのデータセンターの情報です。開示請求とかは話は別ですが個人情報を開示させるには弁護士だったりを雇って裁判所に許可をもらう必要があるので現実的ではありません。

IPアドレスがバレたとしてもプライバシーが脅かされる事はありませんのでご安心ください。

話が大分脱線しましたので本題に戻ります^^;

作り方

まず準備するものは

  • ウェブサーバー
  • コードエディタ
  • HTML.JavaScript

オフラインのローカル環境では実行出来ませんのでウェブサーバーを用意してください。

コードエディタに関しては何でも構いません。

何ならメモ帳でも大丈夫です。(おすすめはしませんが)

ソースコード サンプル

まずはシンプルなIPのみ表示するコードです。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport"
   content="width=320,
      height=480,
      initial-scale=1.0,
      minimum-scale=1.0,
      maximum-scale=2.0,
      user-scalable=yes" />
	<title>あなたのIPアドレス</title>
</head>
<body>
<center>
	<h3>あなたのIPアドレス</h3>
<script type="application/javascript">
function getip(json){
    document.write(json.ip);
}
</script>

<script type="application/javascript" src="https://api.ip.sb/jsonip?callback=getip"></script>
</center>
</body>
</html>

このコードを実行すると画像のようになります。

シンプルにIPアドレスオンリーなページが出来ます。

xxの部分は念の為隠しています。

もっと詳細な情報を表示させたい場合は?

この様に思う方もいると思います。

この場合は以下のコードで表示させることが可能です。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport"
   content="width=320,
      height=480,
      initial-scale=1.0,
      minimum-scale=1.0,
      maximum-scale=2.0,
      user-scalable=yes" />
	<title>あなたのIPアドレスとその他情報</title>
</head>
<body>
<center>
<h3>あなたの情報</h3>
<script type="application/javascript">
function getgeoip(json){
    document.write("【IPアドレス】", json.ip );
    document.write("【IPから割り出した国】 ", json.country);
    document.write("【利用中のISP】", json.organization);
    document.write("【契約している通信事業者】", json.asn_organization);
}
</script>

<script type="application/javascript" src="https://api.ip.sb/geoip?callback=getgeoip"></script>
</center>
</body>
</html>

このコードを実行するとこんな感じになります。

画像をクリックすると拡大します。

ちなみにIPアドレスなどのデータを取得してる部分は以下の通りです。

<script type="application/javascript">
function getgeoip(json){
    document.write("【IPアドレス】", json.ip );
    document.write("【IPから割り出した国】 ", json.country);
    document.write("【利用中のISP】", json.organization);
    document.write("【契約している通信事業者】", json.asn_organization);
}
</script>

<script type="application/javascript" src="https://api.ip.sb/geoip?callback=getgeoip"></script>

 

ですので他の情報も表示したい。あるいは他の情報と表示されてる情報を変えたい場合は

 

document.write("【契約している通信事業者】", json.asn_organization);

asn_organization

の部分を書き換えるだけでOKです。

取得できる情報一覧

見た目などをカスタムしたい場合はBootStrapなどご利用ください。

まとめ

意外と簡単に出来てしまいましたね!

良ければ私の運営しているIP確認サイトもご覧ください!

インターネット検閲などによるウェブサイトへのアクセスの可否の確認

スピードテストなど色んな情報を一括確認出来るサイトです。

IP確認サイト

↑この記事が役に立てたら「いいね」ボタンを押してください!
この記事を書いた人
ウェブホスティング運営中|FreeHostBox.net
Anon

■20歳
・ウェブアプリ開発
・ホスティングプロバイダ運営者
・22年1月4日ブログ開設
■好きなもの
・猫
・お寿司
・夜明け前の景色

Anonをフォローする
howtoプログラミング
Anonをフォローする

コメント

タイトルとURLをコピーしました