ASP.NET4で作成したページのPNG画像が表示されない

Question

サーバにアップロードし、外部からの閲覧において、topページに配置したpng画像が表示されないのです。

IE、firefox、chrome全て表示されません。

原因がなにか調べ、

①画像パスは問題なし

②IEのみの原因でもない

③他の画像は表示（jpgだが）

何が原因と考えられるでしょうか？

Answer 1

その画像はダウンロードできているのですか？

Fiddlerなどのツールで画像へのリクエストがどう処理されているか確認してください。

404や400あたりが出ている気がする。

Answer 2

Fiddlerを使うまでもなく、pngファイルのURLをアドレスバーに入力し画像が表示されるかどうかを確認するべきかと。

ASP.NETと関係なさそうですね。

Answer 3

png ってIIS上のデフォルトでダウンロードできるようにMIME登録されてましたっけ？
そこがあやしい気がします。

---

あおい情報システム株式会社　小野修司（どっとねっとふぁん）

Answer 4

記憶があいまいですが、セキュリティソフトが勝手にネグって表示されなかったケースがあったと思います。

---

★良い回答には回答済みマークを付けよう！ わんくま同盟 MVP - Visual C# http://d.hatena.ne.jp/trapemiya/

Answer 5

C:\inetpub\wwwroot には w-brand.png などPNGファイルがありますから、デフォルトで画像として表示できると思います。

この手の質問では、IISの「静的コンテンツ」機能が有効になっていないパターンが多いですが、今回の場合JPEGは表示できるとのことなのでちょっと違いそう。

Answer 6

皆様御返答ありがとうございます。

佐祐理様、ファイルのURLでの表示はできています。

小野＠どっとねっとふぁん様　　MINE登録というものを調べます

trapemiya様　セキュリティはMicrosoftSecurityEssentialsですが、リアルタイム保護を解除してみましたが表示されませんでした。

Answer 7

> 佐祐理様、ファイルのURLでの表示はできています。

URLを直接たたいて表示できているのであればMIMEがどうこう、という問題はありません。
むしろ、どういった形で表示しようとするとダメなのかを詳述してみてください。
コントロールの内部で表示しようとして、生成されるURLが想定と異なっているため表示されていない、という可能性が高そうです。

＃もしそうなら生成されるHTMLでURL確認すれば一発でわかるはずですが。。。

---

あおい情報システム株式会社　小野修司（どっとねっとふぁん）

Answer 8

単に <img src="xxxxx" ...  の xxxxx が間違っているということ
はないですか？

Answer 9

私の環境では、IIS 7.0上に公開したpng画像は問題なく表示されます。

MIMEも追加・削除していない為、関係ない気がします。

png画像を外部からアクセス(http経由)で表示されたとの事ですので、考えられるのは .aspxファイルで表示しようとしている画像のソースが

不適切である可能性が一番高いのではと思います。　ソースのパス指定は私もはまったことがあります。

表示可能なaaaa.jpg(例名)と同じ階層にbbbb.png（例名)を配置し、ソースをbbbb.pngで動作するか確認してみるとよいかもしれません。

答えになっていなかったら申し訳ありません。

Answer 10

皆様、さまざまな御回答ありがとうございます。

階層で問題が発生するのでしょうか？

imgソース部分をきちんと指定していれば表示できるはずですよね？

現在で

Accountフォルダの中にあるloginページ（←この中で問題の表示できないpngを指定）

同階層にImageフォルダ（←元pngファイルがある場所）

単純に../Image/logo.png　で問題があるのでしょうか？

Answer 11

> 同階層にImageフォルダ（←元pngファイルがある場所）

それが具体的にどうなっているのか分かりませんが、以下のよう
なディレクトリ構造になっていて、logo1.png または logo2.png
を表示したいとすれば、

application root
 |
 |--account
 |    |
 |    |--login.aspx
 |    |
 |    |--image
 |    |    |
 |    |    |--logo1.png
 |
 |--image
 |    |
 |    |--logo2.png

login.aspx ページでは以下のようにすれば OK なはずです。

<img src="image/logo1.png" />
<img src="../image/logo2.png" />

ただし、Visual Studio 標準のテンプレートで作ったとすると、
account フォルダの web.config でアクセス制限がかかっている
ので、logo1.png は表示されないはずです。（これが原因では？）

Answer 12

>ただし、Visual Studio 標準のテンプレートで作ったとすると、
account フォルダの web.config でアクセス制限がかかっている
ので、logo1.png は表示されないはずです。（これが原因では？）

