如何用PHP控制网页对不同用户的可见性

DebugUsery
327 阅读4分钟

如何用PHP控制不同用户可见的网页

不同类别的用户在任何时候都会访问一个网站。然而，一个网站中的一些页面是要由特定的用户来访问的。

例如，由系统管理员访问的网页可能与一般用户可以访问的网页不一样。

在为金融机构以及其他政府部署重要网站时，对特定网页的保护是必要的。

保护某些网页以控制用户访问是很重要的。本文将帮助学习者了解如何在PHP中限制对某些网页的访问。

前提条件

要从本教程中获得更多，你需要

  • HTML、CSS和PHP的基本知识。
  • 一个编辑器，如visual studio code或任何其他你喜欢的编辑器。
  • XAMPP。
  • Bootstrap 5

第1步 - 创建项目文件夹

在你的电脑上，在你的根分区搜索一个叫xampp的文件夹（假设你安装了Xampp）。

打开这个文件夹，然后浏览并找到另一个名为htddocs的目录。在htdocs中，创建另一个文件夹并添加你的项目名称。在本教程中，我将该文件夹命名为fruits-store。

Creating project folder

在fruit-store中，创建另一个目录并命名为css。在CSS里面，插入你下载的Bootstrap文件。

Bootstrap added

第2步 - 确保XAMPP工作正常

双击XAMPP应用程序，启动Apache和MySQL服务。确保这些服务正常运行，没有任何错误。

Xampp working correctly

第3步 - 在你的编辑器中打开项目文件夹

我们现在可以在代码编辑器中打开项目文件夹，如VS代码

Code Editor

第4步 - 创建一个主页

在你的根文件夹中，创建一个名为home.php的新文件。在生成的文件中添加以下代码。

<!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>home page</title>
    <link rel="icon" type="image/x-icon" href="images/logo.jfif">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body>
    <?php include 'nav.php'?>
    <div class="container justify-content-center">
        h3 class="text-center">welcome to our fruit store</h3>
        <h2 class="text-center">we deliver fruits to your doorstep</h2>
    </div>

    <div class="container justify-content-center">
        <div class="row">
            <div class="col-sm-3 m-2 card border-black shadow-lg" style="width:300px">
                <img class="card-img-top" src="images/apple.jpg" alt="Card image">
                <div class="card-body">
                    <h4 class="card-title">Apple</h4>
                    <p class="card-text">Price: $0.5</p>
                    <a href="#" class="btn btn-primary">Order</a>
                </div>
            </div>

            <div class="col-sm-3 m-2 card border-black shadow-lg" style="width:300px">

                <img class="card-img-top" src="images/banana.jpg" alt="Card image">
                <div class="card-body">
                    <h4 class="card-title">Banana</h4>
                    <p class="card-text">Price: $0.3</p>
                    <a href="#" class="btn btn-primary">Order</a>
                </div>
            </div>

            <div class="col-sm-3 m-2 card border-black shadow-lg" style="width:300px">
                <img class="card-img-top" src="images/grape.jpg" alt="Card image">
                <div class="card-body">
                    <h4 class="card-title">Grapes</h4>
                    <p class="card-text">Price: $2.5</p>
                    <a href="#" class="btn btn-primary">Order</a>
                </div>

            </div>

            <div class="col-sm-3 m-2 card border-black shadow-lg" style="width:300px">
                <img class="card-img-top" src="images/strawberry.jpg" alt="Card image">
                <div class="card-body">
                    <h4 class="card-title">Strawberry</h4>
                    <p class="card-text">Price: $5.5</p>
                    <a href="#" class="btn btn-primary">Order</a>
                </div>

            </div>

        </div>

</body>

</html>

第5步 - 创建一个联系页面

创建一个contact.php文件，然后添加以下代码。

<?php 
include 'protect.php';
?>

