Почему изображения не отображаются в моем основном приложении rails
my index.html.erb
code -
<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
To /assets/product1.jpg
заставляет его работать.
Ответы
Ответ 1
Если вы используете конвейер ресурсов http://guides.rubyonrails.org/asset_pipeline.html,
Путь изображения должен быть /assets/product1.jpg
вместо /images/product1.jpg
Если вы не используете конвейер активов, переместите папку изображений в public/images
Ответ 2
Я только что проверил ваше приложение, нет ничего плохого в вашем коде. Единственное, что нужно понять, как работает image_tag.
Обычно вы помещаете все свои изображения, javscripts и стили в каталог app/assets. Когда вы работаете над средой разработки, эти файлы, как обслуживаются несжатыми, но при развертывании на производство активы предварительно скомпилированы, минимизированы, а файлы результатов хранятся в public/assets.
Идея минимизированных активов заключается в том, чтобы быстрее делать запросы для клиентов и экономить пропускную способность.
Теперь, по методу image_tag, вы можете использовать внешний путь для изображения, локальный путь для изображения или относительный путь для изображения.
Когда вы делаете
<%= image_tag "http://www.mywebsite.com/image.jpg" %>
он будет использовать абсолютный url для тега изображения, и вы закончите с
<img src="http://www.mywebsite.com/image.jpg" />
Вы также можете добавить локальный путь, например
<%= image_tag "/images/image.jpg" %>
Что закончится в
<img src="/images/image.jpg" />
который на самом деле является проблемой, потому что рельсы, когда он прекомпилирует файлы, помещает все в /public/assets, и вы можете получить доступ к этим файлам, перейдя на путь /assets, как объяснили другие пользователи.
Итак, код
<%= image_tag "/assets/image.jpg" %>
действительно работает, потому что вы заканчиваете с
<img src="/assets/image.jpg" />
Другое, что вы можете сделать, это использовать относительный путь, то есть
<%= image_tag "image.jpg" %>
который будет преобразован в
<img src="/assets/image.jpg" />
и это будет работать по тому же самому последнему сценарию.
Тем не менее, в вашем приложении вы позволяете пользователям загружать свои собственные изображения, это произойдет позже, когда вы продвигаетесь по книге, в приложении реального мира вы будете использовать драгоценный камень, например paperclip или carrierwave
Ответ 3
Как уже говорил Шрикант, следует указать путь к ресурсам. В качестве примера вы можете поместить <%= image_tag 'rails.png' %>
в свой код и проверить firebug (или проверить элемент внутри chrome), чтобы проверить результат.
Я не совсем уверен, почему ваш код не работает, поскольку я вижу, что вы следили за Agile Web Development с помощью Rails. Я получил приложение депо без проблем. В вашей таблице я вижу вас "Product1", "Product2" и "Product3", это то, что вы на самом деле заполнили в текстовом поле image_url? Что произойдет, если вы измените "Product1" на "product1.jpg"?
На стороне примечания, если вы хотите использовать Paperclip, ваш вызов должен выглядеть следующим образом:
<%= image_tag(product.image.url, class: 'list_image') %>