上記のアクセス制限をどのように変更するとよいのでしょうか？

Answer 13

> 上記のアクセス制限をどのように変更するとよいのでしょうか？

その前に、本当に原因が account フォルダの web.config でのア
クセス制限によるものか確認するのが先です。

先のレスにあった、

> ③他の画像は表示（jpgだが）
> ファイルのURLでの表示はできています。

が間違いないとすると、web.config によるアクセス制限はないはず
です。さらに、IIS の MIME の設定も問題ないし、img 要素の src
属性に設定する画像ファイルへのパス設定も問題ないはずです。

そのあたり、理解しているでしょうか。理解できないまま、上のレ
スもイイカゲンに答えてませんか？

Answer 14

他の方の言われたものの確認は行いました。

そのうえで、SurferOnWww様のスレだけは理解できず、確認しようがなかったSurferOnWww様の言われていることを問題解決のために調べたかったのです。

＞が間違いないとすると、web.config によるアクセス制限はないはず
です。さらに、IIS の MIME の設定も問題ないし、img 要素の src
属性に設定する画像ファイルへのパス設定も問題ないはずです。

上記はaccountフォルダ内のweb.configのアクセス制限と言っていたこととは別の話ですよね。同じ話だとするとちょっと言ってる意味を理解できていないです。

Answer 15

> 他の方の言われたものの確認は行いました。

具体的にどうやって確認したか書いてください。手を抜かないで、
確認に使用したコードなども含めてきちんと説明してください。

> 確認しようがなかったSurferOnWww様の言われていることを

確認しようがないなんてことはあり得ないでしょう。まず、web.config
が存在するか調べて、存在していたらその中身を見れば済むことです。

Answer 16

手は抜いていません。皆さんへの返答で書いてある通り、URLでの目的のpng画像の表示、静的コンテンツの有効確認、セキュリティをoffにしての確認、すべて行いました。

web.configが自体はaccountフォルダ内に存在しています。存在していることが分かっているから、これをどう変更したらよいのかわからないのです。

中身を見れば済むと書かれていますが、中身の何を見たらよいのか、SurferOnWww様は、断片的に言われるだけで、提案していただいていることが何がどうなのかわかりません。

ただ、今までSurferOnWww様がおっしゃられていたことがひも解かれた時に答えが出ているのは確かです。

web.configの内容の何をどう変える？書き加える？があれば表示されるのか、お教え願えませんでしょうか？それを行ってみて、もし表示されないのであれば、違う問題があると考えようと思っています。

Answer 17

もう一回だけ書きます。

以下の点だけでいいので、具体的にどうやって確認したか書いてく
ださい。手を抜かないで、確認に使用したコードなども含めてきち
んと説明してください。

> ③他の画像は表示（jpgだが）
> ファイルのURLでの表示はできています。

ディレクトリ構造、login.aspx と画像ファイルの位置、IIS のバー
ジョン、仮想ディレクトリ/アプリケーションの設定とそのエイリア
ス、「③他の画像は表示（jpgだが）」を表示した時に使ったコード、
「ファイルのURLでの表示」は具体的にどうやったのか、何も書いて
ないです。

また、

> web.configが自体はaccountフォルダ内に存在しています。

であれば、何故その中身の要素をググって調べなのですか？　調べて
も分からなかったということであれば、何故それをアップして、どの
部分が問題かを聞かないのですか？

そういうことをきちんとしてもらえているのであれば「手を抜かない
で」とは言いません。

Answer 18

SurferOnWww さんが回答してますが、また理解できないと困りますからもうちょっとかみくだいてあげましょか。

> web.configが自体はaccountフォルダ内に存在しています。存在していることが分かっているから、これをどう変更したらよいのかわからないのです。

> 中身を見れば済むと書かれていますが、中身の何を見たらよいのか、SurferOnWww様は、断片的に言われるだけで、提案していただいていることが何がどうなのかわかりません。

web.configファイルは単なるテキストファイルです。
VSで中身を確認することもできますし、テキストエディタで見ることもできます。
で、そこに記述されている設定については基本的にMSDNのドキュメントで解説されています。

と、ここまで書いてあげないとわかんだろうと思って書いてみました。

＃というか、web.configにどういう設定の記述があって、何を意味しているのか、ってきちんと理解してないと
　実運用のための設定なんてできないはずなんですが。
　きちんと動く環境作れてるのかなぁ、心配だなぁ。。。

---

あおい情報システム株式会社　小野修司（どっとねっとふぁん）

