걸레이튼 블록 높이 계산기
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>걸레이튼 블록 높이 계산기</title> <style> * { box-sizing: border-box; margin: 0; padding: 0; } .page-title {visibility: hidden;} .container { text-align: center; padding: 20px; background: #2e2f30; border-radius: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); width: 80%; } h1 { margin-bottom: 20px; } input, button { padding: 10px; background-color: #3f4041; border: none; border-radius: 3px; color: #e5e5e5; font-weight: 500; } input { margin-bottom: 20px; width: 80%; height: 45px; } button { cursor: pointer; width: 100%; margin-top: 10px; width: 80px; height: 45px; } button:hover { background: #575859; } @font-face { font-family: 'D2Coding'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_three@1.0/D2Coding.woff') format('woff'); font-weight: normal; font-style: normal; } body{font-family: 'D2Coding'; font-weight: 300;} </style> <script> const accessKeyId = "KASKHZRGOENSFT8OO9EKO7MA"; const secretAccessKey = "t_yRTcXq-Fy1PHRyJW8OepjxJDEraoJGYGvvPSq-"; const headers = { Authorization: "Basic " + btoa(accessKeyId + ":" + secretAccessKey), "x-chain-id": "8217", "Content-Type": "application/json", }; async function fetchBlockHeight() { const dateElem = document.getElementById("date"); const targetDate = new Date(dateElem.value); const now = new Date(); const secondsDiff = (now - targetDate) / 1000; const avgBlockTime = 1; const currentBlockNumber = await getCurrentBlockNumber(); const blockHeight = currentBlockNumber - Math.floor(secondsDiff / avgBlockTime); alert(`Block Height at ${targetDate.toLocaleString()} is: ${blockHeight}`); } async function getCurrentBlockNumber() { const response = await fetch("https://node-api.klaytnapi.com/v1/klaytn", { headers: headers, method: "POST", body: JSON.stringify({ jsonrpc: "2.0", id: 1, method: "klay_blockNumber", params: [], }), }); const data = await response.json(); if (!data.result) { throw new Error("Failed to get block number"); } return data.result; } </script> </head> <body> <div class="container"> <h1>🧹걸레이튼 블록 높이 계산기</h1> <input id="date" type="datetime-local"> <button onclick="fetchBlockHeight()">확인</button> </div> </body> </html>
.png&blockId=1c1a8354-0b35-4630-a03c-f55fa2ae5e02&width=256)
.png%26blockId%3D0dbfa3b9-c7a0-494e-b671-19b39a9419a4%26width%3D2400&blockId=3e8d1b52-e1cb-40b1-b755-f2ae8ee71b07&width=512)
.png&blockId=ac792742-ed53-4192-a9c0-c1e0d01e4d61)
배경
.png&blockId=c2fbe78c-f1bb-427e-a4f9-1a1697f3c9e2)
.png&blockId=8f31114a-fe75-4244-a514-351ebf656748)
.png&blockId=02940ace-d79d-459e-ba01-ade75024e0b4)
.png&blockId=1612d323-1279-458d-a353-e50c0d163844)
.png&blockId=7961f3c4-2598-4879-859c-c0575b48b4a1)
.png&blockId=6465a919-86ec-4e5b-a219-00a523f33272)
.png&blockId=a51b688a-d805-4894-b952-89e37593f85a)
.png&blockId=e6eb23f3-8315-4d39-b950-a742005c84b1)
.png&blockId=04243a0b-03b9-41f9-9db3-e9c1f70d7eee)