预编译后html图像路径是否仍然可用?

时间:2015-02-19 01:26:16

标签: html ruby-on-rails ruby image path

我正在构建一个Rails应用,但我使用的是一个插件,我必须使用html渲染我的图像。

由于我还没有部署,我的所有图片都在RAILS_ROOT/app/assets/images/,所以为了渲染图像,我必须编写以下代码:

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

但是当我准备好部署到网络并执行预编译时,我的所有图像都会被移动到我的public文件夹中。 html是否仍然可以链接到图像,还是我必须更改为链接到不同的路径?

我使用的插件是Typeahead:

application.html.erb *

  <script type="text/javascript">
      //....
      $('#typeahead').typeahead(null, {
        maxLength: 5,
        displayKey: function(thing) {
          return "<div  class='typeahead'><img src='" + thing.image_url + "'></div>";
        },
        source: bloodhound.ttAdapter(),
      });
  </script>

things_controller.rb

def typeahead
  #render json: Thing.where(name: params[:query])
  q = params[:query]
  render json: Thing.where('name LIKE ?', "%#{q}%")
end

* Thing.image_tag目前设置为"/assets/[image.jpg]",但每件事都使用正确的文件名进行调整。

5 个答案:

答案 0 :(得分:1)

它们不仅会出现在public文件夹中,而且还会重命名以包含指纹。

必须对所有资产see how to here使用Rails帮助程序,并在您阅读本指南的其余部分时阅读:)

答案 1 :(得分:1)

我认为您应该使用non-stupid-digest-assets gem,因为它会复制public/assets文件夹中的所有资产(在资产预编译列表中提到),然后您无需在编译之前/之后更改代码。要安装,你只需要将它添加到你的Gemfile中。

gem 'non-stupid-digest-assets'

我希望它对你有所帮助。

答案 2 :(得分:1)

Joe,我的建议是在公共文件夹中创建一个目录来存放你的图像,而不是我们使用app / assets目录。公共文件夹将允许rails管道不会更改资产,您可以使用任何需要图像的外部服务可靠地链接它们。

RailsGuides中所述:

  

资产仍可放置在公共层次结构中。任何资产   public将由应用程序或Web服务器作为静态文件提供   当config.serve_static_files设置为true时。你应该用   应用程序/资产,用于必须在它们之前进行一些预处理的文件   服务。

所以你需要在config/application.rb

中添加这一行
config.serve_static_files = true

Rails general configuration中所述。

答案 3 :(得分:0)

您似乎已将image_url存储在模型中,但由于资产在Rails中没有固定网址,因此无效。我会覆盖模型中的getter以使用asset_path帮助器,因此它会在读取该属性时(例如,生成JSON时)转换路径。

类似的东西:

# thing.rb

[...]

def image_url
  ActionController::Base.helpers.asset_path(read_attribute(:image_url))
end

[...]

答案 4 :(得分:0)

简短回答,不。

但要解决这个问题并不是什么大不了的事。只需将需要引用html的图像移动到Public文件夹中即可。然后你可以用这段代码简单地引用它们:

<img src="/image_name.image_type">

并且html将在预编译之前和之后链接到正确的路径。因此,在部署之前,您不必更改任何代码。

顺便说一句:我认为image_tagimage_url是同一列,你只是在你提到它的两次中犯了一个错误。如果是这样的话,那就别忘了把它改成简单的&#34; / [image.jpg]&#34;。