PHP入门——架向后端之桥（1.登录系统实现）

PHP在由前端迈向后端的过程中，由于其上手简单，且内嵌于HTML与JQuery的体系之中，可以很好地起到对于原理的理解作用，下面以一个登录系统做例子，通过代码来初步理解前后端链接的运行原理。

---

在阅读代码前，我们先来分析登录功能是如何实现的：

1. 显然，我们在HTML页面上拥有一个Form表单，该表单的提交方法（method）为POST，且指向该PHP文件（action=“Login.php”），点击提交（submit）后，数据将被传输至该PHP文件中；

2. 通过PHP的$_POST可以直接从Form表单中获取提交而来的数据，并通过"name"属性形成键值对，存储在变量之中；

3. 此时，我们对数据库进行连接，利用准备好的SQL语句，添加之前的变量对SQL数据库进行查找，在确认数据库内有这名用户后，在PHP中进行跳转。
   
   

以下是PHP中的代码实现：

<?php
//三目运算符，有输入则正常赋值，否则赋空
$username = isset($_POST['name']) ? $_POST['name'] : "";
$password = isset($_POST['pwd']) ? $_POST['pwd'] : "";
//判断用户名和密码是否为空
if (!$username == "" && !$password == "") {
    //与数据库建立连接,参数分别为：数据库地址，用户名，密码，数据库名称
    $conn = mysqli_connect('localhost', 'root', '', 'test');
    //准备SQL语句
    $sql_select = "SELECT username,password FROM accounts WHERE username = '$username' AND password = '$password'"; 
    //执行SQL语句
    $ret = mysqli_query($conn, $sql_select);
    $account= mysqli_fetch_array($ret);
    //判断用户名或密码是否正确
    if ($username == $account['username'] && $password == $account['password']) {
        //开启session
        session_start();
        //创建session
        $_SESSION['username'] = $username;
        //跳转到登录后页面
        header("Location:../index_logged.html");
        //关闭数据库
        mysqli_close($conn);
    } else {
        //用户名或密码错误
        echo "<script>alert('输入错误啦！');history.back(-1);</script>";
    }
} else {
    //用户名或密码为空
    echo "<script>alert('身份信息不能为空哦！');history.back(-1);</script>";

}

几个需要注意的知识点：

1. PHP前后端的链接中，一共有四个部分参与：HTML，JS（JQuery/Ajax），PHP以及SQL数据库，在登录系统中我们跳过了Ajax的部分，直接利用Form表单将HTML与PHP进行连接，因此共有三个部分参与本次小型联动（；
2. isset() 方法被用于判断某元素是否存在，返回true或false；
3. mysqli_query() 用于在数据库中运行定义好的SQL语句；
4. mysqli_fetch_array() 可以将SQL数据库返回的数据转为数组，便于访问；
5. Session 部分被用于存储登录状态，涉及外部知识点，请自行了解，不过在登录系统中并不影响其功能；
6. 别忘了在使用完成后关闭数据库连接哦；
7. 在 echo <script>alert('输入错误啦！');history.back(-1);</script>这段代码中，alert() 用于提示信息，而history.back(-1) 是为了防止登录失败后系统将页面跳转至Login.php而非登录页面，所以利用浏览器的后退功能返回登录框的位置。

此外，此篇文章仅对PHP进行分析，涉及到MySQL数据库的部分，与正常教学内容一致，请先创建好相应的数据表。

针对于前后端的代码编写与MySQL数据库的操作，推荐在VSCode中统一控制，安装插件即可，会方便很多。