CSS图片在404页面无法加载

Question

example.co.in上的页面有一个自定义的404页面，位于example.co.in/errors/404.html。当我尝试从errors目录内访问不存在的页面，例如example.co.in/errors/baba（此页面不存在），我会得到正确的404页面。但是，当我尝试从上面的任何其他目录或任何其他目录访问不存在的页面时，我会看到该页面，但图片无法加载。该图片与404.html页面位于同一errors目录中。

<img src="rajni.jpg">

如果我把图片放在主HTML目录（www）中，它可以完美地工作。问题是为什么example.co.in/errors/baba可以工作而example.co.in/baba无法工作？

编辑：链接已更改，由于SEO问题而无法使用。

- woofmeow

---

发布你的.htaccess文件。 - OneOfOne

我正在使用Apache中的虚拟主机配置，而不是htaccess。 - woofmeow

Answer 1

你的图片 <img> 的路径是相对路径，而实际图片在 /errors/rajni.jpg。因此，只有当路径在 /errors 时，图片才会加载成功。要修复这个问题，只需要更改 src：

<img src="/errors/rajni.jpg">

Apache 服务资源的方式与浏览器请求资源的方式不同。浏览器必须为每个资源（包括图像）下载单独的 HTTP 请求。它向 /not/a/page 发送一个请求。Apache 看到 /not/a/page 并返回 HTTP: 404; html=(基本上是这样)。浏览器解析 HTML、显示并查看src=rajni.jpg。然后它发出另一个请求:GET HTTP 1.1 /not/a/page/rajni.jpg`。Apache 乐意回复另一个 404。

- Explosion Pills

---

我知道，但为什么它不起作用，因为图像已经在与文档相同的文件夹中了...为什么会出现这个奇怪的路径问题？因为它是从errors目录中工作的...那是什么导致了它？ - woofmeow

@woofmeow 如果当前路径为空，则它将尝试从相同的目录加载。因此，如果您已经在“errors”中，则它会尝试从“/errors/”加载。 - Explosion Pills

但是，当我访问除 /errors/ 之外的不存在页面时，Apache 不应该从 /errors/ 目录中提供 /errors/404.html 页面吗？还是我的理解有误？@ExplosionPills，rosscowar - woofmeow

@rosscowar Apache难道不应该能够正确地处理**/errors/**文件夹中的请求吗？ - woofmeow

@woofmeow Apache提供服务的方式与浏览器请求的方式不同。浏览器必须为每个下载的资源（包括图片）发起单独的HTTP请求。它会向/not/a/page发起一个请求。Apache看到/not/a/page后返回HTTP: 404; html=<img src=rajni.jpg>（基本上是这样）。浏览器解析HTML，显示内容，并看到src=rajni.jpg。然后它再次发起另一个请求：GET HTTP 1.1 /not/a/page/rajni.jpg。Apache很乐意再次回应404。 - Explosion Pills

Answer 2

使用以下代码行：

<img src="http://example.co.in/errors/rajni.jpg">

- Prathamesh Shiralkar

---

请简要说明你的回答。 - αƞjiβ