12

最近、Rails 3.2.13 アプリケーションの 1 つを書き直して、Rails 4 を使用しました。Rails 3 アプリケーションでは twitter-bootstrap-rails 2.1.2 を使用しました。Rails 4 のバージョンを書き直したところ、バージョン 2.2.8 を使用し始めました。開発サーバーと実動サーバーで Phusion Passenger 4.0.20 を使用して、すべての Rails アプリケーションをホストしています。

私の Rails 3 アプリケーションでは、背景画像は localhost と本番環境で正しく表示されました。しかし、Rails 4 と現在のバージョンの twitter-bootstrap-rails を使用してアプリケーションを書き直したところ、背景画像は正しく表示されますが、本番環境にデプロイすると背景画像が表示されないことに気付きました。

次の CSS を試しましたが、背景画像が localhost にしか表示されません。最初のステートメントは、私の Rails 3 アプリケーションのローカルホストと本番環境でうまく機能していたオリジナルの CSS コードです。

background: url(/assets/landingpage2.jpg); width: 574px; height: 650px;

background: url(../assets/landingpage2.jpg); width: 574px; height: 650px;

background-image: url(../assets/landingpage2.jpg); width: 574px; height: 650px;

background-image: url("../assets/landingpage2.jpg"); width: 574px; height: 650px;

background-image: url("/assets/landingpage2.jpg"); width: 574px; height: 650px;

以下は、元々機能していたバックグラウンド ステートメントを含むクラスです。

.landing-cube-menu {
  font-weight: bold; 
  font-size: 150%;
  line-height: 100%;    
  background: url(/assets/landingpage2.jpg); width: 574px; height: 650px;
  margin:0 auto;  
}

私の見解で使用しているコードは次のとおりです。

<div class="header-cube-menu" style="position: relative;">

  <div class="header-store" style="position: absolute;">
    <p><%= link_to "Online Store", store_path %></p>
  </div>

  <div class="header-about" style="position: absolute;">
    <p><%= link_to "About", about_path %></p>
  </div>

  <div class="header-contact" style="position: absolute;">
    <p><%= link_to "Contact", contact_path %></p>
  </div>

  <div class="header-verse" style="position: absolute;">
    <p><a href="/verse">Bible<br>Verse</a></p>
  </div>

  <div class="header-app" style="position: absolute;">
    <p><a href="/app">Mobile<br>&nbsp;&nbsp;App</a></p>
  </div>

  <div class="header-home" style="position: absolute;">
    <p><a href="/home">Home<br>&nbsp;Page</a></p>
  </div>

  <div class="header-math" style="position: absolute;">
    <p><a href="/math">The<br>Math</a></p>
  </div>

  <div class="header-vision" style="position: absolute;">
    <p><a href="/vision">&nbsp;Vision<br>Mission</a></p>
  </div>

  <div class="header-pendant" style="position: absolute;">
    <p><a href="/pendant">Pendant<br>&nbsp;&nbsp;&nbsp;Desk Cross<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;and more</a></p>
  </div>

  <div class="header-puzzle" style="position: absolute;">
    <p><a href="/puzzle">3D-Puzzle<br>&nbsp;&nbsp;eBook</a></p>
  </div>

</div>

ローカルホストとドメインの両方のブラウザでキャッシュをクリアしました。ローカルホストにはまだ画像が表示されますが、ドメインには表示されません。Mac Mini Server で最新バージョンの Safari、Chrome、Firefox、および Opera を使用してみました。それらはすべて同じ結果になります。

これは、localhost で背景画像が表示されていなければ理解できました。localhost を使用して Rails 4 アプリのテストを行い、本番環境で動作すると想定しました。ただし、展開した後、背景画像がありませんでした。これは、本番サーバーと開発サーバーの両方で発生しています。画像ファイルは、両方のサーバーの app/assets/images にあります。

画像は localhost に表示されるため、元のコードとここに投稿したすべての例は正しいものです。この時点でどこを確認すればよいかわかりません。Passenger Google Group に投稿するかもしれません。これは、特に私の開発サーバーを考えると、ローカルホストと本番の間の唯一の他の変数です。

