当你说“源代码正常”时，通常意味着你的 PHP 代码语法没有错误，文件也能被服务器正确执行，但图片依然不显示，这通常是由一些常见的、不易察觉的原因造成的。

php网页图片显示 源代码正常
（图片来源网络，侵删）

下面我将从最常见的原因到更深入的排查方法,为你提供一个完整的解决方案。

第一步：检查最常见的原因（90%的问题出在这里）

图片路径错误（最最常见！）

PHP 和 HTML 在看待路径时是不同的。

  • HTML (浏览器) 的视角：浏览器不知道你的服务器文件结构，它只关心从当前 HTML 文件出发，如何找到那个图片，它使用的是URL 路径。
  • PHP (服务器) 的视角：PHP 在服务器上执行时，它使用的是服务器文件系统路径。

错误示例：

假设你的项目结构如下：

php网页图片显示 源代码正常
（图片来源网络，侵删）
/my_project/
|-- index.php
|-- images/
    |-- my_photo.jpg

在你的 index.php 文件中,如果你这样写：

<!-- 错误示例：使用服务器文件系统路径 -->
<img src="/my_project/images/my_photo.jpg" alt="My Photo">

为什么错误？ 当浏览器解析这个 src 时，它会尝试访问 http://你的域名/my_project/images/my_photo.jpg，但你的网站根目录可能直接就是 /my_project/,所以这个路径是错误的。

正确示例：

你应该使用相对于当前文件的 URL 路径。

php网页图片显示 源代码正常
（图片来源网络，侵删）
<!-- 正确示例：使用相对于当前文件的 URL 路径 -->
<img src="images/my_photo.jpg" alt="My Photo">

或者，为了更清晰和可维护，最好使用网站的根目录 URL：

<!-- 推荐做法：使用网站根目录的绝对 URL -->
<img src="/images/my_photo.jpg" alt="My Photo">

这里的 指的是你的网站根目录（http://你的域名/），这样无论 index.php 在哪个子目录下，都能正确找到 images 文件夹。

图片文件不存在或权限问题

  1. 确认文件存在：检查 images/my_photo.jpg 这个文件是否真的存在于服务器的对应位置，你可以通过 FTP 或 SSH 登录服务器来确认。
  2. 检查文件权限：确保 Web 服务器（如 Apache 或 Nginx）的用户（通常是 www-data 或 nginx）有读取该文件的权限。
    • 在 Linux 上，你可以使用 ls -l 命令查看文件权限，通常图片文件的权限需要至少是 644（所有者可读写，组和其他用户只读）。
    • 如果文件权限是 600（只有所有者可读写），Web 服务器进程就无法读取它,自然就无法显示。

PHP 文件执行方式问题

你可能是通过直接在文件管理器里点击 .php 文件来打开它的，file:///C:/xampp/htdocs/project/index.php。

为什么错误？ 这种方式是本地文件打开，PHP 代码根本没有被 PHP 解析器执行，浏览器会把 <img src="..."> 当作普通的 HTML 标签去寻找本地文件，而不会运行 PHP 代码来动态生成路径。

正确做法： 必须通过 Web 服务器 来访问你的 PHP 文件，如果你使用 XAMPP，你应该在浏览器地址栏输入： http://localhost/你的项目文件夹名/index.php

第二步：使用 PHP 动态输出图片路径（最佳实践）

当图片路径可能变化，或者你想更好地管理资源时，最佳实践是在 PHP 中动态生成路径。

假设你的项目根目录是 /var/www/html/my_site。

定义一个基础路径常量：

在 config.php 或你的主文件 index.php 顶部定义一个常量，指向你的网站根 URL。

<?php
// 定义网站根目录的 URL
// 使用 $_SERVER['DOCUMENT_ROOT'] 可以自动获取服务器配置的网站根目录路径
define('ROOT_URL', 'http://' . $_SERVER['HTTP_HOST'] . dirname($_SERVER['SCRIPT_NAME']));
// 或者，index.php 在根目录下，可以更简单
// define('ROOT_URL', 'http://' . $_SERVER['HTTP_HOST']);
?>

在 HTML 中使用这个常量：

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">图片显示示例</title>
</head>
<body>
    <h1>我的图片</h1>
    <!-- 使用 PHP 常量来构建完整的 URL -->
    <img src="<?php echo ROOT_URL; ?>/images/my_photo.jpg" alt="My Photo">
</body>
</html>

这样做的好处是，即使你将来把整个网站移动到另一个域名或目录下，只需要修改 ROOT_URL 的定义即可,所有图片链接都会自动更新。

第三步：进阶排查与调试方法

如果以上方法都无效,问题可能更深层。

检查图片文件的 MIME 类型

服务器需要告诉浏览器它发送的是什么类型的数据（图片、HTML、CSS 等），虽然大多数情况下服务器能自动识别,但有时配置错误会导致问题。

你可以使用 PHP 的 getimagesize() 函数，它不仅能检查图片是否存在，还能获取其尺寸和 MIME 类型。

