SQL/AJAX查询结果本地正常 部署网站后不显示问题排查

一、代码本身的逻辑bug（本地运行正常大概率是旧代码缓存/未保存最新修改导致的误判） #

• PHP返回数据逻辑缺失
  你在PHP代码中初始化了空数组$data用于存储返回结果，但遍历查询结果的while循环里，只创建了Department对象赋值，没有把对象追加到$data数组中，最终接口返回的data字段永远是空数组，前端拿不到数据自然无法渲染。
  修复方式：在while循环内追加一行代码，把生成的部门对象放入结果数组：

while ($row = mysqli_fetch_assoc($result)) {
    $dept = new Department();
    $dept->setId($row['id']);
    $data[] = $dept; // 新增这行
}

• 前端渲染逻辑错误
  JS中拼接列表项时把变量写在了单引号包裹的字符串内，属于纯静态文本，不会解析result变量的实际值，就算接口正常返回数据，页面也只会显示固定的result['data'][i]['id']字符串，不会渲染真实ID。
  修复方式：改为变量拼接，推荐用ES6模板字符串写法更简洁：

// 原写法错误，替换为下一行
$('#results').append(`<li>${result['data'][i]['id']}</li>`);

• PHP文件存在多余输出风险
  你贴的代码末尾把PHP闭合标签?>写在了独立的<p>标签里，会导致接口返回的JSON内容前后混入HTML文本，前端设置dataType: 'json'时会因为格式不合法解析失败，直接不进入success回调。直接删除这段多余的<p>?&gt;</p>内容即可，PHP文件末尾可以省略?>标签，避免意外输出。

二、线上环境专属适配点 #

• 数据库配置二次校验
  cPanel环境下创建的MySQL库、用户名会自动添加cPanel账号前缀（比如本地库名是dept_db，cPanel账号是user123，线上实际库名是user123_dept_db），同时线上数据库的端口、socket配置和本地XAMPP默认值不一致，不要直接沿用本地配置，从cPanel的MySQL数据库详情页复制准确的连接参数填入config.php。
• 路径规则适配
  线上Apache/Nginx的目录解析规则和本地XAMPP可能存在差异，相对路径很容易解析出错：
  • AJAX请求的URL建议改成从网站根目录开头的绝对路径，比如/libs/php/department/getAll.php，避免当前页面层级变化导致404
  • PHP中引入config.php时建议用$_SERVER['DOCUMENT_ROOT']拼接绝对路径，不要用../形式的相对路径，避免不同层级脚本调用时引入失败
• 协议适配
  如果线上站点开启了HTTPS，不要在AJAX请求中硬编码HTTP路径，用相对路径即可，否则会被浏览器的混合内容规则拦截请求。
• 文件权限校验
  cPanel环境对文件权限有严格限制，PHP文件权限要设为644，目录权限设为755，权限过高或过低都会导致脚本无法执行，返回403/500错误。

三、分步调试方法 #

1. 先独立验证接口可用性
   直接在浏览器地址栏访问接口地址https://你的域名/libs/php/department/getAll.php，查看返回内容：
   • 如果data字段为空数组，就是前面提到的PHP未将查询结果写入$data的问题
   • 如果返回内容前后有HTML标签、PHP报错信息，就是文件存在多余输出或语法错误
   • 返回404是路径配置错误，返回300状态码是数据库连接失败，返回400状态码是SQL执行失败（如表名、字段名和线上不一致）
2. 用浏览器开发者工具抓包
   按F12打开开发者工具，切换到「网络」面板，刷新页面找到getAll.php请求：
   • 查看请求状态码，403对应权限问题，500对应PHP语法/运行错误
   • 查看「响应」标签页内容，确认返回的是不是标准合法JSON
   • 切换到「控制台」标签页，查看是否有JSON解析错误、JS语法错误，常见的Unexpected token < in JSON就是接口返回了HTML内容而非JSON导致的
3. 给AJAX添加错误回调
   不要只写success回调，补充error回调打印错误日志，能快速定位问题：

   $.ajax({
       url: "/libs/php/department/getAll.php",
       type: "POST",
       dataType: 'json',
       success: function(result){
           console.log('接口返回数据：', result);
           const numberOfDepartments = result['data'].length;
           for(let i=0; i < numberOfDepartments; i++) {
               $('#results').append(`<li>${result['data'][i]['id']}</li>`);
           }               
       },
       error: function(xhr) {
           console.log('请求失败，响应内容：', xhr.responseText);
       }
   })
   

4. 校验线上数据库数据
   登录线上phpMyAdmin，打开department表确认表内确实存在数据，不是空表。

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