IIS环境下运行HTML页面请求PHP接口返回404错误如何排查解决？

1 404报错直接原因修复 #

你当前触发404的核心问题是HTML中引入的jQuery CDN地址拼写错误：
原地址写的是https://ajax.googleeapis.com/ajax/libs/jquery/1.11.0/jquery.min.js，其中googleeapis多写了一个e，修正为https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js即可解决该404问题。
额外排查点：

• 确认jQuery.js、GettingFileInfo.php和HTML文件处于同级目录，若不在同级需要调整对应引用路径
• 若IIS未配置PHP解析权限，也会导致GettingFileInfo.php返回404，需要在IIS角色中添加PHP处理映射

2 后端PHP逻辑修正 #

当前PHP代码存在返回格式错误问题，即使解决404也无法正常解析：

• 调试输出print_r($files)会污染返回内容，导致JSON格式不合法
• 已生成JSON编码后的$toJson变量，但实际返回的是未编码的$implodedFilesEqual字符串
• 路径拼接用硬编码\MyFiles在Windows IIS环境下可能存在转义识别问题
• 没有声明JSON响应头，前端可能识别返回内容为普通文本

修改后的GettingFileInfo.php代码：

<?php
// 调用主函数
getFileInfoMainFunction(); 

/**
 * 扫描目录并去除.和..
 * @param string $dir 目录路径
 * @return array 文件名数组
 */
function sscandir($dir)
{
    return array_values(array_diff(scandir($dir), array('..', '.'))); 
}

function getFileInfoMainFunction(){
    // 用系统目录分隔符拼接路径，适配Windows IIS环境
    $fileDirectory = dirname(__FILE__) . DIRECTORY_SEPARATOR . "MyFiles"; 
    $files = sscandir($fileDirectory); 
    $implodedFilesEqual = implode("|", $files); 

    // 包装成对象适配前端取name字段的逻辑
    $returnData = [
        'name' => $implodedFilesEqual
    ];

    // 声明JSON响应头
    header('Content-Type: application/json');
    // 输出JSON编码后的内容
    echo json_encode($returnData);
    exit;
}
?>

3 前端逻辑适配 #

你当前jQuery.js中用的是原生XMLHttpRequest逻辑，无需额外修改即可适配调整后的后端返回，如果你需要使用已经引入的jQuery简化代码，可以改成如下写法：

$(function(){
    $.post('GettingFileInfo.php', function(res){
        $('#demo').text(res.name);
    }, 'json');
});

内容的提问来源于stack exchange，提问作者Erik G Holmes