JSFiddle - React, Tailwind, and code Playground

by ph822720355

HTML

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta charset="UTF-8">
  <title>URL Token 產生器</title>
  <!-- 載入 CryptoJS CDN -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
  <script>
    /**
     * AES 加密函式
     * 使用固定的 key 與 iv 進行 CBC 模式加密
     * @param {string} payload - 要加密的字串
     * @returns {string} - 加密後的字串 (Base64 格式)
     */
    function stringAddAES(payload) {
      // 轉換金鑰與初始向量
      let key = CryptoJS.enc.Utf8.parse('jjuyobohdjjjugztodezdezepiwspjgo');
      let iv = CryptoJS.enc.Utf8.parse('jjuyobohdjjjugzj');
      // 將輸入字串轉成 WordArray
      let srcs = CryptoJS.enc.Utf8.parse(payload);
      // 執行 AES CBC 模式加密，使用 Pkcs7 padding
      let encrypted = CryptoJS.AES.encrypt(srcs, key, { iv: iv, mode: CryptoJS.mode.CBC, padding: CryptoJS.pad.Pkcs7 });
      return encrypted.toString();
    }

    /**
     * 產生 URL Token
     * 組合 serverKey 與當前時間戳記，並利用 AES 加密，再以 Base64 格式回傳
     * @param {string} serverKey - 使用者輸入的 ServerKey
     * @returns {string} - 加密後的 UrlToken
     */
    function getUrlToken(serverKey) {
      // 組合 payload：ServerKey 與當前時間戳記
      let payload = serverKey + '&' + new Date().getTime();
      // 執行 AES 加密
      let encryptPayload = stringAddAES(payload);
      // 將加密後的字串轉成 Utf8 的 WordArray
      var wordArray = CryptoJS.enc.Utf8.parse(encryptPayload);
      // 轉換成 Base64 編碼
      var base64 = CryptoJS.enc.Base64.stringify(wordArray);
      return base64;
    }

    /**
     * 讀取頁面上輸入的 ServerKey 並顯示產生的 UrlToken
     */
    function generateToken() {
      var serverKey = document.getElementById('serverKey').value;
      if (serverKey.trim() === "") {
        alert("請輸入 ServerKey");
        return;
      }
      var token = getUrlToken(serverKey);
      document.getElementById('urlToken').innerText = token;
    }
  </script>
</head>
<body>
  <h1>URL Token 產生器</h1>
  <label for="serverKey">請輸入 ServerKey：</label>
  <input type="text" id="serverKey" placeholder="輸入 ServerKey">
  <button...