Answer 19

サーバにアップロードし、外部からの閲覧において、topページに配置したpng画像が表示されないのです。

IE、firefox、chrome全て表示されません。

原因がなにか調べ、

①画像パスは問題なし

②IEのみの原因でもない

③他の画像は表示（jpgだが）

何が原因と考えられるでしょうか？

====================================================

VS2012を初めてインストールしWin２００８R2サーバに、新規プロジェクトを作成し何も手を加えず

アップロードしてみました。同じ症状でPNGが表示されません。デバッグモードでは表示しますが？？

お悩みの症状と同じ症状が出ています。現状いろいろ調べましたが、環境的な問題だと思ますが、

わかりません。同様のお悩みかと思います。何かわかりましたら、お教え願います。

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　敬具

Answer 20

oshiete さん＞

別に新しいスレッドを立てて質問することをお勧めします。

ただし、その際には、掲示板の反対側にいて、掲示板に書いて
あること以外は知り得ない回答者に、どのような情報を提供す
れば oshiete さんの環境や実際に試したことの詳細を理解し
てもらえ、的確な回答が得られるかをよく考えて質問してくだ
さい。

Answer 21

同じ症状なので、このスレッドの解決まで見られると、理解と解決にいたると思います。

SurferOnWww様も小野＠どっとねっとふぁん様もほかの方も大変親切な方々ですので、自分の力になる情報を頂けると思います。

SurferOnWww様・小野＠どっとねっとふぁん様現在、問われている中身について理解をして返答させていただきます。

少しお待ちください。また、ご協力していただいていることに感謝いたします。

ルート構造は以下です

application root
 |
 |--account
 |    |
 |    |--login.aspx
 |
 |--login
 |    |
 |    |--loginimages
 |     　　　|--login
  　　　　　　　    |--logo.png

コードはCSSにおいて

