Ajax在XAMPP中正常运行但在Apache2中失效的问题排查

我有一个基于Ajax的简单项目，包含HTML、main.js和PHP文件。部署在XAMPP的/opt/lampp/htdocs/my_project目录时，Ajax调用可正常执行；但部署在单独安装的Apache2的/var/www/html/my_project目录时，Ajax调用失败，出现XML解析错误，且PHP代码被原样返回。两处文件权限一致，求问题原因。

项目代码 #

HTML #

<!DOCTYPE html>
<html lang='en'>
    <head>
        <title>test</title>
        <meta charset='utf-8'>
        <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    </head>
    <body>
        <button id='btn'>Click</button>
        <script src='jquery-3.6.3.min.js'></script>
        <script src='main.js'></script>
    </body>
</html>

main.js #

$('#btn').click(() => {
    $.ajax({
        url: 'test.php',
        type: 'POST',
        dataType: 'json',
        success: res => {
            console.log('success');
            console.log(res);
        },
        error: errorThrown => {
            console.log(errorThrown);
        }
    })
})

PHP #

<?php
ini_set('display_errors', 'On');
    error_reporting(E_ALL);

    $executionStartTime = microtime(true);

    $url='http://api.geonames.org/geoCodeAddressJSON?formatted=true&q=Madrid&username=my_user_name&style=full';
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_URL,$url);

    $result=curl_exec($ch);

    curl_close($ch);

    $decode = json_decode($result,true);    

    $output['status']['code'] = "200";
    $output['status']['name'] = "ok";
    $output['status']['description'] = "success";
    $output['status']['returnedIn'] = intval((microtime(true) - $executionStartTime) * 1000) . " ms";
    $output['data'] = $decode['address'];

    header('Content-Type: application/json; charset=UTF-8');

    echo json_encode($output);
?>

报错情况 #

切换到单独安装的Apache2时，执行sudo /opt/lampp/lampp stop和sudo service apache2 start，访问localhost/my_project后点击按钮，出现以下错误：

XML Parsing Error: no element found
Location: http://localhost/test/test.php
Line Number 29, Column 1:

同时Ajax返回的responseText为PHP代码原文：

Object { readyState: 4, getResponseHeader: getResponseHeader(e), getAllResponseHeaders: getAllResponseHeaders(), setRequestHeader: setRequestHeader(e, t), overrideMimeType: overrideMimeType(e), statusCode: statusCode(e), abort: abort(e), state: state(), always: always(), catch: catch(e), … }
readyState: 4
responseText: `<?php
ini_set('display_errors', 'On');
    error_reporting(E_ALL);

    $executionStartTime = microtime(true);

    $url='http://api.geonames.org/geoCodeAddressJSON?formatted=true&q=Paris,France&username=clovis&style=full';
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_URL,$url);

    $result=curl_exec($ch);

    curl_close($ch);

    $decode = json_decode($result,true);	

    $output['status']['code'] = "200";
    $output['status']['name'] = "ok";
    $output['status']['description'] = "success";
    $output['status']['returnedIn'] = intval((microtime(true) - $executionStartTime) * 1000) . " ms";
    $output['data'] = $decode['address'];

    header('Content-Type: application/json; charset=UTF-8');

    echo json_encode($output);
?>
`
status: 200
statusText: "OK"

问题核心是单独安装的Apache2没有启用PHP模块，导致服务器无法解析PHP代码，直接将源码返回给客户端。而客户端Ajax请求指定了dataType: 'json'，解析纯PHP文本失败后，jQuery会尝试XML解析，最终触发XML解析错误。

解决步骤：

1. 安装对应版本的PHP模块（以PHP7.4为例，根据你的PHP版本调整）：

   sudo apt install libapache2-mod-php7.4
   

2. 启用PHP模块：

   sudo a2enmod php7.4
   

3. 重启Apache2服务：

   sudo systemctl restart apache2
   

4. 验证：创建info.php文件，内容为<?php phpinfo(); ?>，访问localhost/my_project/info.php，若能显示PHP信息则说明模块启用成功。

额外检查：确保Apache站点配置（通常在/etc/apache2/sites-available/000-default.conf）的目录块中包含AllowOverride All，允许解析PHP文件：

<Directory /var/www/html/>
    Options Indexes FollowSymLinks MultiViews
    AllowOverride All
    Require all granted
</Directory>

修改后需重启Apache服务。

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