Can register Authenticator app

This commit is contained in:
2022-04-19 11:01:31 +02:00
parent 18353f0639
commit 65b5c812b1
6 changed files with 186 additions and 19 deletions

View File

@ -21,23 +21,83 @@
<p>Once you have scanned the QrCode, please generate a code and type it below:</p>
<div class="form-group">
<label for="inputDevName" class="form-label mt-4">Device name</label>
<input type="text" class="form-control" id="inputDevName" aria-describedby="emailHelp" placeholder="Enter email"
value="Authenticator app">
<small class="form-text text-muted">Please give a name to your device to identity it more easily later.</small>
</div>
<form id="validateForm" method="post">
<input type="hidden" name="secret" id="secretInput" value="{{ secret_key }}"/>
<div class="form-group">
<label for="inputFirstCode" class="form-label mt-4">First code</label>
<input type="text" class="form-control" id="inputFirstCode" aria-describedby="emailHelp" placeholder="XXXXXX"
maxlength="6"/>
<small class="form-text text-muted">Check that your authenticator app is working correctly by typing a first
code.</small>
</div>
<div class="form-group">
<label for="inputDevName" class="form-label mt-4">Device name</label>
<input type="text" class="form-control" id="inputDevName"
placeholder="Device / Authenticator app name"
value="Authenticator app" minlength="1" required/>
<small class="form-text text-muted">Please give a name to your device to identity it more easily
later.</small>
<div class="invalid-feedback">Please give a name to this authenticator app</div>
</div>
<div class="form-group">
<label for="inputFirstCode" class="form-label mt-4">First code</label>
<input type="text" class="form-control" id="inputFirstCode"
placeholder="XXXXXX"
maxlength="6" minlength="6" required/>
<small class="form-text text-muted">Check that your authenticator app is working correctly by typing a first
code.</small>
<div class="invalid-feedback">Please enter a first code (must have 6 digits)</div>
</div>
<input type="submit" value="Register app" class="btn btn-primary">
</form>
<script src="/assets/js/clipboard_utils.js"></script>
<script>
const form = document.getElementById("validateForm");
form.addEventListener("submit", async (e) => {
e.preventDefault();
const secret = document.getElementById("secretInput").value;
const factorNameInput = document.getElementById("inputDevName");
const firstCodeInput = document.getElementById("inputFirstCode");
let fail = false;
factorNameInput.classList.remove("is-invalid");
if (factorNameInput.value.length === 0) {
fail = true;
factorNameInput.classList.add("is-invalid");
}
firstCodeInput.classList.remove("is-invalid");
if (firstCodeInput.value.length != 6) {
fail = true;
firstCodeInput.classList.add("is-invalid");
}
if (fail)
return;
try {
const res = await fetch("/settings/api/two_factors/save_totp_key", {
method: "post",
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
factor_name: factorNameInput.value,
secret: secret,
first_code: firstCodeInput.value,
})
});
let text = await res.text();
alert(text);
if (res.status == 200)
location.href = "/settings/two_factors";
} catch(e) {
console.error(e);
alert("Failed to register authenticator app!");
}
});
</script>
</div>
{% endblock content %}