更新: これを投稿した後、他の可能性を試すことにしました。localhost の背景画像が表示されなくなりました。私はこれに完全に不満を感じています。

どんな助けでも大歓迎です。

更新 2013 年 10 月 19 日午後 8 時 5 分 CDT GMT-5

.less ファイルにasset_urlソリューションを実装しようとしました。rake assets を実行したときに発生したエラーは次のとおりです:precompile RAILS_ENV=productionコマンド

I, [2013-10-19T19:59:05.384878 #69440]  INFO -- : Writing /Users/myusername/Sites/myrailsapp/public/assets/application-f8821f5601f793a09e9373fb397df1b1.js
    rake aborted!
    undefined method `[]' for nil:NilClass
      (in /Users/myusername/Sites/hypercubeoflove_RoR_4/app/assets/stylesheets/application.css)
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/sass_functions.rb:63:in `sprockets_context'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-rails-4.0.0/lib/sass/rails/helpers.rb:23:in `asset_url'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/script/funcall.rb:112:in `_perform'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/script/node.rb:40:in `perform'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:298:in `visit_prop'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `map'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:109:in `block in visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:121:in `with_environment'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:108:in `visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `block in visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:320:in `visit_rule'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `map'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:109:in `block in visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:121:in `with_environment'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:108:in `visit_children'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `block in visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:128:in `visit_root'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:7:in `visit'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/root_node.rb:20:in `render'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/engine.rb:315:in `_render'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/engine.rb:262:in `render'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/sass_compressor.rb:24:in `evaluate'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/tilt-1.4.1/lib/tilt/template.rb:103:in `render'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:197:in `block in evaluate'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:194:in `each'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:194:in `evaluate'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/bundled_asset.rb:25:in `initialize'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:377:in `new'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:377:in `build_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:94:in `block in build_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/caching.rb:58:in `cache_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:93:in `build_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:287:in `find_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:61:in `find_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:211:in `block in find_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:257:in `benchmark'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:210:in `find_asset'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:119:in `block in compile'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:118:in `each'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:118:in `compile'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-rails-2.0.0/lib/sprockets/rails/task.rb:60:in `block (3 levels) in define'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/rake/sprocketstask.rb:146:in `with_logger'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-rails-2.0.0/lib/sprockets/rails/task.rb:59:in `block (2 levels) in define'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/bin/ruby_noexec_wrapper:14:in `eval'
    /Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/bin/ruby_noexec_wrapper:14:in `<main>'
    Tasks: TOP => assets:precompile
    (See full trace by running task with --trace)
4

2 に答える 2

26

あなたの問題は、ほぼ確実にrake assets:precompile本番環境に関係しています

Right-Click > View Source実稼働アプリで、背景画像が呼び出される CSS ファイルをクリックしてテストすることをお勧めします。CSS が url("background-image.png") を呼び出していることが問題で、ファイルをクリックしても表示されない場合、解決策は SCSS を使用してアセットを動的にプリコンパイルすることです


SCSS を使用したアセットのプリコンパイル

CSS で画像ファイルにアクセスできないという問題がありました。これは、CSS が静的な url() の場所のみを参照していたためであることがわかりました。プリコンパイルでは、アプリは画像「backgroun-image-234234nsdfasfdjasdfk2jij234ij32i.png」を呼び出していました

これを修正する方法は、SCSS を使用してアセットへの動的リンクを作成することです。アプリが画像などへの正しいパスを配置できるようにします。ここにいくつかのライブコードがあります:

#application.css.scss (yes, you need to rename it)
@import 'layout/body'


#app/assets/stylesheets/layout/body.css.scss
body {
    background: asset_url('background-image.png')
}

これを行ってから、本番環境にプッシュするときに次のコマンドを実行すると、機能するはずです。

rake assets:precompile RAILS_ENV=production
于 2013-10-19T09:46:50.703 に答える