<?php
$imagePath = 'images/my_photo.jpg';
// 检查图片是否存在并可读
if (file_exists($imagePath) && is_readable($imagePath)) {
    // 获取图片信息
    $imageInfo = getimagesize($imagePath);
    if ($imageInfo !== false) {
        // $imageInfo[0] 是宽度, $imageInfo[1] 是高度, $imageInfo['mime'] 是 MIME 类型
        echo "图片尺寸: " . $imageInfo[0] . "x" . $imageInfo[1] . "<br>";
        echo "MIME 类型: " . $imageInfo['mime'] . "<br>";
        // 输出图片标签
        echo '<img src="' . htmlspecialchars($imagePath) . '" alt="Checked Image">';
    } else {
        echo "文件不是一个有效的图片。";
    }
} else {
    echo "图片文件不存在或无法读取。";
}
?>

getimagesize() 失败,说明文件可能已损坏或不是有效的图片格式。

检查 .htaccess 文件（Apache 服务器）

如果你的项目根目录下有一个 .htaccess 文件，它可能会重写 URL，导致路径错误,检查其中是否有影响图片文件访问的规则。

检查 PHP 错误日志

即使你代码“正常”，也可能有警告或通知被忽略，这些信息通常在 PHP 错误日志里。

  • 如何找到错误日志？
    • 在 php.ini 文件中查找 error_log 指令。
    • 对于 XAMPP，日志通常在 xampp/php/logs/php_error_log。
    • 对于 Linux，可能是 /var/log/apache2/error.log。

在 php.ini 中确保 display_errors 是 On（在开发环境中），这样错误会直接显示在页面上,帮助你快速定位问题。

; 在 php.ini 中
display_errors = On
error_reporting = E_ALL

第四步：一个完整可运行的示例

项目结构：

/my_test/
|-- index.php
|-- images/
    |-- logo.png

index.php 的完整代码：

<?php
// 1. 设置正确的页面标题字符编码
header('Content-Type: text/html; charset=utf-8');
// 2. 定义网站根目录的 URL (这是一个健壮的方法)
// dirname(__FILE__) 获取当前文件所在目录的绝对路径
// 但我们这里用更简单的方式，假设 index.php 在网站根目录
$root_url = 'http://' . $_SERVER['HTTP_HOST'] . rtrim(dirname($_SERVER['SCRIPT_NAME']), '/');
// 图片的相对路径
$image_relative_path = 'images/logo.png';
// 构建完整的图片 URL
$image_full_url = $root_url . '/' . $image_relative_path;
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">PHP 图片显示完整示例</title>
    <style>
        body { font-family: sans-serif; text-align: center; margin-top: 50px; }
        .container { border: 2px solid #ccc; padding: 20px; display: inline-block; }
        img { max-width: 300px; border: 1px solid #ddd; }
    </style>
</head>
<body>
    <div class="container">
        <h1>PHP 图片显示</h1>
        <p>这是一个使用 PHP 动态生成图片路径的示例。</p>
        <!-- 
          方法一：直接使用 PHP 变量 (推荐)
          htmlspecialchars() 用于防止 XSS 攻击，是良好习惯
        -->
        <p>方法一 (推荐):</p>
        <img src="<?php echo htmlspecialchars($image_full_url); ?>" alt="网站 Logo">
        <hr>
        <!-- 
          方法二：直接使用相对路径 (如果结构简单)
          只有当 index.php 和 images 文件夹在同一级时才有效
        -->
        <p>方法二 (简单相对路径):</p>
        <img src="<?php echo htmlspecialchars($image_relative_path); ?>" alt="网站 Logo">
        <hr>
        <!-- 
          方法三：显示一些调试信息
          如果图片不显示，可以检查这里的输出是否正确
        -->
        <p>调试信息:</p>
        <p>网站根 URL: <?php echo htmlspecialchars($root_url); ?></p>
        <p>图片相对路径: <?php echo htmlspecialchars($image_relative_path); ?></p>
        <p>图片完整 URL: <?php echo htmlspecialchars($image_full_url); ?></p>
        <p>图片文件是否存在? <?php echo file_exists($image_relative_path) ? '是' : '否'; ?></p>
    </div>
</body>
</html>

如何运行：

  1. 将上述代码保存为 index.php。
  2. 找一个 logo.png 图片，保存到 images 文件夹中。
  3. 将整个 my_test 文件夹放到你的 Web 服务器根目录（如 XAMPP 的 htdocs 文件夹）。
  4. 在浏览器中访问 http://localhost/my_test/index.php。

如果图片正常显示，说明你的配置是正确的，如果仍然不显示，请根据页面上显示的“调试信息”部分进行排查。

排查清单

当 PHP 网页图片不显示时,请按以下顺序检查：

  1. ✅ URL 路径：确认 <img src="..."> 中的路径是浏览器能理解的 URL 路径（如 /images/xxx.jpg 或 images/xxx.jpg）,而不是服务器文件系统路径。
  2. ✅ 文件存在：通过 FTP/SSH 确认图片文件是否真的在服务器上指定路径。
  3. ✅ 文件权限：确保 Web 服务器用户有读取该文件的权限（通常是 644）。
  4. ✅ 通过服务器访问：确保你是通过 http://localhost/... 的方式访问网页,而不是直接打开本地文件。
  5. ✅ 检查 PHP 错误日志：查看是否有隐藏的警告或错误信息。
  6. ✅ 使用调试代码：在页面上输出图片的完整 URL，然后手动在浏览器地址栏访问这个 URL，看图片是否能正常打开，如果手动能打开但页面里不行，那问题就在 HTML/CSS 部分；如果手动也打不开,那问题就在路径或文件本身。