LoginSignup
23
24

More than 3 years have passed since last update.

HTML + JavaScript 非同期でIPアドレスを取得して表示してみた

Last updated at Posted at 2020-01-22

ちょっとクライアントでIPアドレスを取得する必要があったので、
やり方を残しておきます。

今回はipinfo.ioのJSONP API使用してIPアドレスを取得しました。

ちなみにipinfo.ioは自分のIPアドレスを教えてくれるWebサービスです。

JavaScript

$.ajax({
    url: "https://ipinfo.io",
    dataType: "jsonp",
    success: function(res){
         $(".ip-address").text(res.ip);
    }
});

HTML

<p>
    あなたのIPは<a class="ip-address"></a>です。
</p>

こちらのスクリプトを実行するとIPアドレスが表示できると思います。

まとめ

通常、IPアドレスはサーバで取得することが多いかと思いますが、
今回のようにクライアントでもIPアドレスを取得したい時に役立ちます。

23
24
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
23
24