该笔记的目的是引导读者利用WampServer将MySQL中搭建的本地数据库显示到网页中。不同于其他教程，该笔记假定读者事先下载并安装了MySQL Server，并借此熟悉了MySQL基本语法，并建立了MySQL本地数据库。


如读者希望利用WampServer自带的MySQL环境搭建网页数据库，请参阅其他教程。如读者尚不熟悉MySQL数据库搭建的基本操作，请参阅以下笔记：
MySQL Workbench 8.0 CE数据库管理基本操作

WampServer: Apache + MySQL + php环境搭建

1. 进入WampServer官网(https://www.wampserver/)，下载并安装WampServer。安装过程中只需要一直点击“Next”即可。
2. 运行WampServer，屏幕中闪烁出现命令行窗口若干次，而后消失，并在底部工具栏中出现WampServer图标（图1）。当WampServer图标为绿色时，表明服务器正常运作。
3. 右击WampServer图标（图1），选择Language。在这里可以将WampServer软件的语言设置为中文。
   
   图1 启动WampServer

接下来将全面介绍WampServer中一些重要部件的作用：

www目录

左击WampServer图标，选择www目录，弹出资源管理器界面。该目录用于存放网页文件%%。举例来说，如果在www目录中存在一个名为“try.html”的文件，那么利用“localhost/try.html”这个URL就能够访问这一文件的内容；如果在www目录中存在一个名为“html”的文件夹，在该文件夹中存在一个名为“test.html”的文件，那么利用“localhost/html/test.html”这个URL就能访问这一文件的内容。
%%：泛指“.html”“.css”“.js”“.php”文件。这些文件是构成一个网页主体内容的核心。

为进一步理解www目录的具体含义，在www目录中新建一个文本文件，将其扩展名改为“.html”，文件名命名为“try.html”。用记事本打开该文件，输入“hello world!”。关闭该文件。打开任意浏览器，输入URL地址“localhost/try.html”，敲击回车键，结果在浏览器中显示出“hello world!”字样。

php.ini和my.ini

左击WampServer图标，选择PHP > php.ini，打开“php.ini”文件。该文件用于配置很多服务器参数。在后续的数据库网页构建过程中，常常会遇到有关服务器参数设置的问题，这时就需要改变“php.ini”文件中的相关参数。打开任意浏览器，输入“localhost”URL地址，敲击回车键，显示出WampServer主界面。单击页面中的“phpinfo()”链接，跳转到PHP参数配置界面。在该界面中显示了不少“php.ini”文件中的参数。

左击WampServer图标，选择MySQL> my.ini，打开的“my.ini”文件用于配制MySQL数据库相关的参数。左击WampServer图标，选择MySQL>MySQL控制台，即相当于打开MySQL Command Line Client，能利用命令行窗口操作MySQL数据库。

重启服务

左击WampServer图标，点击“重新启动所有服务”，此时WampServer图标转变成红色，而后重新变成绿色。该操作在数据库网页搭建的过程中非常重要。每次修改“php.ini”文件中的参数时，需要重新启动所有服务，以确保服务器在新的参数下运行。

WampServer挂载MySQL数据库

在www目录中新建“test.php”文件，用记事本（或Sublime Text、VS Code等文本编辑器软件）打开该文件。在文件中输入以下代码：

<?php
// 可变参数
$servername = "localhost";
$username = "您的MySQL账户名";
$password = "您的MySQL账户密码";
$dbname = "您希望展示的数据库名称";
$tbname = "您希望展示的数据表名称";

function data_row($row){
	//您希望展示的数据表的格式
	//此处数据表有9列，分别为id, picture, user, …, submit_time
	return array(
        "id" => $row["id"],
        "picture" => $row["picture"],
        "user" => $row["user"],
        "location" => $row["location"],
        "time" => $row["time"],
        "lat" => $row["lat"],
        "long" => $row["long"],
        "al" => $row["al"],
        "submit_time" => $row["submit_time"],
    );
}

// 创建和检测连接
$conn = new mysqli($servername, $username, $password);
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
}

// 显示数据
$conn->query("USE ". $dbname.";");
$sql = "SELECT * FROM ". $tbname;
$result = $conn->query($sql);

if ($result->num_rows > 0) {
    // 转化为json数组
    $res_json=array();
    while($row = $result->fetch_assoc()) {
        $newdata = data_row($row);
        array_push($res_json, $newdata);
    }
    $points=json_encode($res_json);
    
    //输出数据
    echo $points;
} else {
    echo "0 results";
}

// 断开MySQL数据库
$conn->close();
?>	

修改可变参数区域的参数值，以适应您需要展示的数据表格式。关闭“test.php”文件。打开任意浏览器，输入“localhost/test.php”地址，敲击回车键，结果显示出本地MySQL数据库的内容（图2）。

图2 MySQL数据库挂载到网页中
【常见问题】PHP报错：“the server requested authentication method unknown to the client”。解决方案：在MySQL命令行窗口中进行相关配置，命令行代码参考https://wwwblogs/caicaizi/p/9430173.html。配置完毕后重启服务器即可。