Question

我正在使用Espresso而我收到此错误 - 无法加载资源：服务器响应状态为404（未找到）。图像位于名为images的文件夹内的espresso中的项目文件下。每当我将此代码链接到我的网站时，图像都不显示，但在他们显示的浓缩咖啡的实时预览中。这是我的代码。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>ListApp</title>
        <link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile- 1.3.2.min.css"           />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    <style>
        img.fullscreen {
            max-height: 100%;
            max-width: 100%;
        }
    </style>
  </head>
  <body>
  <div data-role="page" id="photos">
  <header data-role="header">
        <h1> List App </h1>
  </header>
  <article data-role="content">
        <ul data-role"listview" data-filter="true">
            <li>
                <a href="#dog">
                <h1>American Pitbull</h1>
                <img src="images/IMG_1870.jpg"
                    alt="Pitbull" />
                <p>This is my sweet, loving Pitbull Kalvin. He's 3 years old and 
                a huge baby. He also likes to go out in style!</p>
                </a>
            </li>
            <li>
                <a href="#strobe">
                <h1>My Old Apartment's Lighting</h1>
                <img src="images/IMG_1185.jpg"
                    alt="Strobe Light" />
                <p>We wanted to be able to light up the room in with different 
                   colors and I found this on amazon and it's amazing. Friend's love 
                it and definately improves the mood.</p>
                </a>
            </li>
        <ul>
  </article>
  <footer data-role="footer" data-position="fixed">
        <nav data-role="navbar">
            <ul>
                <li><a href="#" data-icon"home">Home</a></li>
                <li><a href="#" data-icon"grid">Photos</a></li>
                <li><a href="#" data-icon"info">Info</a></li>
            </ul>
        </nav>
  </footer>
  </div><!-- page -->

  <div data-role="page" id="dog">
  <header data-role="header">
        <h1> Dog </h1>
        <a href="#photos" data-icon="grid" data-iconpos="notext">Photos</a>
  </header>
  <img src="images/IMG_1870.jpg" class="fullscreen" alt="Dog Picture" />
  </div><!-- page -->

   <div data-role="page" id="strobe">
  <header data-role="header">
        <h1> Strobe Light </h1>
        <a href="#photos" data-icon="grid" data-iconpos="notext">Photos</a>
  </header>
  <img src="images/IMG_1185.jpg" class="fullscreen" alt="Strobe Lights" />
  </div><!-- page -->
  </body>
</html>

这是我的.htaccess文件：

    # BEGIN WPSuperCache
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
#If you serve pages from behind a proxy you may want to change 'RewriteCond %{HTTPS} on' to something more sensible
AddDefaultCharset UTF-8
RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{HTTPS} on
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html.gz -f
RewriteRule ^(.*) "/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html.gz" [L]

RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{HTTPS} !on
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html.gz -f
RewriteRule ^(.*) "/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html.gz" [L]

RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTPS} on
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html -f
RewriteRule ^(.*) "/wp-content/cache/supercache/%{SERVER_NAME}/$1/index-https.html" [L]

RewriteCond %{REQUEST_URI} !^.*[^/]$
RewriteCond %{REQUEST_URI} !^.*//.*$
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{QUERY_STRING} !.*=.*
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress_logged_in|wp-postpass_).*$
RewriteCond %{HTTP:X-Wap-Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTPS} !on
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html -f
RewriteRule ^(.*) "/wp-content/cache/supercache/%{SERVER_NAME}/$1/index.html" [L]
</IfModule>

# END WPSuperCache

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Answer 1

问题在于图像的相对路径。

src="images/IMG_1185.jpg"＆lt; - 相对于当前目录

例如，当您所在的网站地址为“http://domain.com/contact”时，它将在/contact/images

中搜索图片

要解决此问题，您需要将图片路径更改为绝对路径，将http://domain.com/添加到图片源，例如

src="http://domain.com/images/IMG_1185.jpg"＆lt; - 绝对路径

或在图片来源的开头添加/，如下所示：

src="/images/IMG_1185.jpg"＆lt; - 相对于基本目录

我建议使用第一种方法，因为它更安全。

Answer 2

我通过将图像文件夹放置在资产文件夹中解决了该问题，该文件夹是在创建新的角度应用程序时由聋人创建的。
<img class = "img" width="100" height="19.094" src="assets/images/myimage.png" alt="myImage">

Answer 3

当我尝试通过 github 页面查看我的网站时，我遇到了同样的错误。我通过删除路径前面的 / 符号解决了该错误。看下面的例子

以前是 <img src="/images/woman.jpg" alt="dancing woman"/>（显示错误 404）

以前<img src="images/woman.jpg" alt="dancing woman"/>（完美运行）

无法加载资源：服务器响应状态为404（未找到）

3 个答案: