0

Rails アプリを正常にデプロイしましたが、画像が表示されません。これは、コンソールに表示されている 404 エラーです

GET http://mydomain.com/assets/myimage.png 404 (Not Found)

サーバーのアプリケーション ディレクトリ内には、3 つのサブディレクトリがあります。

current  releases  shared

これは、Ryan Bates から借りたデプロイ スクリプトによって作成されたセットアップです。

assetsフォルダーのimagesディレクトリにある画像を見ることができますcurrent

  current/app/assets/images$ ls
glyphicons-halflings.png  glyphicons-halflings-white.png  qb.png

ただし、sharedディレクトリのassetsフォルダー（すべてが本番用にコンパイルされた後に配置されていると推測しています）では、同じ画像にいくつかの（私が推測している）キャッシュ情報が添付されています。私はしたいです。

myimage.png

むしろ

myimage-0bb3f134943971c95b2abdfd30f932c7.png

コードが shared/assets ディレクトリで myimage.png を探しているため (私は推測しています)、これが 404 エラーの原因であるかどうか疑問に思っています。

どうすればこの問題に対処できるか知っていますか?

の内容/shared/assets

/shared/assets$ ls
application-39c95ed7b8d86b0698b6c443563e33c7.js           fontawesome-webfont-c4adb9424c8b6a6b1b9b0d2627528c4c.woff
application-39c95ed7b8d86b0698b6c443563e33c7.js.gz        fontawesome-webfont-f57557847fd1897100790d9df344ded8.ttf
application-7a6376d676fb88537b9f839687ccaad3.css          glyphicons-halflings-4e5b89324f1ac987ddf6835ef51f5fe9.png
application-7a6376d676fb88537b9f839687ccaad3.css.gz       glyphicons-halflings-white-2fa53df59ca25ee50f59f971c0c9175d.png
application-a184171300937caf263adbc5e8582ba4.css          manifest-990c8a24196fee5e9c394078c326c763.json
application-a184171300937caf263adbc5e8582ba4.css.gz       myimage-0bb3f134943971c95b2abdfd30f932c7.png
fontawesome-webfont-57b442a30fcae0d4334299c521a326a2.svg  twitter
fontawesome-webfont-8140ac47a16c8f7074e59f2ebe0657eb.eot

画像の表示に使用するコード

  1. 1 つの画像に対して、このようなスパンを作成します

背景画像を割り当てます

.qb{
position: absolute;
width: 50px;
height: 50px;
background-image: url('/assets/qb.png');
left: 75px;
top: 300px;

}

x別の画像については、Twitter ブートストラップを自動的に使用してページ要素をクリックして削除できるようにするクラスを含む、このようなテンプレートがあります。

<script id="blahblah_template" type="text/underscore">
<h2> The Story <i class='icon-remove'></i></h2>

画像がサーバー上にあるにもかかわらず、404 をトリガーしています

Failed to load resource: the server responded with a status of 404 (Not Found) 

    http://mydomain.com/assets/glyphicons-halflings.png
4

1 に答える 1

2

Rails が提供するアセット ヘルパーを使用する必要があります。このヘルパーは、組み込みのキャッシュを使用して画像への適切な URL を自動的に作成します。方法は次のとおりです。

.qb{
position: absolute;
width: 50px;
height: 50px;
background-image: url( <%= asset_path 'qb.png' %> ); 
left: 75px;
top: 300px;

}

上記は、キャッシングフィンガープリントが変更されると、URLにマップqb.pngされ、URL も更新されます。qb-0bb3f134943971c95b2abdfd30f932c7.pngスタイルシートのファイル名が.erb最後にあることを確認してください。stylesheet.css.erb

詳細については、アセット パイプラインガイドを参照してください。

[編集]

Rails アセット パイプラインと Bootstrap を統合するには、bootstrap-sassなどの gem を使用してください。画像に関する問題を解決します

于 2013-06-29T19:10:20.427 に答える