PHP 与 AJAX 查询交互全解析
在现代 web 开发中，PHP 和 AJAX 的结合使用能够实现页面的异步数据交互，极大地提升用户体验，本文将详细介绍如何使用 PHP 处理 AJAX 查询请求，从基础原理到代码示例，再到常见问题解答，帮助你全面掌握这一技术组合。
一、AJAX 与 PHP 交互原理
AJAX（Asynchronous JavaScript and XML）是一种在不重新加载整个网页的情况下，与服务器交换数据并更新部分网页的技术，PHP 作为服务器端脚本语言，负责接收 AJAX 请求，处理数据并返回结果给客户端，当用户在前端页面触发某个事件（如点击按钮、提交表单等）时，JavaScript 会通过 AJAX 向服务器发送请求，PHP 接收到请求后执行相应的逻辑操作（如查询数据库），然后将处理好的数据以 JSON 或 XML 格式返回给前端，前端再根据返回的数据动态更新页面内容，整个过程用户无需手动刷新页面，实现了页面的局部更新。
二、搭建 PHP 环境
要进行 PHP 与 AJAX 的开发，首先需要搭建 PHP 运行环境，常见的方式有：
XAMPP 安装包
下载：访问[Apache Friends 官网](https://www.apachefriends.org/index.html)，根据自己的操作系统选择合适的 XAMPP 版本进行下载。
安装：双击安装文件，按照提示完成安装过程，安装完成后，启动 XAMPP 控制面板，确保 Apache 和 MySQL 服务正常运行。
配置虚拟主机（可选）
打开 XAMPP 安装目录下的apache\conf\extra\httpdvhosts.conf 文件，添加以下虚拟主机配置信息：
| 配置项 | 值 | |||
| ServerName | www.localtest | |||
| DocumentRoot | "C:/xampp/htdocs/myproject" | |||
| Options Indexes FollowSymLinks MultiViews | AllowOverride All | Require all granted |
然后修改系统 hosts 文件（一般位于C:\Windows\System32\drivers\etc\hosts），添加一行127.0.0.1 www.localtest，这样，就可以通过http://www.localtest 访问本地项目目录了。
三、创建 PHP 查询脚本
以下是一个简单的 PHP 查询脚本示例，用于从数据库中获取用户信息：
<?php
// 数据库连接参数
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "test_db";
// 创建连接
$conn = new mysqli($servername, $username, $password, $dbname);
// 检测连接是否成功
if ($conn>connect_error) {
die("连接失败: " . $conn>connect_error);
}
// 接收前端传递的参数
$user_id = $_POST['user_id'];
// 编写 SQL 查询语句
$sql = "SELECT id, name, email FROM users WHERE id = $user_id";
$result = $conn>query($sql);
// 处理查询结果并返回给前端
if ($result>num_rows > 0) {
$row = $result>fetch_assoc();
echo json_encode($row);
} else {
echo json_encode(array("message" => "未找到相关用户"));
}
// 关闭连接
$conn>close();
?>在这个脚本中，首先连接到数据库，然后接收前端通过 AJAX 传递过来的user_id 参数，根据该参数执行 SQL 查询语句获取用户信息，并将结果以 JSON 格式返回给前端，如果查询不到相关用户，则返回一个错误消息。
四、编写前端 AJAX 请求代码
以下是使用原生 JavaScript 发送 AJAX 请求的示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF8">
<title>AJAX 查询示例</title>
</head>
<body>
<input type="text" id="user_id" placeholder="请输入用户 ID">
<button onclick="getUserInfo()">查询用户信息</button>
<div id="result"></div>
<script>
function getUserInfo() {
var user_id = document.getElementById('user_id').value;
var xhr = new XMLHttpRequest();
xhr.open("POST", "get_user_info.php", true);
xhr.setRequestHeader("Contenttype", "application/xwwwformurlencoded");
xhr.onreadystatechange = function() {
if (xhr.readyState == 4 && xhr.status == 200) {
var response = JSON.parse(xhr.responseText);
document.getElementById('result').innerHTML = "ID: " + response.id + "<br>姓名: " + response.name + "<br>邮箱: " + response.email;
}
};
xhr.send("user_id=" + user_id);
}
</script>
</body>
</html>在这段代码中，当用户点击“查询用户信息”按钮时，会触发getUserInfo 函数，该函数获取用户输入的user_id，然后创建一个XMLHttpRequest 对象，设置请求方法和 URL，以及请求头信息，接着注册onreadystatechange 事件处理函数，当请求完成且服务器响应状态为 200 时，解析服务器返回的 JSON 数据，并将结果显示在页面的result 元素中，通过send 方法发送请求，将user_id 作为参数传递给 PHP 脚本。
五、常见问题与解答
问题 1：如何处理 AJAX 请求中的中文乱码问题？
在发送 AJAX 请求时，如果遇到中文乱码问题，可以在 PHP 脚本中添加以下代码来设置字符编码：
header('ContentType: text/html; charset=utf8');在前端 AJAX 请求的setRequestHeader 方法中设置正确的字符编码：
xhr.setRequestHeader("ContentType", "application/xwwwformurlencoded; charset=UTF8");问题 2：如何防止 AJAX 跨域请求被浏览器阻止？
当前端页面和 PHP 脚本不在同一个域名下时，会出现跨域请求被浏览器阻止的情况，解决方法有以下几种：
服务器端设置：在 PHP 脚本中添加以下代码允许跨域请求：
header('AccessControlAllowOrigin: *');
header('AccessControlAllowMethods: POST, GET, OPTIONS');
header('AccessControlAllowHeaders: ContentType');JSONP 方式（仅适用于 GET 请求）：将 PHP 返回的数据包装成一个回调函数的形式，callback({"id":1,"name":"张三"})，然后在前端通过jsonp 方式进行请求和解析，但这种方式存在安全隐患，已逐渐被废弃。
通过本文的介绍，你应该对 PHP 与 AJAX 的查询交互有了较为全面的了解，在实际开发中，你可以根据具体需求进一步扩展和完善这一技术应用，以构建更加高效、灵活和用户友好的 web 应用程序。