<!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>Contact us</title>
    <link rel="icon" type="image/x-icon" href="images/logo.jfif">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body>
    <?php include 'nav.php'?>
    <div class="container justify-content-center">
        <div class="row d-flex">
            <div class="col-sm-4">
                <form action="">
                    <h2>send us a massage</h2>
                    <div class="form-group">
                        <label>Name</label>
                        <input type="text" class="form-control mb-4" placeholder="text">
                    </div>
                    <div class="form-group">
                        <label>Subject</label>
                        <input type="text" class="form-control mb-4" placeholder="subject">
                    </div>
                    <div class="form-group">
                        <label>Subject details</label>
                        <input type="text" class="form-control mb-4" placeholder="subject details">
                    </div>
                    <button>submit</button>
                </form>
            </div>
        </div>
    </div>
</body>
</html>

第6步 - 创建一个关于页面

创建一个名为about.php的新文件，然后添加下面的代码。

<?php 
include 'protect.php'
?>

<!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>About us</title>
    <link rel="icon" type="image/x-icon" href="images/logo.jfif">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body>

    <?php include 'nav.php'?>
    <h2 class="text-center">about fruits vendor Ltd</h2>
    <div class="col-sm-9 text-center">
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.Iste quas provident dolorum! Voluptate totam illum
            eum! Fugiat corrupti sint perspiciatis minus neque, cupiditate aperiam
            saepe quisquam asperiores illum itaque autem!</p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.Possimus quas minus autem tenetur neque quos ut sunt
            aliquid
            reprehenderit magni nostrum, dolor culpa dolorum deleniti quidem libero pariatur quam explicabo!
        </p>
    </div>
</body>

</html>

第7步 - 创建一个注册表格

注册表格将用于在数据库中存储用户的信息。当用户想登录系统时，这些信息将被使用。创建一个新文件并命名为register.php。

确保表单动作指向同一文件中的动作，即register.php，表单方法为POST，因为它是发送数据的一种安全方式。

在表单项目中，确保每个项目有一个名称。这在访问数据库时将会很有用。

添加下面的代码到你的register.php文件。

<?PHP
if(isset($_REQUEST["name"]))

{
$name = $_REQUEST["name"];
$email= $_REQUEST["email"];
$phone = $_REQUEST["phone"];
$password = $_REQUEST["password"];
$password = password_hash($password, PASSWORD_BCRYPT);
include 'connect.php';

  $sql = "INSERT INTO `clients`(`id`, `name`, `email`,
`phone`, `password`) VALUES
(null,'$name','$email','$phone','$password')";
  mysqli_query($con,$sql) or die(mysqli_error($con));
  header("location:home.php");
  }
?>
<!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>Register</title>
    <link rel="icon" type="image/x-icon" href="images/logo.jfif">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body>

    <?php include 'nav.php'?>

    <div class="container">
        <div class="row justify-content-center">
            <div class="col-sm-6 border shadow-lg">
                <form action="register.php" method="post" class="mb-5 mt-5 rounded-top rounded-bottom form-group">

                    <div class="mt-5 mb-5 flex-column text-center">
                        <div class="mx-auto d-block">
                            <img src="images/logo.jfif" alt="Logo" style="width: 80px;" class="rounded-pill">
                            <h3>Fruits vendors Ltd</h3>
                        </div>
                        <h4>Registration form</h4>
                    </div>

                    <div class="form-group">
                        <label>Enter Your Name</label>
                        <input type="text" class="form-control mb-4" placeholder="name" name="name" required>
                    </div>
                    <div class="form-group">
                        <label>Enter Your Email</label>
                        <input type="email" class="form-control mb-4" placeholder="email" name="email" required>
                    </div>
                    <div class="form-group">
                        <label>Enter Your Phone Number</label>
                        <input type="tel" class="form-control mb-4" placeholder="phone" name="phone" required>
                    </div>
                    <div class="form-group">
                        <label>Set Password</label>
                        <input type="password" class="form-control mb-4" placeholder="password" name="password" required>
                    </div>
                    <button class="btn btn-block col-sm-4 btn-outline-info btn-control">register</button>
                </form>
            </div>
        </div>
    </div>
</body>

</html>

第8步 - 创建一个数据库

