.NET TIPS

[ASP.NET]任意の画像を出力してブラウザで表示するには?[C#、VB]

デジタルアドバンテージ 岸本 真二郎
2009/06/11

 ASP.NETによるWebアプリケーションでは、Imageコントロールを使ってWebページに画像を配置できる。

<asp:Image ID="Image1" runat="server" ImageUrl="fdotnet_m.gif" />

 当然ながら、ImageUrlプロパティで指定した画像がページに表示される。ただしこの場合は、あらかじめ静的に指定した画像ファイルしか表示することができない。

レスポンスへの画像ファイルの出力

 ASP.NETでは、ページのリクエストに対して(HTMLではなく)画像をそのまま返すことが可能だ。これにより、Imageコントロールや<img>タグで、サーバ側で動的に読み込んだ画像を表示することができる。

 次のコードでは、リクエストを受けると、サーバに格納された「fdotnet_m.gif」というファイル名の画像ファイルの内容を直接ブラウザに返す。

using System;

namespace WebAppGetImage
{
  public partial class getImage : System.Web.UI.Page
  {
    protected void Page_Load(object sender, EventArgs e)
    {
      Response.ContentType = "image/gif";

      Response.Flush();
      Response.WriteFile("fdotnet_m.gif");
      Response.End();
    }
  }
}
Public Partial Class getImage
  Inherits System.Web.UI.Page

  Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

    Response.ContentType = "image/gif"

    Response.Flush()
    Response.WriteFile("fdotnet_m.gif")
    Response.End()
  End Sub
End Class
画像ファイルの内容を直接ブラウザに返す処理(上:C#、下:VB)

 このコードでは、ブラウザに返すレスポンスである(ページの)Reponseプロパティ(System.Web名前空間のHttpResponseオブジェクト)に対して処理を行っている。まず、Flushメソッドによりレスポンスの内容をいったん空にし、次にWriteFileメソッドによりfdotnet_m.gifの内容を出力し、最後にResponse.Endメソッドによりすべての出力を送信する。Page_Loadメソッドをこのように記述することで、.aspxファイルに記述されたタグの内容はブラウザに返されず、WriteFileメソッドで指定したファイルの内容だけをブラウザに送ることができる。

 なお、ContentTypeプロパティでは、ブラウザに返す画像データの種類を指定する。JPEGファイルなら「image/jpg」、PNGファイルなら「image/png」となる。

画像の表示

 上記のコードを含むページを、例えば「getimage.aspx」という名前で保存した場合、ブラウザで直接このページをリクエストすると、画像が表示されることを確認できる。


getimage.aspxへのアクセスにより画像が表示

 通常のHTMLファイルでこれを利用するなら、以下のように<img>タグのsrc属性に.aspxファイルを指定する。

<!DOCTYPE html PUBLIC
 "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
  <head>
    <title>タイトル</title>
  </head>
  <body>
    <h3>サーバから画像を取得</h3>
    <img src="getImage.aspx" />
  </body>
</html>

 このように、サーバ側で任意に用意した画像を<img>タグで表示できるようになる。End of Article

カテゴリ:Webフォーム 処理対象:画像
使用ライブラリ:HttpResponseクラス(System.Web名前空間)

この記事と関連性の高い別の.NET TIPS
画像ファイルを高速に読み込むには?
画像をファイルに保存するには?
PictureBoxコントロールにWeb画像を表示するには?
[ASP.NET]ブラウザからファイルをアップロードできるようにするには?
[ASP.NET]ページから生成されたソース・コードを見るには?
このリストは、(株)デジタルアドバンテージが開発した
自動関連記事探索システム Jigsaw(ジグソー) により自動抽出したものです。
generated by

「.NET TIPS」


Insider.NET フォーラム 新着記事
  • 第2回 簡潔なコーディングのために (2017/7/26)
     ラムダ式で記述できるメンバの増加、throw式、out変数、タプルなど、C# 7には以前よりもコードを簡潔に記述できるような機能が導入されている
  • 第1回 Visual Studio Codeデバッグの基礎知識 (2017/7/21)
     Node.jsプログラムをデバッグしながら、Visual Studio Codeに統合されているデバッグ機能の基本の「キ」をマスターしよう
  • 第1回 明瞭なコーディングのために (2017/7/19)
     C# 7で追加された新機能の中から、「数値リテラル構文の改善」と「ローカル関数」を紹介する。これらは分かりやすいコードを記述するのに使える
  • Presentation Translator (2017/7/18)
     Presentation TranslatorはPowerPoint用のアドイン。プレゼンテーション時の字幕の付加や、多言語での質疑応答、スライドの翻訳を行える
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

Insider.NET 記事ランキング

本日 月間