はじめに
Webシステムには、ファイルのアップロードが付き物だと思います。Blogでは、画像のアップロード、掲示板では添付ファイル等々
アイライトでも、幾つかの場面でファイルのアップロードを行っていますので、そのやり方を纏めてみました。
ファイルのアップロード
簡単に説明するとView側に、Html.BeginFormを記述して、FileのアップロードボタンとSubmitボタンを配置します。
Controller側に、ファイルの受け取り用の記述を行います。
では、View側を見てみましょう
<% using (Html.BeginForm("FileUpload", "Home", FormMethod.Post,
new { enctype = "multipart/form-data" }))
{ %>
<p>
<input name="UploadFile" type="file" /><br />
<input type="submit" value="submit" />
</p>
<% } %>
Post先を設定するために、HtmlBeginFormを記述します。引数の内容は、
第一引数:ActionName
第二引数:ControllerName
第三引数:FormMethod
第四引数:htmlAttribute
となります。
上記のように設定すると、下記のようなHTMLが出力されます。
<form action="/Home/FileUpload" enctype="multipart/form-data" method="post">
あと、注意事項としては、ファイルのアップロードボタンに名前を付けておきます。
Postした時の受け取る名前になります。
次に、コントローラ側をプログラムを記述します。
public ActionResult FileUpload() { return View(); } [HttpPost] public ActionResult FileUpload(HttpPostedFileBase uploadFile) { return View(); }
下の方の関数にある、「uploadFile」は、View側のコントロール名と同じにします。
ここまで記述が終わったら、実行してみましょう。
ブラウザーが開き、画面が表示されたら、ファイルを選択してから、Submitボタンを押してみてください。
ブレークポイントを設定しておいて、「uploadFile」変数の中身を確認してくてください。
適当に自分の環境にあるファイルを選択したものを、載せてみました。
[System.Web.HttpPostedFileWrapper]: {System.Web.HttpPostedFileWrapper}
ContentLength: 48298
ContentType: "image/jpeg"
FileName: "C:\\Users\\ishino.ISHINO-HOME\\Pictures\\IMG0001.jpg"
InputStream: {System.Web.HttpInputStream}
無事にファイルがアップロードされていることがわかります。
そうそう、注意事項ですが、、、 Fileをアップロードしてきたときに、FileNameの中身を
自分でオープンして読み込んではいけません。
開発環境ではうまく動くかもしれませんが、サーバーにアップした時には動かなくなります。
FileNameに記述されているは、相手先の環境であってプログラムが実行されているのは、サーバー側ですので、クライアントのファイルは直接見れないからです。
では、どうしたらいいのか? といいますと、
InputStreamに、ファイルの中身が入っています。
FileNameは、ファイル名の取り出し程度のものと思ってください。
InputStreamを貰っても、そこからプログラムを書くのは面倒くさいなと思った方は、
以下のプログラムを利用してみてください。
var buffer = new byte[uploadFile.ContentLength]; uploadFile.InputStream.Read(buffer, 0, uploadFile.ContentLength);
受け取った、ファイル用容量分のメモリを確保して、InputStreamから全部を読みだすプログラムです。
bufferにファイルの全部が入っていますので、何にでも使えると思います。
おわりに
二言ぐらいで終わるかなと思って書き始めましたが、そこそこの長さになりました(笑)難しい部分はないと思いますので、簡単に覚えられるかと思います。
良かったら参考にしてみてください。
調査環境
VS2010 + MVC2ASP.NET
C#