在你的浏览器上输入localhost并导航到phpMyAdmin。接下来，点击新建，然后输入数据库名称，即水果店，然后创建。

Database

在这个数据库中，创建一个表，并将其命名为客户。它应该有以下字段。

Id - (type INT, primary key),
name - (type CHAR, size 50),
email - (type VARCHAR, size 50),
phone - (type VARCHAR, size 30)
password - (type VARCHAR, size 100)

保存客户表后，选择电话和电子邮件字段，并使其成为唯一的。这样做是为了确保同一个电子邮件或电话号码不能属于多个用户。

Unique details

创建一个数据库连接

创建一个新的PHP文件并命名为connect.php。这个文件将帮助我们避免代码的重复，从而节省时间。

创建一个名为con的变量，将用于存储连接。我们还将使用mysqli_connect函数，它需要四个参数，即主机名、用户名、密码和数据库名。

<?php

  $con = mysqli_connect("localhost", "root", "",
"fruits-store") or die(mysqli_connect_error());

?>

第9步 - 创建一个导航栏

导航条起着非常重要的作用，因为它将帮助确定不同用户可见的页面。

创建一个新文件并命名为nav.php。接下来，在生成的文件中添加以下代码。

在所有的页面中包括这个文件，就在你的HTML中的body标签之后。

<nav class="navbar navbar-expand-sm navbar-light bg-info p-2 mb-5">
    <div class="container-fluid">
        <a class="navbar-brand d-block mx-auto text-center" href="home.php">
            <img src="images/logo.jfif" alt="Logo" style="width:80px;" class="rounded-pill">
            <h4 class="vollkorn text-white">fruits vendor Ltd</h4>
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mynavbar">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse m-3" id="mynavbar">

            <ul class="navbar-nav ms-auto px-4">
                <li class="nav-item">
                    <a class="nav-link link-success" href="home.php">Home</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link link-primary" href="contact.php">contact us</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link link-primary" href="about.php">aboutus</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link link-primary" href="register.php">Register</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link link-primary" href="login.php">login.php</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link link-primary" href="logout.php">logout</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

第10步 - 创建一个登录表格

在这一步，我们现在要实现登录，这样它将被用来控制用户的访问。在登录系统之前，某些页面将无法访问，而其他页面甚至在登录系统之前就可以看到。

要开始实现登录表格，请将以下代码粘贴到你的login.php文件中。

<!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>login</title>
    <link rel="icon" type="image/x-icon" href="images/logo.jfif">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
</head>

<body class="bg-light">
    <?php include 'nav.php'?>
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-sm-6 border shadow-lg">
                <div class="mt-5 mb-5 flex-column text-center">
                    <div class="mx-auto d-block">
                        <img src="images/logo.jfif" alt="Logo" style="width: 80px;" class="rounded-pill">
                        <h3 class="vollkorn"> Fruits Vendor Ltd</h3>
                    </div>
                    <h4>Login</h4>

                </div>
                <form action="login.php" method="post" class="mb-5 mt-5 rounded-top rounded-bottom">
                    <div class="form-group">
                        <label>Enter Your Email</label>
                        <input type="email" class="form-control mb-4" placeholder="email" name="email" required>
                    </div>

                    <div class="form-group">
                        <label>Enter Your Password</label>
                        <input type="password" class="form-control mb-4" placeholder="password" name="password"
                            required>
                    </div>

                    <div class="container">
                        <div class="row justify-content-center">
                            <div class="col-sm-6">
                                <button class="btn btn-control btn-outline-info btn-block col-sm-4">login</button>
                            </div>
                            <div class="col-sm-6 d-flex">
                                <p class="float-right">Don't have an account? </p>
                                <a href="register.php" class="signin">register</a>

                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</body>

</html>

第11步 - 实现登录功能

现在，让我们实现登录表单的功能，它将从数据库中获取用户的登录信息，并在允许用户浏览某些网页之前验证其是否正确。

创建一个文件并命名为login.php。在这个文件中，添加下面的代码。

