80 lines
2.6 KiB
HTML
80 lines
2.6 KiB
HTML
<style>
|
|
</style>
|
|
|
|
<h2>Two-Factor Authentication</h2>
|
|
|
|
<p>Two-factor authentication (2FA) is <i>something you know</i> and <i>something you have</i>.</p>
|
|
|
|
<p>Regular password-based logins are one-factor (something you know). 2FA makes an account more secure by guarding against a lost or guessed password, since you also need a special device to access your account. You can turn on 2FA for your account here.</p>
|
|
|
|
<p>Your authentication method is currently: <strong id="2fa_current"> </strong></p>
|
|
|
|
<h3>TOTP</h3>
|
|
|
|
<p>TOTP is a time-based one-time password method of two-factor authentication.</p>
|
|
|
|
<p>You will need a TOTP-compatible device, such as any Android device with the <a href="https://play.google.com/store/apps/details?id=org.fedorahosted.freeotp">FreeOTP Authenticator</a> app. We’ll generate a QR code that you import into your device or app. After you generate the QR code, you’ll activate 2FA by entering your first activation code provided by your device or app.</p>
|
|
|
|
<p><button onclick="totp_initialize()">Generate QR Code</button></p>
|
|
<div id="totp-form" class="row" style="display: none">
|
|
<div class="col-sm-6">
|
|
<center>QR Code</center>
|
|
<img id="totp_qr_code" src="" class="img-responsive">
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<form class="form" role="form" onsubmit="totp_activate(); return false;">
|
|
<div class="form-group">
|
|
<label for="inputTOTP" class="control-label">Activation Code</label>
|
|
<p><input class="form-control" id="inputTOTP" placeholder="enter 6-digit code"></p>
|
|
<p><input type="submit" class="btn btn-primary" value="Activate"></p>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|
|
<p>When using TOTP 2FA, your password becomes your previous plain password plus a space plus the code generated by your TOTP device.</p>
|
|
|
|
<script>
|
|
function show_2fa() {
|
|
$('#2fa_current').text('loading...');
|
|
api(
|
|
"/me/2fa",
|
|
"GET",
|
|
{
|
|
},
|
|
function(response) {
|
|
$('#2fa_current').text(response.method);
|
|
});
|
|
}
|
|
|
|
var secret = null;
|
|
|
|
function totp_initialize() {
|
|
api(
|
|
"/me/2fa/totp/initialize",
|
|
"POST",
|
|
{
|
|
},
|
|
function(response) {
|
|
$('#totp_qr_code').attr('src', 'data:image/png;base64,' + response.qr);
|
|
$('#totp-form').fadeIn();
|
|
secret = response.secret;
|
|
});
|
|
}
|
|
|
|
function totp_activate() {
|
|
api(
|
|
"/me/2fa/totp/activate",
|
|
"POST",
|
|
{
|
|
"secret": secret,
|
|
"code": $('#inputTOTP').val()
|
|
},
|
|
function(response) {
|
|
show_modal_error("Two-Factor Authentication", $("<pre/>").text(response.message));
|
|
if (response.status == "OK")
|
|
$('#totp-form').fadeOut();
|
|
});
|
|
}
|
|
</script>
|