如何在html中爲登錄頁面創建會話

-1

我們正在製作一個基於學生記錄的項目，我們想創建一個登錄頁面，但我們不知道如何在html中創建會話。如何在html中爲登錄頁面創建會話

我們嘗試使用表單進行登錄頁面，然後將該頁面導向下一頁，現在我們要在項目中實施會話。

任何幫助應是有益的

2017-07-03 pankaj meel

這裏看看我過去的小項目中使用的代碼使其工作像你想有三個文件的PHP文件的會話，登錄頁面和登錄，檢查文件。正如上面在評論中所說的，你不能使用HTML作爲會話，你需要PHP，我在下面的代碼中使用它。但是，您可以瞭解我在下面提供的內容。

PHP文件爲會話。

<?php 

     //Start session 
     session_start(); 

      //Check whether the session variable SESS_MEMBER_ID is present or not 
      if (!isset($_SESSION['login_ID']) || (trim($_SESSION['login_ID']) == '')) 
       { 
        header("location: login.php"); 
        exit(); 
       } 

      $session_id=$_SESSION['login_ID']; 

?>

登錄頁面

<?php session_start(); 
include('logincheck.php');?> 

<!DOCTYPE html PUBLIC "-//W3C/DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <link rel="stylesheet" type="text/css" href="css/style.css" /> 
     <title>Login Page</title> 
    </head> 
<body> 
    <div class="form-wrapper"> 

     <form action="" method="post"> 

      <div class="form_title"> 
       <img src="img/form_title.gif" alt="Member Login" /> 
      </div> 

      <div class="form-item"> 
       <input type="text" name="user" required="required" placeholder="Username" autofocus required></input> 
      </div> 

      <div class="form-item"> 
       <input type="password" name="pass" required="required" placeholder="Password" required></input> 
      </div> 

      <div class="button-panel"> 
       <input type="submit" class="button" title="Log In" name="login" value="Login"></input> 
      </div> 

     </form> 
     <!--This is commented out because there is no sign up at the moment and forgot password--> 
     <!-- <div class="reminder"> 
     //<p>Not a member? <a href="#">Sign up now</a></p> 
     //<p><a href="#">Forgot password?</a></p> 
     </div> --> 
    </div> 

</body> 
</html>

登錄檢查文件

<?php 
    include('dbcon.php'); 

    if (isset($_POST['login'])) 
     { 
      $username = mysqli_real_escape_string($con, $_POST['user']); 
      $password = mysqli_real_escape_string($con, $_POST['pass']); 

       $query = mysqli_query($con, "SELECT * FROM users_login WHERE userName='$username' and password='$password'"); 
       $row = mysqli_fetch_array($query); 
       $num_row = mysqli_num_rows($query); 

        if ($num_row > 0) 
         {   
          $_SESSION['login_ID']=$row['login_ID']; 

           if($_SESSION['login_ID'] == 2 || $_SESSION['login_ID'] == 3 || $_SESSION['login_ID'] == 4 || $_SESSION['login_ID'] == 5) 
           { 
            header('location: Admin_Page.php'); 
           } 
           else 
           { 
            header('location: home.php'); 
           } 
         } 
        else 
         { 
          echo '<h2 style="color:black;">Invalid Username and or Password Combination</h2>'; 
         } 
     } 

    ?>

希望這有助於。

來源

2017-07-03 05:16:09

什麼是反對票。 –

這裏沒有PHP，對吧？這只是純粹的客戶端HTML。 –

是的，有。 :) –

您可能無法創建服務器端會話，但可以執行客戶端會話存儲，但請注意，它可能很容易被篡改。你應該有一個現代的瀏覽器：

if (typeof(Storage) !== "undefined") { 
    // Code for localStorage/sessionStorage. 
} else { 
    // Sorry! No Web Storage support.. 
}

現在有了上面的代碼，你可以使用會話存儲用於存儲的登錄信息。

if (typeof(Storage) !== "undefined") { 
 
    // Code for localStorage/sessionStorage. 
 
    if (localStorage.getItem("user") != "") { 
 
    document.getElementById("login").style.display = "none"; 
 
    document.getElementById("loggedInUser").innerHTML = localStorage.getItem("user"); 
 
    document.getElementById("welcome").style.display = "none"; 
 
    } 
 
} else { 
 
    // Sorry! No Web Storage support.. 
 
} 
 

 
function login() { 
 
    var user = prompt("Enter Username"); 
 
    var pass = prompt("Enter Password"); 
 
    if (user = "admin" && pass == "letmein") { 
 
    alert("Success"); 
 
    loginUser(user); 
 
    } else { 
 
    alert("Wrong Credentials"); 
 
    logoutUser(); 
 
    } 
 
    return false; 
 
} 
 

 
function loginUser(user) { 
 
    if (typeof(Storage) !== "undefined") { 
 
    // Code for localStorage/sessionStorage. 
 
    localStorage.setItem("user", user); 
 
    document.getElementById("login").style.display = "none"; 
 
    document.getElementById("loggedInUser").innerHTML = user; 
 
    document.getElementById("welcome").style.display = "block"; 
 
    } else { 
 
    // Sorry! No Web Storage support.. 
 
    } 
 
} 
 

 
function logoutUser() { 
 
    if (typeof(Storage) !== "undefined") { 
 
    // Code for localStorage/sessionStorage. 
 
    localStorage.setItem("user", ""); 
 
    document.getElementById("login").style.display = "block"; 
 
    document.getElementById("loggedInUser").innerHTML = ""; 
 
    document.getElementById("welcome").style.display = "none"; 
 
    } else { 
 
    // Sorry! No Web Storage support.. 
 
    } 
 
}

<div id="login"> 
 
    Please login. <a href="#" onclick="return login();">Login</a> 
 
</div> 
 
<div id="welcome"> 
 
    Welcome <span id="loggedInUser"></span> 
 
</div>

由於StackSnippets不允許本地存儲，請JSBin。

來源

2017-07-03 05:25:40

創建HTML會話存儲之前，請檢查瀏覽器是否支持會話。這是因爲不同的瀏覽器非常重要的具有不同的兼容性

if (typeof(Storage) !== "undefined") { 
    // Code for localStorage/sessionStorage. 
} else { 
    // Sorry! No Web Storage support.. 
}

然後使用HTML存儲這樣

// Store 
localStorage.setItem("username", "John"); 
// Retrieve 
localStorage.getItem("lastname");

使用此功能可以清除存儲

localStorage.clear();

此外，您可以使用jQuery會話存儲這也是客戶端存儲

// Save data to sessionStorage 
sessionStorage.setItem('key', 'value'); 

// Get saved data from sessionStorage 
var data = sessionStorage.getItem('key'); 

// Remove saved data from sessionStorage 
sessionStorage.removeItem('key'); 

// Remove all saved data from sessionStorage 
sessionStorage.clear();

來源

2017-07-03 05:36:44 karthik006

如何在html中爲登錄頁面創建會話

回答

相關問題