<form action="">

  <div>

  <label for="answer">パスワード</label>

  <input class="ipw" type="text" id="answer-txt" placeholder="Password" required>

  </div>

  <input type="hidden" id="answer-key" value="暗号化キー" />

  <input class="btn" type="button" id="answer-btn" onclick="answerCheck()" value="ログイン" />

</form>

<p id="result"></p>

<style>

form {

  margin:auto;

  width: 190px;

  background-color: white;

  padding: 12px 15px 20px 15px;

  text-align: center;

  border: 1px solid steelblue;

  border-radius: 2px;

}

label {

  display: block;

  text-align: left;

  margin-left: 15px;

}

.ipw {

  width: 160px;

  height: 30px;

  background-color: white;

  border: 1px solid steelblue;

  border-radius: 2px;

  outline: none;

  font-size: 13px; 

  text-align: center;

  margin-top: 5px;

  margin-bottom: 10px;

}

.ipw:focus { 

  outline: 1px solid steelblue;

}

.btn {

  /*　blockをinlineに変えればパスワード入力欄とボタン横並び配置（横幅を調整する必要あり）　*/

  display: block;

  /*　ボタン位置決め（調整）auto auto は中央配置　*/

  /*　ボタン位置決め（調整）left で調整しても right で調整してもOK　*/

  margin-left: auto; 

  margin-right: auto; 

  width: 160px;

  height: 30px;

  background-color: ;

  border: 1px solid steelblue;

  border-radius: 2px;

  font-size: 14px;

  color: #2E5779;  

}

.btn:hover {

  background-color: steelblue;

  color: white;

  opacity: 0.7;

}

p {

  text-align: center;

}

</style>

<script>

  function xor(buf1, buf2) {

    var xorResult = new Uint8Array(buf1.byteLength);

    var bufView1 = new Uint8Array(buf1);

    var bufView2 = new Uint8Array(buf2);

    for (var i = 0; i < buf1.byteLength; i++) {

      xorResult[i] = bufView1[i] ^ bufView2[i % buf2.byteLength];

    }

    return xorResult.buffer;

  }

  function base64ToUint8Array(base64) {

    const binaryString = atob(base64);

    const len = binaryString.length;

    const bytes = new Uint8Array(len);

    for (let i = 0; i < len; i++) {

      bytes[i] = binaryString.charCodeAt(i);

    }

    return bytes;

  }

  function answerCheck() {

    const decoder = new TextDecoder();

    const encoder = new TextEncoder();

    let ansTxt = document.getElementById("answer-txt").value;

    let ansKey = document.getElementById("answer-key").value;

    try {

      var xorResultFromBase64 = base64ToUint8Array(ansKey);

      var buf2 = encoder.encode(ansTxt);

      const xorBuffer = xor(xorResultFromBase64, buf2);

      const xorResult = decoder.decode(xorBuffer);

      const result = JSON.parse(xorResult);

      if (result.key === ansTxt) {

        document.getElementById("result").innerHTML = `<a href="${result.url}">${result.url}</a>`;

      } else {

        document.getElementById("result").innerHTML = 'パスワードが違います'

      }

    } catch (error) {

      document.getElementById("result").innerHTML = 'パスワードが違います';

      console.error(error);

    }

  }

</script>