为什么图像没有显示在我的rails基本应用程序中

时间:2013-04-05 07:01:44

标签: ruby-on-rails ruby ruby-on-rails-3 image

我的index.html.erb代码 -

<h1>Listing products</h1>

<table border="1">

<% @products.each do |product| %>
  <tr>
    <td><%= product.title %></td>
    <td><%= product.description %></td>
    <td><%= image_tag(product.image_url, :class => 'list_image') %></td>
    <td><%= product.price %></td>
    <td><%= link_to 'Show', product %></td>
    <td><%= link_to 'Edit', edit_product_path(product) %></td>
    <td><%= link_to 'Destroy', product, method: :delete, data: { confirm: 'Are you sure?' } %></td>
  </tr>
<% end %>
</table>

<br />

<%= link_to 'New Product', new_product_path %>

并且图片位于app\assets\images ..但是前端没有出现静止图像。

当我Firebug时,我相信图片标签正确形成...让我知道我在这部分缺少什么。

<img src="/images/product1.jpg" class="list_image" alt="Product1">

屏幕截图 -

screenshot

图像也已到位 -

image placeholder

让我知道我做错了什么以及如何解决它。

修改

github.com/swapnesh/depot

让我知道为什么它不适用于我的情况。

虽然更改/images/product1.jpg /assets/product1.jpg会使其有效。

4 个答案:

答案 0 :(得分:25)

如果您使用资产管道http://guides.rubyonrails.org/asset_pipeline.html

图片路径应为/assets/product1.jpg,而不是/images/product1.jpg

如果您没有使用资产管道,请将images文件夹移至public/images

答案 1 :(得分:11)

我刚刚检查了您的应用程序,您的代码没有任何问题。唯一的办法是了解 image_tag 的工作原理。

通常您将所有图片,javscripts和stylesheests放在 app / assets 目录中。在处理开发环境时,这些文件是未压缩的,但在部署到生产时,资产会进行预编译,缩小,结果文件存储在 public / assets 中。

缩小资产背后的想法,只是为客户提供更快的请求,并节省带宽。

现在,在方法 image_tag 上,您可以使用图像的外部路径,图像的本地路径或图像的相对路径。

当你这样做时

<%= image_tag "http://www.mywebsite.com/image.jpg" %>

它将使用图片标记的绝对网址,您将以

结尾
<img src="http://www.mywebsite.com/image.jpg" />

您也可以添加本地路径,例如

<%= image_tag "/images/image.jpg" %>

哪个将以

结尾
<img src="/images/image.jpg" />

这实际上是您遇到的问题,因为rails在预编译文件时会将所有内容放在 / public / assets 中,您可以通过转到路径 / assets 正如其他用户解释的那样。

所以代码

<%= image_tag "/assets/image.jpg" %>

实际上有效,因为你以

结尾
<img src="/assets/image.jpg" />

您可以做的另一件事是使用相对路径,即

<%= image_tag "image.jpg" %>

将转换为

<img src="/assets/image.jpg" />

,这将在最后一个场景中起作用。

尽管如此,在您的应用程序中,您将让用户上传他们自己的图像,这将在您在书上推进后发生,在真实世界的应用程序上,您将使用像paperclip这样的宝石或carrierwave

答案 2 :(得分:1)

正如Srikanth所说,应该引用资产路径。例如,您可以在代码中放置<%= image_tag 'rails.png' %>并检查firebug(或检查chrome中的元素)以检查结果。

我不太清楚为什么你的代码不起作用,因为我可以看到你使用Rails跟踪敏捷Web开发。我让depot应用程序运行没有问题。在你的表格中,我看到你'Product1','Product2'和'Product3',这是你在image_url text_field中实际填写的内容吗?如果将“Product1”更改为“product1.jpg”会发生什么?

另外,如果您想使用Paperclip,您的通话应如下所示:

<%= image_tag(product.image.url, class: 'list_image') %>

答案 3 :(得分:0)

如果收到扩展名为.jpeg的文件,请尝试仅使用“ .jpg”重命名该文件。

来自

<%= image_tag "image.jpeg" %>

收件人:

<%= image_tag "image.jpg" %>