WebSurfer's Home

トップ > Blog 1   |   Login
Filter by APML

MVC でファイルのアップロード

by WebSurfer 3. August 2019 15:58

ASP.NET MVC でファイルをアップロードする方法について書きます。(ダウンロードする方法は先の記事「MVC でファイルのダウンロード」に書きましたのでそちらを見てください)

MVC でファイルのアップロード

普通に form を submit して POST 送信する場合と、jQuery Ajax を利用して非同期で送信する場合の両方の例を紹介します。ちなみに、上の画像は jQuery Ajax を使ってアップロードした結果です。

気をつけるべき点は以下の通りです。

  1. View では form 要素の enctype 属性に "multipart/form-data" が設定されるようにする。
  2. Controller のアクションメソッドでは、アップロードされたファイルがバインドされるパラメータまたはクラスのプロパティは HttpPostedFileBase 型であること。  
  3. 上で述べたバインドされるパラメータまたはクラスのプロパティの名前は、html ソースの <input type="file" ... /> の name 属性と一致させる。
  4. Internet Explorer (IE) でファイルをアップロードすると、クライアント PC でのフルパスがファイル名として送信されることがある(先の記事「IE でアップロードする際のファイル名」を参照)。その場合、HttpPostedFileBase.FieName でファイル名を取得するとクライアント PC でのフルパスになるので、必ず Path.GetFileName を使うこと。  
  5. ワーカープロセスがアップロードするホルダに対する「書き込み」権限を持っていること。
  6. ASP.NET では、デフォルト設定では 4MB を超えるリクエストは送信できないので注意。4MB を超える場合は、web.config の <httpRuntime> セクションの maxLengthRequest の設定で調整できる。

jQuery Ajax を使ってファイルをアップロードする場合は、上記に加えて以下の点に要注目です。

  1. XMLHttpRequest を使用して送信するためのキーと値のペアのセットを取得するために FormData オブジェクトを利用する。詳しくは MDN の記事「FormData オブジェクトの利用」にありますのでそちらを参照してください。
  2. ASP.NET MVC 組み込みの CSRF 防止機能は Ajax でもそのまま使えますので、View での @Html.AntiForgeryToken() と Controller のアクションメソッドへの [ValidateAntiForgeryToken] を忘れずに設定する。

上の画像を表示するのに使ったコードを以下に書いておきます。

Model

public class UploadModels
{
    public string CustomField { get; set; }
    public HttpPostedFileBase PostedFile { get; set; }
}

View

@model Mvc5App.Controllers.UploadModels

