勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

バニラJavaScriptにて「ipify API」を利用してユーザのIPアドレスを取得する方法

  JavaScript

あるサイトでユーザのIPアドレスを取得したいというケースがあった。普段であればPHPで取得できるがASPを利用したサイトのためPHPは使用不可という制限があった。調べたところ「ipify API」というAPIが無料かつ制限無しでIPアドレスを取得できる模様。以下に利用方法をメモ。

 

ipify API

公式サイト

https://www.ipify.org/

GitHub

https://github.com/sindresorhus/ipify

 

利用方法

ソースコード

<script>
const url = 'https://api.ipify.org?format=json';
const xhr = new XMLHttpRequest();
xhr.open('GET', url);
xhr.send();
xhr.responseType = 'json';
xhr.onload = () => {
    if( xhr.status == 200 ){
        console.log(xhr.response); //Object { ip: "xxx.xxx.xxx.xxx" }
        console.log(xhr.response.ip); //xxx.xxx.xxx.xxx
    }else{
        console.log(`Error`);
    }
};
</script>

 - JavaScript

  関連記事

Leafletにアイコン(ボタン)を設置できる「Leaflet.EasyButton」プラグインの利用方法
Leafletにアイコン(ボタン)を設置できる「Leaflet.EasyButton」プラグインの利用方法

先日「leaflet-tag-filter-button」プラグインのCDN呼び ...

JavaScript / jQueryでブラウザのウィンドウがアクティブかどうかを判別する方法
JavaScript / jQueryでブラウザのウィンドウがアクティブかどうかを判別する方法

ある動画サイトを閲覧していた際にウィンドウが非アクティブになると視聴中の動画が止 ...

JavaScriptにて正規表現を用いずに文字列の一括置換を行う方法
JavaScriptにて正規表現を用いずに文字列の一括置換を行う方法

文字列の一括置換を行う際、PHPだとstr_replaceで問題無く対応できるが ...

JavaScriptでリファラをチェックし、ホスト名と一致するかどうかで分岐処理する方法
JavaScriptでリファラをチェックし、ホスト名と一致するかどうかで分岐処理する方法

ページアクセス時にリファラがホスト名と一致していれば何らかの処理を、一致しない場 ...

jQueryで特定のdata属性をセレクタとして指定する方法
jQueryで特定のdata属性をセレクタとして指定する方法

jQueryで特定のdata属性をクリックした際に何らかのイベントを実行したかっ ...