JavaScript - 文法 - ドット表記アドレスを整数表現へ変換

1.　概要

2.　ドット表記アドレスを整数表現へ変換

3.　やってみる

4.　参考サイト

1.　概要

　やりたいのは、「アドレス範囲を指定して、『CIDR』形式に変換する」ことなのです。

2.　ドット表記アドレスを整数表現へ変換

　冒頭の命題を実現するには、ドット表記アドレスを整数表現へ変換する必要があります。
　「PHP」であれば、「ip2long()」という関数があるので、それを使えばいいのですが、「JavaScript」には、都合のいい関数がないようなので、自前で作ります。
　その逆も含めて、こんな感じ。


/**
 * IP文字列 → 32bit整数
 */
function ipToLong(ip)
{
	return ip.split('.').reduce((acc, oct) => (acc << 8) + parseInt(oct, 10), 0) >>> 0;
}

/**
 * 32bit整数 → IP文字列
 */
function longToIp(long)
{
	return [
		(long >>> 24) & 255,
		(long >>> 16) & 255,
		(long >>> 8) & 255,
		long & 255
	].join('.');
}


　上記のコードを含んで、下記のコードを書きます。


<script>

/* ここに 上記のコードを記述します。 */

/**
 * IP範囲をCIDR表記に変換する
 * 例: 192.168.0.0 - 192.168.255.255 → [ "192.168.0.0/16" ]
 */
function ipRangeToCidr(startIp, endIp)
{
	let start = ipToLong(startIp);
	let end = ipToLong(endIp);
	let result = [];

	while (end >= start)
	{
		let maxSize = 32;

		// 最小のブロックサイズを探す
		while (maxSize > 0)
		{
			let mask = (1 << (32 - (maxSize - 1))) - 1;
			if ((start & mask) !== 0)
			{
				break;
			}
			maxSize--;
		}

		// 終了IPを超えない最大のブロックサイズ
		let x = Math.floor(Math.log2(end - start + 1));
		let maxDiff = 32 - x;
		if (maxSize < maxDiff)
		{
			maxSize = maxDiff;
		}

		result.push(longToIp(start) + "/" + maxSize);
		start += Math.pow(2, (32 - maxSize));
	}

	return result;
}

function calc(min, max)
{
	let cidrs = ipRangeToCidr(min, max);

	const mySpanElement = document.getElementById('result');
	mySpanElement.textContent = " " + cidrs + " ";

}
</script>


3.　やってみる

　で、下記を記述します。


<form action="">
<input type="text" id="min" value=""> ～ <input type="text" id="max" value="">

<input class="page" type="button" value="計算" onclick="calc(document.getElementById('min').value, document.getElementById('max').value)">
</form>
<span id="result" style="border: 2px solid #333; width: 16px; padding: 2px;"></span>


　それが下記の表示になります。

　　 ～ 

　　

　　　　　　　　　　

　上記の、上の左枠内に、「IPv4」アドレス範囲の開始アドレス、右枠内に終了アドレスを記述して、「計算」のボタンを押すと、下の枠内に、「CIDR」形式のアドレスが出力されます。
　本コンテンツを右クリックしてソースを表示すれば、その通りに記述していることが確認できるかと思います。

4.　参考サイト

　本ページは、「ChatGPT」くんを参考にさせていただきました。