JavaScriptでUUIDを生成する方法を紹介します。
JavaScriptでUUIDを生成したい場合はcrypto.randomUUID() メソッドを呼び出すと、UUIDでよく使われる (8桁)-(4桁)-(4桁)-(4桁)-(12桁)のUUIDを作成できます。
randomUUID メソッドが利用できない場合や使いたくない場合は、乱数を生成してUUIDを作成することもできます。
または、https://github.com/LiosK/UUID.js ライブラリを利用する方法もあります。
以下のコードを記述します。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
window.onload = function onLoad() {
var uuid = crypto.randomUUID();
target = document.getElementById("output");
target.innerHTML = uuid;
}
</script></head>
<body>
<div id="output"></div>
</body>
</html>
crypto.randomUUID() メソッドで16進数表記の(8桁)-(4桁)-(4桁)-(4桁)-(12桁)のUUIDを作成できます。
var uuid = crypto.randomUUID();
上記のHTMLファイルをWebブラウザで表示すると下図の画面が表示されます。UUIDが生成され画面に表示されています。
以下のコードを記述します。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript">
window.onload = function onLoad() {
var uuid = (function () {
var S4 = function () {
return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
}
return (S4() + S4() + "-" + S4() + "-" + S4() + "-" + S4() + "-" + S4() + S4() + S4());
})();
target = document.getElementById("output");
target.innerHTML = uuid;
}
</script>
</head>
<body>
<div id="output"></div>
</body>
</html>
上記のHTMLファイルをWebブラウザで表示すると下図の画面が表示されます。UUIDが生成され画面に表示されています。
https://github.com/LiosK/UUID.jsのUUID生成ライブラリを用いてUUIDを生成できます。
ダウンロードしたライブラリファイル"uuid.js", "uuid.core.jp"はuuidフォルダ内に配置しました。
以下のコードを記述します。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript" src="uuid/uuid.js"></script>
<script type="text/javascript">
window.onload = function onLoad() {
var id = UUID.generate()
target = document.getElementById("output");
target.innerHTML = id;
}
</script></head>
<body>
<div id="output"></div>
</body>
</html>
上記のHTMLファイルをWebブラウザで表示すると下図の画面が表示されます。UUIDが生成され画面に表示されます。
