相对路径访问Rails资产。

6

我卡住了!xD 我正在开发一个Rails项目,使用相对路径访问我的资源时遇到了问题。我的一个朋友负责html/css方面的工作,而我则负责控制器和模型。我的朋友最近给了我一批按以下结构组织的文件:

app/assets/images/*.jpg
app/assets/stylesheets/*.css
app/assets/javascripts/*.js
app/assets/fonts/*.* (+some more css files in here)

在我的app/views/layouts目录中,有一个名为final.html.erb的布局文件,用于我的整个web应用程序。我还有一个位于app/views/pages目录下名为final_page.html.erb的页面(html正文内容),我正在尝试使用此布局来呈现该页面...必要的路由已经就位,可以加载该页面;但是,它只加载了final_page.html.erb的内容(没有图像、样式或字体)。当我打开控制台并输入"rails server"并访问localhost:3000时,页面就裸露出来了。控制台输出如下:

Started GET "/" for 127.0.0.1 at 2012-07-28 21:15:02 -0700
Connecting to database specified by database.yml
Processing by PagesController#final_page as HTML
  Rendered pages/final_page.html.erb within layouts/final (8.4ms)
Completed 200 OK in 82ms (Views: 81.0ms | ActiveRecord: 0.0ms)


Started GET "/assets/stylesheets/style.css" for 127.0.0.1 at 2012-07-28 21:15:04 -0700

ActionController::RoutingError (No route matches [GET] "/assets/stylesheets/style.css"):
  actionpack (3.2.6) lib/action_dispatch/middleware/debug_exceptions.rb:21:in `call'
  actionpack (3.2.6) lib/action_dispatch/middleware/show_exceptions.rb:56:in `call'
  railties (3.2.6) lib/rails/rack/logger.rb:26:in `call_app'
  railties (3.2.6) lib/rails/rack/logger.rb:16:in `call'
  actionpack (3.2.6) lib/action_dispatch/middleware/request_id.rb:22:in `call'
  rack (1.4.1) lib/rack/methodoverride.rb:21:in `call'
  rack (1.4.1) lib/rack/runtime.rb:17:in `call'
  activesupport (3.2.6) lib/active_support/cache/strategy/local_cache.rb:72:in `call'
  rack (1.4.1) lib/rack/lock.rb:15:in `call'
  actionpack (3.2.6) lib/action_dispatch/middleware/static.rb:62:in `call'
  railties (3.2.6) lib/rails/engine.rb:479:in `call'
  railties (3.2.6) lib/rails/application.rb:220:in `call'
  rack (1.4.1) lib/rack/content_length.rb:14:in `call'
  railties (3.2.6) lib/rails/rack/log_tailer.rb:17:in `call'
  rack (1.4.1) lib/rack/handler/webrick.rb:59:in `service'
  /usr/lib/ruby/1.9.1/webrick/httpserver.rb:138:in `service'
  /usr/lib/ruby/1.9.1/webrick/httpserver.rb:94:in `run'
  /usr/lib/ruby/1.9.1/webrick/server.rb:191:in `block in start_thread'


  Rendered /var/lib/gems/1.9.1/gems/actionpack-3.2.6/lib/action_dispatch/middleware/templates/rescues/routing_error.erb within rescues/layout (2.0ms)

我认为问题在于我试图使用相对路径访问文件。我的布局文件如下所示:
<!doctype html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta name="viewport" content="width=device-width">
<title>:: Final ::</title>
<link rel="stylesheet" type="text/css" href="../../assets/stylesheets/style.css">
<link href="../../assets/stylesheets/desktop.css" rel="stylesheet" type="text/css" media="only screen and (min-width:769px) and (max-width:1000px)">
<script src="../../assets/javascripts/modernizr.js" type="text/javascript"></script>
</head>
<body>
  <%= yield %>
</body>
</html>

此外,在我的final_page.html.erb文件的主体中,我也尝试使用相对路径来访问图片...像这样:

<img src="../../assets/images/mainImg.jpg" alt="img"> 

我的朋友编写了大部分的HTML代码,但他没有使用Rails的经验。所以我对请求资产的方式进行了修改:

原代码如下:

<link rel="stylesheet" type="text/css" href="../../assets/stylesheets/style.css">

致:

<%= stylesheet_link_tag "application.css" %>

来自:

<script src="../../assets/javascripts/modernizr.js" type="text/javascript"></script>

致:

<%= javascript_include_tag "application.js" %>

来自:

<img src="../../assets/images/mainImg.jpg" alt="img">

致:

<%= image_tag "mainImg.jpg"  %>

这有些有帮助,因为图片加载了,但只有极少量的样式能够传递过来;然而,它与它应该看起来的样子相差甚远。我想这是因为我的朋友在css文件内部进行相对调用:

body {
    background-image: url(../images/bg.jpg);
    background-repeat: repeat;
}

我尝试将这些替换为url(<%= asset_path 'bg.jpg' %>)等等...但没有效果。我尝试了很多方法并阅读了很多文章。我想知道Rails是否允许我使用相对路径。我尝试了:

config.assets.enabled = false

但是这并没有帮助到我...请问我错在哪了?我不认为我的朋友会想要停止使用相对路径来进行他的工作,因为这是他的习惯。该网站在 Rails 外部运行良好,但我需要它与 Rails 一起工作以供我的 Web 应用程序使用。非常感谢您的任何建议。谢谢您有耐心阅读所有内容。

P.S. 我正在使用 Ruby 1.9.3 和 Rails 3.2.6

3个回答

7

尝试使用/assets/style.css而不是/assets/stylesheets/style.css等。

如果存在这样的结构:

app
  assets
    stylesheets
    javascripts

要访问app/assets或者app/assets/any_folder下的文件,你需要使用路径/assets/file

更新

试试这个:

body {
    background-image: url(bg.jpg);
    background-repeat: repeat;
}

或者:

body {
    background-image: url(/assets/bg.jpg);
    background-repeat: repeat;
}

这实际上解决了50%的问题 xD 非常感谢!但是样式还是有点不对。我不确定是因为 css 文件使用了相对路径还是其他原因? :( 我需要进入 css 文件并将路径更改为它所引用的图像吗?像这样:body { background-image: url(../images/bg.jpg); background-repeat: repeat; }从 url(../images/bg.jpg) 更改为 url(/assets/bg.jpg)? - OrlinTheMage
哇塞... 这真的百分之百生效了... 我使用了url(/assets/bg.jpg)来修复css文件中所有图片引用问题,真是太神奇了!非常非常非常感谢你! - OrlinTheMage

4
Rails 3.1推出了新的Asset Pipeline。我建议你阅读一下这个链接:http://guides.rubyonrails.org/asset_pipeline.html 在你的app/views/layouts/application.html.erb文件中,请确保有以下内容:
<%= stylesheet_link_tag "application", :media => "all" %>

在你的应用程序的app/assets/stylesheets/application.css文件中,确保有以下这行代码:
*= require_tree .

(这将确保您在app / assets / stylesheets目录中拥有的任何css文件都可用于您的应用程序)

在您的CSS文件中,您只需执行以下操作即可引用app / assets / images目录中的图像:

background-image: url(bg.jpg);

1
另一个目录中的字体怎么办? - Ian Warner
对于字体,我认为您需要向config/application.rb添加以下行:config.assets.paths << Rails.root.join("app", "assets", "fonts") - calasyr

0

如果您想在配置initializers中使用本地资源,并且您具有以下文件夹结构:

app assets stylesheets javascripts

您只需要这样做:(在此示例中,我使用的是Spree基础配置/初始化器)

Spree.config do |config| config.admin_interface_logo = '/assets/logo/custom_admin.png' config.logo = '/assets/logo/custom_store.jpg' end

因此,请使用/assets/your_file_or_path,它会起作用:D


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接