英文:
why php always display after login sucessful?
问题
To fix the issue and pass the loginSuccess variable from your PHP code to your HTML, you can use PHP to generate JavaScript code within your HTML file. Here's how you can modify your home.html file to achieve this:
<!DOCTYPE html>
<html lang="en">
<head>
<!-- ... (your existing head content) ... -->
</head>
<body>
<header>
<!-- ... (your existing header content) ... -->
</header>
<div class="wrapper">
<!-- ... (your existing wrapper content) ... -->
</div>
<script>
<?php
echo "var loginSuccess = " . ($loginSuccess ? 'true' : 'false') . ";";
?>
$(document).ready(function() {
if (loginSuccess) {
$('#welcome').show();
$('#loginForm').hide();
} else {
$('#welcome').hide();
$('#loginForm').show();
}
});
</script>
<div class="opening" id="openingSection">
<!-- ... (your existing opening content) ... -->
</div>
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
</body>
</html>
With this modification, the loginSuccess variable will be passed from your PHP code to the JavaScript code in your HTML, allowing you to control the visibility of the welcome and loginForm elements based on the value of loginSuccess.
英文:
here's my login.php file, i want to make this $loginSucess only give variable to home.html instead showing the login php (which is turned to be blank page after sucessfully login)
<?php
$email = $_POST['email'];
$password = $_POST['password'];
$otp_code = intval($_POST['otp_code']);
$passwordMismatch = false;
$loginSuccess = false;
// Database configuration
$host = 'localhost';
$dbName = '-';
$username = '-';
$dbPassword = '-';
// Create a database connection
$con = new mysqli($host, $username, $dbPassword, $dbName);
// Check if the connection was successful
if ($con->connect_error) {
die("Database connection failed: " . $con->connect_error);
} else {
$stmt = $con->prepare("SELECT * FROM account_identity WHERE email=?");
$stmt->bind_param("s", $email);
$stmt->execute();
$stmt_result = $stmt->get_result();
if($stmt_result->num_rows > 0) {
$data = $stmt_result->fetch_assoc();
if($data['password'] === $password && $data['otp_code'] === $otp_code) {
$loginSuccess = true;
} else {
$passwordMismatch = true;
}
} else {
$passwordMismatch = true;
}
}
?>
and here's my home.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<title>Arcane City Roleplay</title>
<link rel="stylesheet" href="css/style.css">
<link rel="icon" href="images/logo.png" type="image/x-icon">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="script/script.js" defer></script>
</head>
<body>
<header>
<h2 class="logo">ARCANE CITY</h2>
<nav class="navigation">
<a href="home.html">Home</a>
<a href="#">Statistics</a>
<a href="#">Gallery</a>
<a href="#">Donate</a>
<a href="#">Status</a>
<a href="#">About Us</a>
<button class="btnLogin-popup" onclick="toggleLogin()">Login</button>
</nav>
</header>
<div class="wrapper">
<span class="icon-close" onclick="toggleSections()">
<ion-icon name="close"></ion-icon>
</span>
<div class="form-box login" id="loginForm">
<h2>Login</h2>
<form action="login.php" method="post">
<div class="input-box">
<span class="icon"><ion-icon
name="mail"></ion-icon></span>
<input type="email" id="email" name="email" required>
<label>Email</label>
</div>
<div class="input-box">
<span class="icon"><ion-icon
name="lock-closed"></ion-icon></span>
<input type="password" id="password" name="password" required>
<label>Password</label>
</div>
<div class="remember">
<label><input type="checkbox">
Remember me?</label>
</div>
<div class="input-box">
<input type="text" id="otp_code" name="otp_code" pattern="[0-9]{4}" maxlength="4" required>
<label>OTP</label>
</div>
<button type="submit" value="Login" name="login" class="btn">Login</button>
<div class="login-register">
<p>Don't have an account? <a href="#" class="register-link">Register
</a></p>
</div>
</form>
</div>
<div class="form-box welcome" id="welcome">
<h2>Welcome Back</h2>
</div>
</div>
<script>
$(document).ready(function() {
var loginSuccess = <?php echo ($loginSuccess ? 'true' : 'false'); ?>;
if (loginSuccess) {
$('#welcome').show();
$('#loginForm').hide();
} else {
$('#welcome').hide();
$('#loginForm').show();
}
});
</script>
<div class="opening" id="openingSection">
<h1>ARCANE CITY</h1>
<h2>GTA 5 ROLEPLAY</h2>
<button class="btnConnect" onclick="window.location.href='https://www.wikipedia.org';">CONNECT TO SERVER</button>
</div>
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
</body>
</html>
how to fix this issues? just to let variable run and give variable back to the html instead showing php file
答案1
得分: 2
为了实现将$loginSuccess变量传递回home.html文件，而不是显示login.php文件的期望行为，您可以使用会话变量。
- 在您的
login.php文件中，在向浏览器发送任何输出之前添加以下代码来启动会话：
session_start();
- 使用
$_SESSION超全局变量将$loginSuccess的值设置为会话变量。将$loginSuccess = true;这一行替换为：
$_SESSION['loginSuccess'] = true;
- 在成功登录后将用户重定向回
home.html文件。在设置会话变量后添加以下代码：
header("Location: home.html");
exit();
-
在
home.html文件中，删除检查loginSuccess值的PHP代码，因为我们现在将从会话变量中检索它。 -
在
home.html中的<script>标签中，更新代码以从会话变量中检索loginSuccess的值，并根据该值显示/隐藏适当的部分。将现有的JavaScript代码替换为以下内容：
$(document).ready(function() {
var loginSuccess = <?php echo (isset($_SESSION['loginSuccess']) && $_SESSION['loginSuccess']) ? 'true' : 'false'; ?>;
if (loginSuccess) {
$('#welcome').show();
$('#loginForm').hide();
} else {
$('#welcome').hide();
$('#loginForm').show();
}
});
通过这些更新，当登录成功时，login.php文件将设置loginSuccess会话变量并将用户重定向回home.html。然后，在home.html中，JavaScript代码将从会话变量中检索loginSuccess的值，并根据该值显示/隐藏适当的部分。
英文:
To achieve the desired behavior of passing the $loginSuccess variable back to the home.html file instead of displaying the login.php file, you can make use of session variables.
- In your
login.phpfile, start a session by adding the following code before any output is sent to the browser:
session_start();
- Set the value of
$loginSuccessas a session variable using the$_SESSIONsuperglobal. Replace the line$loginSuccess = true;with:
$_SESSION['loginSuccess'] = true;
- Redirect the user back to the
home.htmlfile after successful login. Add the following code after setting the session variable:
header("Location: home.html");
exit();
-
In the
home.htmlfile, remove the PHP code that checks the value ofloginSuccessas we will now retrieve it from the session variable. -
Inside the
<script>tag inhome.html, update the code to retrieve theloginSuccessvalue from the session variable and show/hide the appropriate sections based on the value. Replace the existing JavaScript code with the following:
$(document).ready(function() {
var loginSuccess = <?php echo (isset($_SESSION['loginSuccess']) && $_SESSION['loginSuccess']) ? 'true' : 'false'; ?>;
if (loginSuccess) {
$('#welcome').show();
$('#loginForm').hide();
} else {
$('#welcome').hide();
$('#loginForm').show();
}
});
With these updates, when the login is successful, the login.php file will set the loginSuccess session variable and redirect the user back to home.html. Then, in home.html, the JavaScript code will retrieve the value of loginSuccess from the session variable and show/hide the appropriate sections accordingly.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论