Невозможно связать изображение с HTML в приложении Rails
Я разрабатываю веб-приложение с использованием Ruby on Rails. У меня есть изображение, которое я хочу добавить на сайт, и я попытался использовать HTML-тег img src для вызова локального изображения, но это не сработает. Если я использую ruby, чтобы вызвать его с помощью метода «тег изображения», он работает нормально. Мне просто интересно, почему он никогда не работает с HTML.
Например, я добавляю изображение в app>assets>images>image1.png
В файле View я добавляю HMTL следующим образом:
<img src = "/app/assets/images/image1.png">
он не загружается
Но если я введу этот код в том же месте:
<%= image-tag: "image1.png" %>
Это работает нормально.
Кто-нибудь знает, почему это происходит? Я знаю, что у меня есть обходной путь, но я бы предпочел знать, почему мой HTML-тег имеет проблему с локальными файлами, но при этом прекрасно связывается с файлами в Интернете. Я новичок в кодировании. Ваше здоровье!
Ответы 5
Вы можете попробовать с онлайн-примером? Я предполагаю, что ruby не находит ваше изображение в каталоге.
<img src = "https://upload.wikimedia.org/wikipedia/commons/thumb/3/32/Googleplex_HQ_%28cropped%29.jpg/250px-Googleplex_HQ_%28cropped%29.jpg"> </img>
Хороший вопрос. Компилятор ресурсов Rails важен, но создает некоторые проблемы, подобные этой.
Компилятор ресурсов, вероятно, добавляет отпечаток кеша к имени файла. Вы можете использовать <%=asset_path('images/image1.png')%> в качестве значения атрибута src или продолжать использовать image_tag.
См. документ ресурсов руководства Rails для получения дополнительной информации.
Это помогает?
Дополнительная информация — это отпечаток кеша, чтобы браузеры могли кэшировать ресурс и не перезагружать его из сети. При изменении файла отпечаток меняется. Затем браузеры должны загрузить измененный файл. Возможно, я должен был написать <%=asset_path('image1.png')%>
<%=asset_path('image1.png')%> отлично работает, спасибо!
Похоже, ваш синтаксис неверен для помощника image_tag. Попробуй это:
<%= image_tag "image1.png" %>
Дополнительная информация в документации по Rails
Да, я неправильно написал тег здесь, но я правильно написал его в своем приложении, тег изображения работает, а img-src не работает.
Проблема в пути, который вы используете. Вот короткая версия: удалите app/ из URL-адреса изображения, и оно должно работать как положено.
Если вы запустите приложение с работающим кодом, вы увидите, что это то, что image_tag уже делает для вас за кулисами, проверив HTML. Вы должны увидеть что-то вроде этого:
<img src = "/assets/images/image1.png">
Обновление тега img для использования этого пути должно решить проблему.
Тем не менее, вы должен используете image_tag, если это возможно! Не вдаваясь слишком глубоко в технические подробности, если вы развернете свой сайт в рабочей среде с версией image_tag и взглянете на HTML, вы, вероятно, увидите что-то вроде этого:
<img src = "/assets/images/image1-[sequence of characters].png">
Это поможет убедиться, что клиенты удаляют устаревшие активы из своих кешей по мере необходимости — технические подробности можно найти в здесь (см. раздел 1.2). Если вы жестко закодируете изображение, вы упустите все функции, предоставляемые конвейером ресурсов.
Я пытался исключить «приложение» из пути и просто ввести img src = "/assets/images/image1.png", но это тоже не сработало. Когда я проверяю image_tag (который работает), он показывает HTML следующим образом: img src= "/assets/image1-48e6870c46f97f301cb1d7c6e8fdf2d04c03dc407bf5f2199f27ad41f3f26137.png Почему он добавляет всю эту другую информацию? Спасибо за информацию об использовании image_tag вместо этого!
Это описано в документации, на которую я дал ссылку — это отпечаток пальца, который генерируется image_tag. Если вы сделаете какие-либо обновления для этого изображения (или полностью замените его), эта строка изменится — это означает, что любые браузеры, которые уже кэшировали исходное изображение, будут вынуждены запросить новое.
Если вы хотите использовать тег изображение, вам следует:
<img src = "<%= asset_path('image1.png') %>"/>
Без "/images" и "/".
Здравствуйте, спасибо за ответ. Я попробовал <img src = "<%=asset_path('images/image1.png')%>">, но выдало ошибку, что актив не найден. Затем я попробовал <img src = "<%= assets_path('/image1.png')%>"> Что не дало мне никаких ошибок, но изображение по-прежнему не загружается, оно просто отображается как неработающая ссылка. Когда я проверяю image_tag (который работает), он показывает HTML следующим образом: img src= "/assets/image1-48e6870c46f97f301cb1d7c6e8fdf2d04c03dc407bf5f2199f27ad41f3f26137.png Почему он добавляет всю эту другую информацию? Это.