background-image：url('../loginimages/login/logo.png’)　no-repeat;

IISは7.5です

ほか画像は

background-image：url('../loginimages/login/ini_login.gif')　no-repeat;

で表示されています

urlは

www.hogehoge.net/hogehoge/login/loginimages/login/logo.png

で表示したいpngが表示がされます

仮想パス　/hogehoge

物理パス　C:￥inetpub￥hogehoge￥hogehoge

エイリアス　hogehoge

Answer 22

えーと、login.aspxのうえでlogo.pngを見せたい、んですよね？
だとすると

> background-image：url('../loginimages/login/logo.png’)　no-repeat;

この相対指定は明らかに間違ってるんですが。。。

むしろ

> ほか画像は
> background-image：url('../loginimages/login/ini_login.gif')　no-repeat;
> で表示されています

こっちが見えるほうがおかしいんじゃないかと。

それとも、提示されてるフォルダ構成のほうが間違ってる？？？

---

あおい情報システム株式会社　小野修司（どっとねっとふぁん）

Answer 23

最初からそのようにきちんと書いてください。そうすれば
8 月始めから今まで 3 ヶ月近くも悩むことはなかったはず
です。

> background-image：url('../loginimages/login/logo.png’)　no-repeat;

パスを囲っている後ろの方のシングルクォート（...logo.png’
の  ’ ）が全角です。

上のコードが、実際に使われている css から一字一句間違い
なくコピペしたのであれば、それが原因だと思います。

半角に直すか、シングルクォートを前後とも削除してみてくだ
さい。

以下、小野さんのレスとダブルところがありますが・・・

もし、上記が原因でなければ、パス指定が間違っているからだ
と思います。

ディレクトリ構造が提示されていた通りなら、login.aspx の
中で、

../loginimages/login/logo.png

は、

application root/loginimages/login/logo.png

を意味します。しかし、提示されているディレクトリ構造では
そのようなパスはありません。以下のようにしなければならな
いはずです。

../login/loginimages/login/logo.png

ただ、他の画像ファイルの場合、以下で OK なのが解せないで
すが・・・

> background-image：url('../loginimages/login/ini_login.gif')　no-repeat;

提示されたディレクトリ構造は正しいですか？　login.aspx と
logo.png の相対関係とパス設定を今一度確認してください。

また、login.aspx と logo.png の相対関係を気にしなくて
済む、絶対パスまたはサイトルート相対パスで試してみてく
ださい。

ASP.NET Web プロジェクトのパス
http://msdn.microsoft.com/ja-jp/library/ms178116%28v=VS.100%29.aspx

なお、Visual Studio のテンプレートで作られる Account フ
ォルダの web.config のアクセス制限は、提示されたディレク
トリ構成が正しければ、関係ありません。

Answer 24

SurferOnWww様

小野＠どっとねっとふぁん様

ありがとうございます。

SurferOnWww様　すみません

> background-image：url('../loginimages/login/logo.png’)　no-repeat;

パスを囲っている後ろの方のシングルクォート（...logo.png’
の  ’ ）が全角です。

上のコードが、実際に使われている css から一字一句間違い
なくコピペしたのであれば、それが原因だと思います。

半角に直すか、シングルクォートを前後とも削除してみてくだ
さい。

この部分は書きミスです。本来半角になっております。

この点を考慮の上で、確認しました。

login.aspxのページ上で

<div　id="logo-login">

　<img　src="../login/loginimages/login/logo.png"　width="450"　height="110"　alt=""　/>

</div>

とCSSとは別にコードを書いていました。

この状態でCSSは

background-image：url('../loginimages/login/logo.png’)　no-repeat;

としており、

http://www.hogehoge.net/hogehoge/Account/login.aspx

でブラウザを見たところ、logo.pngは表示されています。

しかし、

http://www.hogehoge.net

IISの規定のドキュメントにおいて、hogehoge/Account/login.aspxと指定しています

で表示した場合、logo.pngだけが表示されません。

ページ上とCSSに重複していることが原因でしょうか？

また、CSSの方を、

background-image：url('../logo/loginimages/login/logo.png’)　no-repeat;

とするとどちらでも（aspxページはそのままで）logo.pngは見れなくなります

Answer 25

HTML / CSSはWebブラウザーで解釈されていることは理解されていますか？ Webブラウザーはコンテンツがサーバー上のどこに配置されているのか関与しません。

http://www.example.net/hogehoge/Account/login.aspx

というコンテンツ内に ../loginimages/login/logo.png という相対パスで記述があれば

http://www.example.net/hogehoge/loginimages/login/logo.png

というコンテンツをWebサーバーに要求します。

http://www.example.net

というコンテンツ内に ../loginimages/login/logo.png という相対パスで記述があれば、これ以上、親ディレクトリを指すことはできませんから、Webブラウザーとしてはお手上げです。

Answer 26

原因としては佐祐理さんが書いているとおり、でブラウザ上でCSSがどう動作するのかわかっていないことが原因、ですね。

＃CSSというより相対リンクの考え方、か。

で、そもそもIISの既定のドキュメントの使い方がおかしいかと。
たぶん接続してきたときにログインさせたいんだと思いますが、そういう場合のASP.NETの標準的なログインページの見せ方とも異なってます。

ASP.NETの標準の動きとして、きちんと認証のための設定をすると、たとえばWebルートのdefault.aspxページ（このページ名は例です）に接続してきたときに指定したログインページに飛ばす、という処理ができます。
そこでログインすると、元々アクセスしにきていたdefault.aspxページにリダイレクトしてくれる、というところまで特にプログラムを記述せずにフレームワークがやってくれるようになってます。

こういった仕組みを理解して、その仕組みにそった使い方をすることを考えましょう。

---

あおい情報システム株式会社　小野修司（どっとねっとふぁん）

Answer 27

> この部分は書きミスです。本来半角になっております。

相変わらずですね。せめてそのくらいきちんとできないの
ですか？　間違った情報では話にならないじゃないですか。

前のレスで、

また、login.aspx と logo.png の相対関係を気にしなくて
済む、絶対パスまたはサイトルート相対パスで試してみてく
ださい。

と書きましたけど、それはやってみましたか？

アドバイスしたことをきちんとやらないなら、レスしても意
味ないですけど。

Answer 28

返信が遅くなりました。

絶対パスを試したところ、表示されませんでした。

Answer 29

> 絶対パスを試したところ、表示されませんでした。

以前は、ブラウザのアドレスバーに画像の URL 直打ちで表示されたそうですし、以下のレスもありました。それが間違いなければ、その「絶対パス」が間違っているのでしょう。

> http://www.hogehoge.net/hogehoge/Account/login.aspx
> でブラウザを見たところ、logo.pngは表示されています。

絶対パス、サイトルート相対パスと言うのは、具体的に何か理解してますか？

ところで、前にもお願いしましたが、具体的にどうやって試したかぐらいは書いてはいかがですか。回答者がきちんと回答しているのに、質問者が手抜きして一行レスで済ませるというのは、はっきり言って、回答者に対してのみならずこのフォーラムの参加者全員に対して失礼だと思います。