使用SQL、PHP、JavaScript实现网页温度值实时更新的故障排查

核心原因 #

你给data.php加了缓存禁止头，但AJAX实际请求的ctemp.php没有设置任何缓存控制，虚拟主机的服务器（如Apache/Nginx）会默认缓存这类输出内容，导致重复请求返回旧数据。

解决方案 #

1. 给ctemp.php添加缓存禁止头 #

修改ctemp.php，在开头加入缓存控制代码，强制浏览器和服务器不缓存该文件的输出：

<?php
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

include_once 'db_connect.php';

$sql = "SELECT * FROM weather WHERE id=1;";
$result = mysqli_query($conn, $sql);
$resultCheck = mysqli_num_rows($result);

if ($resultCheck > 0) {
    while ($row = mysqli_fetch_assoc($result)){
        $ctemp = $row['temp'];
        print($ctemp);
    }
}
?>

2. （可选）AJAX请求加随机参数绕过缓存 #

如果服务器端缓存设置无法修改，可以在AJAX请求的URL后添加随机时间戳，确保每次请求都是全新的：

function doRefresh(){
    $("#show").load("/api/ctemp.php?t=" + new Date().getTime());
}
setInterval(doRefresh, 5000);

3. 检查虚拟主机的服务器缓存配置 #

如果以上方法无效，登录虚拟主机控制面板，找到缓存设置（比如Apache的mod_expires、Nginx的expires指令），确认是否对api/目录下的PHP文件开启了缓存，手动禁用该目录的缓存规则。

内容的提问来源于stack exchange，提问作者Brady Pettinelli