@{
    ViewBag.Title = "Upload";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Upload</h2>

@using (Html.BeginForm("Upload", "Home", FormMethod.Post,
                new { enctype = "multipart/form-data" }))
{
    // form 内の隠しフィールドは Ajax でも送信される。
    // なので以下に設定したトークンは送信される。もちろん
    // クッキーのトークンも送信されるので、アクションメソ
    // ッドに [ValidateAntiForgeryToken] を付与すれば
    // CSRF の検証はできる
    @Html.AntiForgeryToken()

    // name 属性はモデルのクラスのプロパティ名と同じにしない
    // とサーバー側でモデルバインディングされないので注意。
    // 大文字小文字は区別しない。
    <input type="file" name="postedfile" />
    <button type="submit">Upload by Submit</button>
    <br />
    @ViewBag.Result
}
<br />
<input type="button" id="ajaxUpload" value="Ajax Upload" />
<br />

<div id="result"></div>


@section Scripts {
  <script type="text/javascript">
    //<![CDATA[
    $(function () {
      $('#ajaxUpload').on('click', function (e) {
        // FormData オブジェクトの利用
        var fd = new FormData(document.querySelector("form"));

        // 追加データを以下のようにして送信できる。フォーム
        // データの一番最後に追加されて送信される
        fd.append("CustomField", "This is some extra data");

        $.ajax({
          url: '/home/upload',
          method: 'post',
          data: fd,
          processData: false, // jQuery にデータを処理させない
          contentType: false  // contentType を設定させない
          }).done(function(response) {
            $("#result").empty;
            $("#result").text(response);
          }).fail(function( jqXHR, textStatus, errorThrown ) {
            $("#result").empty;
            $("#result").text('textStatus: ' + textStatus +
                            ', errorThrown: ' + errorThrown);
          });
      });
    });
    //]]>
  </script>
}

Controler / Action Method

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.ComponentModel.DataAnnotations;
using Mvc5App.Models;
using System.IO;

namespace Mvc5App.Controllers
{
  public class HomeController : Controller
  {
    public ActionResult Upload()
    {
      return View();
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public ActionResult Upload(UploadModels model)
    {
      string result = "";
      HttpPostedFileBase postedFile = model.PostedFile;
      if (postedFile != null && 
          postedFile.ContentLength > 0)
      {
        // アップロードされたファイル名を取得。ブラウザが IE 
        // の場合 postedFile.FileName はクライアント側でのフ
        // ルパスになることがあるので Path.GetFileName を使う
        string filename = 
                  Path.GetFileName(postedFile.FileName);

        // 保存ホルダの物理パス\ファイル名
        string path = Server.MapPath("~/UploadedFiles") + 
                      "\\" + filename;

        // アップロードされたファイルを保存
        postedFile.SaveAs(path);

        result = filename + 
                 " (" + postedFile.ContentType + ") - " +
                 postedFile.ContentLength.ToString() + 
                 " bytes アップロード完了";
      }
      else
      {
        result = "ファイルアップロードに失敗しました";
      }

      if (Request.IsAjaxRequest())
      {
        return Content(result);
      }
      else
      {
        ViewBag.Result = result;
        return View();
      }
    }
  }
}

上の例は単一ファイルをアップロードする場合のものです。複数のファイルをアップロードする場合は、例えば html ソースで以下のように name 属性の値に連番で index を付与できれば、

<input type="file" name="postedfiles[0]" />
<input type="file" name="postedfiles[1]" />
 ・・・中略・・・
<input type="file" name="postedfiles[n]" />

Model のクラスを以下のようにして PostedFiles にモデルバインドできます。

public class UploadModels
{
    public string CustomField { get; set; }
    public IList<HttpPostedFileBase> PostedFiles 
    { get; set; }
}

Tags: , , ,

Upload Download

不正なクロススレッドコールの捕捉

by WebSurfer 11. July 2019 16:43

Windows Forms のマルチスレッドアプリで不正なクロススレッドコールがある場合、Visual Studio から[デバッグの開始(S)]でなら以下のような例外が捕捉されるが、[デバッグなしで開始(H)]では捕捉されないという話を書きます。

不正なクロススレッドコールの捕捉

元の話は Teratail の「非同期処理でデバッグ時・ビルド実行時で処理結果が異なる?」というスレッドから来ています。

例えば、Windows Forms アプリの Button.Click のイベントハンドラで、以下のように AsParallel 拡張メソッドを使ってマルチスレッドで処理するケースを考えます。

private void button4_Click(object sender, EventArgs e)
{
    Enumerable.Range(1, 10).AsParallel().ForAll(z =>
    {
        this.textBox2.Text += z.ToString();
    });
}

this.textBox2.Text += z.ToString(); の行で、textBox2 が作成された UI スレッドとは別のスレッドから textBox2 の呼び出しを行っています。これが不正なクロススレッドコールになります。

このコードを Visual Studio から[デバッグの開始(S)]で実行した場合は、デバッガがこの行で InvalidOperationException 例外をスローし、"コントロールが作成されたスレッド以外のスレッドからコントロール 'textBox2' がアクセスされました" というエラーメッセージを表示します。それが上の画像です。

ところが[デバッグなしで開始(H)]で実行した場合は例外はスローされず、あたかもこのコードは正常終了したかのように見えます。集約的例外ハンドラで捕捉してアプリケーションを終了させるということもできません(そもそも例外がスローされないので)。

という訳で、特にマルチスレッドアプリを開発している場合は必ず[デバッグの開始(S)]で実行して動作確認をするようにした方がよさそうです。

なお、[デバッグなしで開始(H)]でも CheckForIllegalCrossThreadCalls プロパティを true(デフォルトは false)に設定すれば不正なクロススレッドコールで例外をスローさせることはできます。

でも、たぶんオーバーヘッドが増えてパフォーマンスに影響があるでしょうからリリース前には元に戻さなければならず、そんな面倒なことをするより[デバッグの開始(S)]で実行して確認するのが正解だと思います。

Tags:

.NET Framework

デリゲートを利用した非同期メソッドの実装

by WebSurfer 19. June 2019 15:10

Windows Forms アプリでのデリゲートを利用した非同期メソッドの実装について備忘録を書いておきます。.NET Framework 4.5 で async / await / Task.Run が利用できる今はデリゲートを使うことはこの先もうないのかもしれませんが。

非同期メソッドの実装

非同期メソッド実装の変遷については @IT の記事「第1回 .NET開発における非同期処理の基礎と歴史」にまとめられています。デリゲートを使う方法とはその記事の中の「Asynchronous Programming Model(非同期プログラミング・モデル)」です。

上の記事では概要しか書いてなくて分かり難いと思います。詳しく知りたい方は、かなり古い記事ですが同じく @IT の「第2回 .NETにおけるマルチスレッドの実装方法を総括 (1/4)」を見ていただいた方が良く理解できると思います。

上の画像は、以下の同期メソッドを、(1) そのまま同期呼び出し、(2) delegate を利用した非同期呼び出し、(3) async / await / Task.Run を利用した非同期呼び出しを行う windows forms アプリを実行したものです。

// テスト用の時間がかかるメソッド
private string TimeCosumingMethod(string s)
{
    if (string.IsNullOrEmpty(s))
    {
        throw new ArgumentException("引数が無い");
    }
    Thread.Sleep(3000);
    return s + " + ManagedThreadId: " + 
                     Thread.CurrentThread.ManagedThreadId;
}

delegate を利用した非同期呼び出しの場合、(a) EndInvoke を行う対象となるデリゲートの取得、(b) UI スレッドに戻り値を渡す、(c) 例外の捕捉が課題になると思います。

具体例は以下のコードを見てください。上の (a) ~ (c) についてはコールバックメソッド MyCallBack 内で行っています。詳しくはコード内にコメントで書きましたのでそれを見てください。(手抜きでスミマセン)

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using System.Threading;
using System.Runtime.Remoting.Messaging;

namespace WindowsFormsClient
{
  public partial class Form2 : Form
  {
    public Form2()
    {
      InitializeComponent();

      this.textBox1.Text = "サンプル文字列";
    }

    // テスト用の時間がかかるメソッド
    private string TimeCosumingMethod(string s)
    {
      if (string.IsNullOrEmpty(s))
      {
        throw new ArgumentException("引数が無い");
      }
      Thread.Sleep(3000);
      return s + " + ManagedThreadId: " + 
                     Thread.CurrentThread.ManagedThreadId;
    }

    // 同期呼び出し
    private void button1_Click(object sender, EventArgs e)
    {
      this.label1.Text = "ManagedThreadId: " + 
              Thread.CurrentThread.ManagedThreadId + " / ";

      // Application.DoEvents で上の文字列を即ラベルに反映
      Application.DoEvents();

      try
      {
        this.label1.Text += 
                    TimeCosumingMethod(this.textBox1.Text);
      }
      catch(ArgumentException ex)
      {
        MessageBox.Show(ex.Message);
        throw;
      }
    }


    // delegate を利用した非同期呼び出し

    // 別スレッドとして処理したいメソッドをデリゲート宣言
    delegate string MyDelegate(string s);

    // 別スレッドによる処理が終了したことをトリガーとして
    // 自動的に呼び出されるコールバックメソッド
    private void MyCallBack(IAsyncResult ar)
    {
      // 課題 (a) コールバックで EndInvoke を行う対象となる
      // デリゲートの取得
      MyDelegate p = (MyDelegate)((AsyncResult)ar).AsyncDelegate;
      string result = "";

      // 課題 (c) 例外の捕捉
      // コールバックの中でしか例外は捕捉できないので注意
      try
      {
        result = p.EndInvoke(ar);
      }
      catch (ArgumentException ex)
      {
        // Invokeメソッドで UIスレッドで MessageBox を表示
        // (そうする意味はなさそうだが・・・)
        this.Invoke((Action)(() => MessageBox.Show(ex.Message)));
        throw;
      }

      // 課題 (b) UI スレッドに戻り値を渡す
      // Invokeメソッドで UIスレッドの Label に文字列を設定
      this.Invoke((Action)(() => this.label1.Text += result));
    }

    private void button2_Click(object sender, EventArgs e)
    {
      this.label1.Text = "ManagedThreadId: " + 
                Thread.CurrentThread.ManagedThreadId + " / ";
            
      // デリゲートのインスタンスを作成
      MyDelegate p = new MyDelegate(TimeCosumingMethod);

      // デリゲートによるスレッド処理呼び出し
      p.BeginInvoke(this.textBox1.Text, this.MyCallBack, null);
    }


    // async/await/Task を使った非同期呼び出し
    private async void button3_Click(object sender, EventArgs e)
    {
      this.label1.Text = "ManagedThreadId: " + 
                Thread.CurrentThread.ManagedThreadId + " / ";

      try
      {
        this.label1.Text += await Task.Run(() => 
                      TimeCosumingMethod(this.textBox1.Text));
      }
      catch(ArgumentException ex)
      {
        MessageBox.Show(ex.Message);
        throw;
      }
    }        
  }
}

delegete を利用した非同期呼び出しの例外の処置については、上のコードのコールバックメソッド MyCallBack 内で完了できれば良いのですが、処理しないで集約的例外ハンドラで捕捉してからアプリケーションを終了させるというケースも多々あると思います。

それをどうするかについては以下の Main メソッドのコードを見てください。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using System.Windows.Forms;
using System.Threading;

namespace WindowsFormsClient
{
  static class Program
  {
    [STAThread]
    static void Main()
    {
      // 捕捉されなかった例外を処理する集約的例外ハンドラを実装

      // 同期呼出と async/await を使った非同期呼び出しの例外は
      // Application.ThreadException イベントで捕捉

      Application.ThreadException += 
            new ThreadExceptionEventHandler(ThreadException);

      // delegate を使った非同期呼び出しの例外の捕捉
      // Application.ThreadException では UI スレッドの例外しか
      // 捕捉できないので AppDomain.UnhandledException で捕捉
           
      AppDomain currentDomain = AppDomain.CurrentDomain;
      currentDomain.UnhandledException += UnhandledException;

      // だだし、上記では同期呼出と async/await を使った非同期呼
      // び出しの例外の処理が期待通りにならない。デバッグ実行す
      // ると捕捉できているように見えるが MessageBox が出ない。
      // 理由不明。同期、delegate、async/await 全部に対応するに
      // は両方のハンドラを生かしておく必要がある。

      // アプリケーション構成ファイルの設定を無視し、UI スレッド
      // の例外は常に ThreadException ハンドラに送る
      Application.SetUnhandledExceptionMode(
                        UnhandledExceptionMode.CatchException);

      Application.EnableVisualStyles();
      Application.SetCompatibleTextRenderingDefault(false);
      Application.Run(new Form2());
    }

    // Application.ThreadException のハンドラ
    private static void UnhandledException(object sender, 
                                 UnhandledExceptionEventArgs e)
    {
      Exception ex = (Exception)e.ExceptionObject;
      MessageBox.Show("AppDomain のハンドラ\n" + ex.Message);
      Application.Exit();
    }

    // AppDomain.UnhandledException のハンドラ
    static void ThreadException(object sender, 
                                    ThreadExceptionEventArgs e)
    {
      Exception ex = e.Exception;
      MessageBox.Show("Application のハンドラ\n" + ex.Message);

      // Environment.Exit を使わないとダイアログが出るとの記事が
      // あったが、このサンプルでは Application.Exit で問題なし  
      Application.Exit();
    }
  }
}

Microsoft のドキュメント Control.BeginInvoke Method に "Exceptions within the delegate method are considered untrapped and will be sent to the application's untrapped exception handler." と書いてあります。

デリゲートメソッド内で発生した例外を捕捉するには AppDomain.UnhandledException イベントのハンドラを利用します。Application.ThreadException イベントは UI スレッドで発生した例外しか捕捉できません。

なので、(1) 同期、(2) delegate、(3) async / await の全てのケースで集約的例外処理を行うには、(1) と (3) は Application.ThreadException イベントのハンドラで、(2) は AppDomain.UnhandledException イベントのハンドラで処理できるように両方のハンドラを設定するのが正解のようです。

Tags: , , , ,

.NET Framework

About this blog

2010年5月にこのブログを立ち上げました。その後 ブログ2 を追加し、ここは ASP.NET 関係のトピックス、ブログ2はそれ以外のトピックスに分けました。

Calendar

<<  December 2019  >>
MoTuWeThFrSaSu
2526272829301
2345678
9101112131415
16171819202122
23242526272829
303112345

View posts in large calendar