adding qr code on 2fa

This commit is contained in:
2025-03-31 16:14:55 +00:00
parent 2cd72172e8
commit 025219f9ec
2 changed files with 45 additions and 3 deletions

View File

@@ -17,6 +17,7 @@ if (!isset($_SESSION["logged_in"]) || $_SESSION["logged_in"] !== true) {
<?php <?php
include "../assets/components.php"; include "../assets/components.php";
?> ?>
<script src="https://cdn.rawgit.com/davidshimjs/qrcodejs/gh-pages/qrcode.min.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <!-- Google Material Icons --> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> <!-- Google Material Icons -->
</head> </head>
<body> <body>
@@ -177,6 +178,25 @@ if (!isset($_SESSION["logged_in"]) || $_SESSION["logged_in"] !== true) {
</div> </div>
</div> </div>
<!-- twofa Modal -->
<div class="modal fade" id="twofaModal" tabindex="-1" aria-labelledby="twofaModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="twofaModalLabel">Success</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body" id="twofaModalMessage">
<!-- Success message will go here -->
</div>
<div id="qrcode"></div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Success Modal --> <!-- Success Modal -->
<div class="modal fade" id="successModal" tabindex="-1" aria-labelledby="successModalLabel" aria-hidden="true"> <div class="modal fade" id="successModal" tabindex="-1" aria-labelledby="successModalLabel" aria-hidden="true">
<div class="modal-dialog"> <div class="modal-dialog">
@@ -335,7 +355,11 @@ if (!isset($_SESSION["logged_in"]) || $_SESSION["logged_in"] !== true) {
const result = await response.json(); const result = await response.json();
if (response.ok) { if (response.ok) {
// Handle success // Handle success
if(isEnabled==false){
showSuccessModal(result.message || (isEnabled ? '2FA enabled successfully.' : '2FA disabled successfully.')); showSuccessModal(result.message || (isEnabled ? '2FA enabled successfully.' : '2FA disabled successfully.'));
}else{
show2FaModal(result.message, result.token);
}
} else { } else {
// Handle error // Handle error
showErrorModal('Error: ' + (result.message || 'An error occurred while updating 2FA.')); showErrorModal('Error: ' + (result.message || 'An error occurred while updating 2FA.'));
@@ -394,6 +418,24 @@ if (!isset($_SESSION["logged_in"]) || $_SESSION["logged_in"] !== true) {
document.getElementById('successModalMessage').textContent = message; document.getElementById('successModalMessage').textContent = message;
const errorModal = new bootstrap.Modal(document.getElementById('successModal')); const errorModal = new bootstrap.Modal(document.getElementById('successModal'));
errorModal.show(); errorModal.show();
}
function show2FaModal(message,secret) {
document.getElementById('twofaModalMessage').textContent = message;
const errorModal = new bootstrap.Modal(document.getElementById('twofaModal'));
generate2FAQRCode("Jakach Login",'<?php echo($_SESSION["username"]) ?>',secret);
errorModal.show();
}
function generate2FAQRCode(issuer, accountName, secret) {
// Create the OTP URI
const uri = `otpauth://totp/${encodeURIComponent(issuer)}:${encodeURIComponent(accountName)}?secret=${secret}&issuer=${encodeURIComponent(issuer)}`;
// Use qrcode.js to generate and display the QR code
new QRCode(document.getElementById("qrcode"), {
text: uri,
width: 300,
height: 300
});
} }
//webauthn js //webauthn js

View File

@@ -41,7 +41,7 @@ if($data->enable_2fa==true){
if ($update_stmt = $conn->prepare($sql)) { if ($update_stmt = $conn->prepare($sql)) {
$update_stmt->bind_param("si", $twofa_secret, $id); $update_stmt->bind_param("si", $twofa_secret, $id);
if ($update_stmt->execute()) { if ($update_stmt->execute()) {
echo json_encode(['success' => true, 'message' => '2FA enabled. Your 2fa secret is: '.$twofa_secret.'']); echo json_encode(['success' => true, 'message' => '2FA enabled. Your 2fa secret is: '.$twofa_secret.'', 'token' => $twofa_secret]);
} else { } else {
echo json_encode(['success' => false, 'message' => 'Failed to enable 2fa.']); echo json_encode(['success' => false, 'message' => 'Failed to enable 2fa.']);
} }