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

swa*_*esh 15 ruby ruby-on-rails image ruby-on-rails-3

我的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 %>
Run Code Online (Sandbox Code Playgroud)

和图像在app\assets\images..但仍然没有出现在前端的图像.

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

<img src="/images/product1.jpg" class="list_image" alt="Product1">
Run Code Online (Sandbox Code Playgroud)

截图 -

截图

图像也到位 -

图像占位符

让我知道我做错了什么,我该如何解决它.

编辑

github.com/swapnesh/depot

让我知道为什么它不适合我的情况.

虽然改变/images/product1.jpg To /assets/product1.jpg使它工作.

Sri*_*eva 25

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

图像路径应该/assets/product1.jpg代替/images/product1.jpg

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


ror*_*rra 11

我刚检查了你的应用程序,你的代码没有任何问题.唯一的事情是了解image_tag的工作原理.

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

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

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

当你这样做

<%= image_tag "http://www.mywebsite.com/image.jpg" %>
Run Code Online (Sandbox Code Playgroud)

它将使用图像标记的绝对URL,你将结束

<img src="http://www.mywebsite.com/image.jpg" />
Run Code Online (Sandbox Code Playgroud)

您也可以添加本地路径

<%= image_tag "/images/image.jpg" %>
Run Code Online (Sandbox Code Playgroud)

哪个将结束

<img src="/images/image.jpg" />
Run Code Online (Sandbox Code Playgroud)

这实际上是你遇到的问题,因为rails,当它预编译文件时,它将所有内容放在/ public/assets中,你可以通过转到其他用户解释的路径/资产来访问这些文件.

所以代码

<%= image_tag "/assets/image.jpg" %>
Run Code Online (Sandbox Code Playgroud)

实际上是有效的,因为你以

<img src="/assets/image.jpg" />
Run Code Online (Sandbox Code Playgroud)

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

<%= image_tag "image.jpg" %>
Run Code Online (Sandbox Code Playgroud)

将被转换为

<img src="/assets/image.jpg" />
Run Code Online (Sandbox Code Playgroud)

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

然而,在您的应用程序中,您将让用户上传他们自己的图像,这将在您在书上推进后发生,在真实世界的应用程序上,您将使用像纸夹载波的宝石