<?php
include 'connect.php';

 if(isset($_REQUEST["password"]))

{

$email = $_REQUEST["email"]; checking and retrieving email
$password = $_REQUEST["password"];

//retrieve one record that matches the email
//check the password hash
//store data in a session
//preparing the query so that hacking the database becomes difficult

$query = mysqli_prepare($con, "SELECT * FROM `clients` WHERE
email = ?");
mysqli_stmt_bind_param($query, "s", $email);
mysqli_stmt_execute($query);
$result = mysqli_stmt_get_result($query);

//checking number of rows that are stored in the result variable
if(mysqli_num_rows($result) == 1){ //counting number of rows in result
   $client = mysqli_fetch_assoc($result);
   $hash = $client["password"]; //retrieving the encrypted password

  if(password_verify($password, $hash)){ /*compare the password that the user provided and the hash password. If the passwords match then the user
can log in. If they do not match then an error message is displayed using
a cookie*/

//storing user information in a session

    session_start();
    $_SESSION["name"] = $customer["name"];
    $_SESSION["id"] = $customer["id"];
    $_SESSION["logged_in"] = true; 
    header("location:home.php");
      //success
  }else{
    //if the number of rows is not one then show this message
    setcookie("error", "wrong username or password", time()+3);
  }

}else{
  //if the password provided by user and hash do not match
  setcookie("error", "wrong username or password", time()+3);
}
}
?>

到此为止，登录应该可以完美运行。

第12步 - 保护文件免受未经授权的访问

创建一个新文件并命名为protect.php。这个文件检查会话是否存在，意味着用户已经登录了。如果没有找到会话，这个文件将把用户重定向到登录页面。

这个文件还可以保护某些页面不被未经授权的用户访问。在这种情况下，如果你没有登录，你就不能访问某个页面。

在protect.php文件中添加下面的代码。

<?php

  session_start();

//checking if the session exists
//if the session is not set it redirects the user to the login form/page

  if(! isset($_SESSION["logged_in"])){
      header("location:login.php");
  }

?>

当我们要保护一个页面时，我们将在你要保护的文件的开头导入/包含这个文件，如下图所示。

<?php include 'protect.php'?>

第13步 - 创建一个注销页面

创建一个logout.php文件，然后添加以下代码。

<?php

session_start();

session_destroy();

header("location:login.php");

第14步 - 隐藏某些网页

我们需要在nav.php文件中加入一个if语句，这将确保用户在没有登录的情况下不能访问某些网页。

假设你已经创建了你的网站所需的所有页面，在我们的例子中，我们有一个主页、登录、注销、注册、联系和关于页面。

我们想让登录、主页和注册页面即使在没有登录到系统的情况下也能被访问。注销、联系和关于页面只有在用户登录后才能看到。

在nav.php文件中，contact.php，about.php和logout.php应该包含一个if语句，它将检查会话["logged_in"]是否存在。如果它存在，这些页面将被访问。

<?php if (isset($_SESSION["logged_in"])): ?>

        <li class="nav-item">
          <a class="nav-link link-primary" href="contact.php">contact us</a>
        </li>

        <li class="nav-item">
          <a class="nav-link link-primary" href="about.php">about us</a>
        </li>

        <li class="nav-item">
          <a class="nav-link link-primary" href="logout.php">logout</a>
        </li>
<?php 
endif; 
?>

此外，如果会话没有设置，我们将引导用户到login.php页面。修改login.php下的nav.php，将其包围在一个if语句中，如下所示。

<?php if (! isset($_SESSION["logged_in"])): ?>
    <li class="nav-item">
       <a class="nav-link link-primary" href="login.php">login</a>
    </li>
<?php endif; ?>

结语

在本教程中，我们学习了如何使用PHP来控制对特定页面的访问。通过$SESSION对象，我们可以监控用户在各网站的互动。因此，我们可以确定他们是否已经登录，从而调用适当的动作。

因此，你可以利用这些知识来制作其他漂亮而高质量的应用程序。

avatar
文章
阅读
粉丝