web-dev-qa-db-ja.com

画像として解釈されるが、MIMEタイプtext / htmlで転送されるリソース-Magento

Magentoショップに新しい製品画像をアップロードすると、次のエラーが表示されます。

Resource interpreted as image but transferred with MIME type text/html

これが起こっている理由はありますか？

phpmagento
37
Jae Kun Choi

これは、イメージパスが正しく設定されていない場合に発生する可能性があります。たとえば、現在のディレクトリ「images/myimage.gif」を基準にしたものと、Webルート「/images/myimage.gif」を基準にしたものです。

「text/html」への参照は、サーバーからエラーが返されていることを示唆している場合があります。

42
Ian Lewis

JavaScriptコンソールログにこの問題が表示されることに気付きました。これは、存在しない背景画像を探しているCSSファイルと、その場所で404エラーメッセージを送信するサーバーの単純なケースでした。

12
stevecomrie

適切なMIMEタイプで画像を提供する必要があります-

この行を.htaccessファイルに追加します（Apache2 httpdと仮定）：

AddType image/gif .gif

ヒント：mod_rewriteでは、画像の除外が必要になる場合があります。

RewriteCond %{REQUEST_URI} !\.(png|gif|jpg)$
RewriteRule ...

...それ以外はすべて404です。

5
Martin Zeitler

資本化のために、私は同じ問題を一度経験しました。

私の同僚はMacで作業しており、ラクダでケースされたファイルをいくつか追加しましたが、CSSでは小文字で表示されました。これはMacでは正常に機能しますが、Linuxで作業していました。 Macは大文字と小文字が異なるファイル名を区別しませんが、Linuxは区別します。そこにあるほとんどのサーバーはLinux上で動作します。

例：

epicimage.jpg !== EpicImage.jpg

Chrome Dev Toolsのおかげで、問題は非常に簡単に見つかりました。画像のURLをクリックするだけで404ページが表示されました。ミステリーは解決しました：D

3
Kim Hogeling

画像の拡張子を確認してください。使用するプログラムが画像に拡張子を大文字または小文字でラベル付けするかどうかにかかわらず、一部のサーバーはそれらを別々に読み取ります。

2
Ralphkay

私の問題はCSSのこの行にありました

background-image: url('');

あるべきだった：

background-image: none;
2
Strixy

多くの調査の後、問題の組み合わせが原因で、サーバーがドキュメントのタイプを認識せず、UTF-8（またはそのようなもの）などのエンコードタイプ間で混同することが原因であることがわかりました。

そのため、.htaccessで、コメントを次のように変更して、デフォルトの文字セットUTF-8を指定します。

############################################
## Prevent character encoding issues from server overrides
## If you still have problems, use the second line instead

    #AddDefaultCharset Off
    AddDefaultCharset UTF-8

これにより、googleに表示される正しいエラー（mr googleに感謝）：「リソースはイメージとして解釈されますが、MIMEタイプtext/htmlで転送されました」が停止しました。

そして、作成された画像は他のブラウザに表示されます（エラーは表示されませんでした）。

2
Jackie

StackOverflowで同様の問題を解決しようとして、基本的に同様の質問をすべてチェックアウトしました。

Htaccessファイルを変更してphp head引数を挿入しようと試みた後、それを修正したのは...画像の名前の大文字を変更するだけでした。

あー（ローカルでホストされている同じブラウザでも正常に機能していました...もちろん、最初はそれが問題だとは思いませんでした。）

2
emerazea

画像パスと大文字と小文字を区別するファイル名が正しく設定されていて、サーバーの.htaccessファイルを変更できない場合、SVGをデータURIとしてエンコードすることがフロントエンドソリューションです。 css-tricks.comがその方法を説明しています： http://css-tricks.com/using-svg/

0
matbergman

私にとって、このMIMEタイプのエラーは、クライアント要件ごとにSafari 4.05をテストするときにのみ、コンソールで表示されました。最終的にこれは、Safariがjavascriptのスタイリングelement.style.backgroundImage="url()";を不適切に処理したために発生しました。明らかに、Safariはその空のURLを探していたので、Strixyとstevecomrieによれば、「none」がより良い選択です。これは、上記とほぼ同じ問題です リソースは他と解釈されますが、MIMEタイプtext/javascript？で転送されますか？ 、ここで<script src="">が犯人でした。

0
grayrabbit

Magento2ユーザーの場合

このファイルを変更した場合app/etc/di.xml

<item name="view_preprocessed" xsi:type="object">Magento\Framework\App\View\Asset\MaterializationStrategy\Copy</item>

パス文字列が大文字と小文字を区別することを確認してください（非Windows OSの場合は大文字と小文字を区別します）

buntにmagento2をインストールした後に404エラーが発生した場合。

インストールと有効化rewrite module

a2enmod rewrite

次に編集

 /etc/Apache2/sites-available/000-default.conf

最後に次の行を追加します

<Directory "/var/www/html">
    AllowOverride All 
</Directory>
0
abdul rashid

私にとっては、コンソールでエラーを引き起こした画像から画像を取得しようとしていたcssファイルに対して、パスが正しく設定されていませんでした。

私は2つのディレクトリを出てから、自分のイメージがあったディレクトリに移動しなければなりませんでした。それぞれ。もう1つのディレクトリが表示されます。

例url（../Folder/ImagesFolder/image.gif）

0
Terri Swiatek

画像に読み取り権限がない場合があります

また、TinyPNGを使用して画像を圧縮すると、この問題が発生しました。「リソースは画像として解釈されますが、MIMEタイプtext/htmlで転送されました」というエラーメッセージが表示されます。次に、画像の許可を追加します、それは動作します。

0
weimin

これは、imgタグを介してSVG画像を含めるときに発生しました。タグを介してSVG画像を含める場合は、代わりにObjectタグに切り替える必要があります：<object type="image/svg+xml" data="imageFile.svg"> Test SVG Logo </object>

0
TechMaze