Rails 4 Javascript: возникли проблемы с дорожками изображений

Я пытаюсь изменить фоновое изображение каждые 6 секунд, и это всегда ошибка 404:

Например, ниже в консоли JS отображается

http://localhost:3000/app/assets/images/ggb_mist.png 404 (Not Found)

Чтобы упростить это, я просто попробовал background-color, чтобы убедиться, что он работает. См. Ниже:

$(document).ready(function() {
  function testing() {
    $('.holder').css('background-color', 'red');
  };
});

Вышеупомянутые работы. Теперь, когда я пытаюсь сделать то же самое с изображением (которое находится в app/assets/images/imagefilenamehere.png, я всегда получаю ошибку 404. Я пробовал:

filenamehere.png
../assets/images/filenamehere.png
../app/assets/images/filenamehere.png
../images/filenamehere.png

Почему не будет работать ниже?

$('.holder').css({'backgroundImage':'../assets/images/filenamehere.png'});

Приветствуется любой ввод по этому вопросу.

Ответы

Ответ 1

Это решило мою проблему: Раздел 2.3.1 guide.rubyonrails.org/asset_pipeline.html

$('.holder').css("background-image","url(<%= asset_path('tree-rays.jpg') %>)");

Обратите внимание, что tree-rays.jpg находится в приложении/активах/изображениях (приложение Rails 4).

Ответ 2

Вы можете использовать расширение .erb (embedded ruby), чтобы разрешить хэндлерам путей в ваших файлах .js:

1) Сохраните исходный файл (my_script.js) как my_script.js.erb с помощью помощника пути к изображению:

$('.holder').css({"background-image":"<%= asset_path('filenamehere.png') %>"});

Кроме того, убедитесь, что ваш конвейер активов настроен правильно:

В руководстве Rails Asset Pipeline (http://guides.rubyonrails.org/asset_pipeline.html)

2) Ваш файл javascript (my_script.js.erb) находится внутри:

app/assets/javascripts/
lib/assets/javascripts/
vendor/assets/javascripts/
vendor/assets/somepackage/

3) Ваш файл ссылается в манифесте (возможно app/assets/javascripts/application.js):

//= require my_script