<div id="uploadErrors" style="color: red;"></div>
このトピックは、アップロード ファイルをファイルまたはメモリストリームとして処理し、保存する方法を説明します。詳細な手順は、各プロセスでメモリストリームとしてファイルを保存トピックをご参照ください。
このトピックをより理解するために、以下のトピックを参照することをお勧めします。
このトピックは、以下のセクションで構成されます。
ファイルをアップロードする際に、通常サーバーで処理します。たとえば、ファイル システムに保存する前にデータベースに保存または圧縮します。
WebUpload コントロールは、明示的に定義されたアプリケーション設定は必要がありません。ただし、次のような構成をお勧めします。
一時ファイルを保存するフォルダー
これは代替フォルダーにファイルを保存するために構成できます。定義しない場合、ファイルはデフォルト位置 ( <project folder>\Uploads ) に保存されます。
ファイル サイズの制限
アップロード ファイルの最大サイズは maxFileSizeLimit
プロパティで設定します。デフォルト値は 4 Mb です。
ファイル保存モード
ファイル保存モードは、ファイルの処理方法 (ファイル ストリームまたはメモリ ストリーム) を指定します。(詳細については、ファイル処理の概要を参照してください)。ファイル保存モードは、FileSaveType
プロパティによって管理され、許可される値はファイル処理の各方法に対応する filestream および memorystream になります。デフォルト値は ファイルストリーム です。
ASPX ページでは、各ファイルのデータ群を処理するメソッドを実装する必要があります。
以下は、 WebUpload でファイルをストリームとして保存する機能の一般的な手順です。
1. WebUpload コントロールをページに 追加
2. (オプション) WebUpload アプリケーション設定の 構成
3.ファイル キャッシュ機能の実装
4. WebUpload *イベント の処理
WebUpload コントロールは、アップロード時にファイルがオンデマンドで処理されるかどうかに基づいて、あるいはサーバーに一時ファイルを保存した後にファイル アップロードを処理する以下の方法を提供します。
ファイル ストリーム処理 - アップロードされるファイルは WebUpload コントロールでまず一時ファイルとして保存されます。保存したらファイルを処理できます。このモードはファイルをサーバーファイルシステムに保存する場合に使用します。
メモリ ストリーム処理 - アップロードしたファイルは、アップロード時 (その後保存) またはメモリにアップロードした後のいずれかのオンデマンドで処理されます。このモードは、アップロード処理に詳細な制御が必要な場合に使用します (ディスクまたはデータベースに保存する前にファイルを圧縮するなど)。
ファイル ストリーム モードは、一時的な場所にファイルをアップロード (fileUploadPath
アプリケーション設定によって示します) し、処理を選択するまで保持されます。アップロードされるファイルを処理するために、UploadFinishing
イベントを処理する必要があります。UploadFinishing
イベントには FilesStream
タイプのパラメーターがあり、アップロードしたファイルにアクセスできます。このパラメーターを使用すると、ファイルを他の場所へ移動できます。ファイルを手動で処理する場合、UploadFinishingEventArgs.Cancel
プロパティを true に設定する必要があります。これによって一時ファイルが Web Upload で削除されます。
UploadFinishing
イベントが処理されない場合、一時ファイルの名前が同じ名前の既存のファイル名を元の名前で上書きして変更されます。
メモリ ストリーム処理を使用する場合、ファイルは手動で処理できる MemoryStream
オブジェクトにアップロードされます。 WebUpload コンポーネントは、MemoryStream
オブジェクトへアップロードするために以下の方法を提供します (処理するイベントとそのイベントを処理する方法に基づいて)。
(推奨) 各グループを処理します。
ファイルを手動で処理するには、FileUploading
イベントを処理する必要があります。 FileUploading の FileUploadingEventArgs
パラメーターにタイプ バイト配列の FileChunk
プロパティが必要です。(このプロパティは、現在/最後のアップロードされたデータ群を保存します。)FileUploading
はキャンセル可能なイベントで、ファイルの一部が処理されているかどうかにかかわらず、 WebUpload コントロールにフィードバックを返すために使用できます。イベントのキャンセルを選択するかどうかは、ファイルの一部を自動または手動で処理するかによります。
ファイルの一部を手動で処理
ファイルの一部を手動で処理する場合、イベントをキャンセルする必要があります。このような場合、 WebUpload は、内部 MemoryStream
オブジェクトに追加します。この方法は、アップロード済みの各ファイルの一部を処理してメモリ ストリームとしてファイルを保存 - 手順) をご参照ください。
ファイルの一部を自動処理
FileUploading
イベントをキャンセルしない場合、ファイルの一部は
FileUploading
イベントを処理するには、UploadProgressManager
クラスの AddFileUploadingEventHandler
メソッドを使用します。UploadProgressManager
は、シングルトン クラス インスタンスで、Instance
プロパティからアクセスできます。
一度にすべてのファイルを処理できます。
これは UploadFinishing
イベントを処理して達成できます。 UploadFinishing の UploadFinishingEventArgs
パラメーターには、FileStream
プロパティがあり、MemoryStream
オブジェクトとしてアップロード ファイルを保持します。このプロパティ (UploadFinishingEventArgs.FileStream
) を使用してファイル データを処理します。
注: この方法は、すべてのファイルがサーバーにアップロードされるまでメモリにファイル データを保持するというデメリットがあります。
この例は、FileUploading
イベントを処理するメモリ ストリーム プロセスを使用し、各ファイルの一部を個別に処理するために WebUpload コントロールを構成する例です。アップロードされたファイルの一部は、ASP.NET キャッシュ バッファーに追加されます。バッファーが特定のしきい値に達するとディスク上のファイルに書き込みます。この方法は、 WebUpload の RAM 使用量を最適化し、それによってより多くのファイル アップロードを同時に処理できます。
この例は、ファイル キャッシュ機能を実装するためにカスタム クラスを作成します。UploadUtils
は静的なクラスで、現在アップロードしているファイルをキャッシュのMemoryStream
ディクショナリで処理します。また、 WebUpload の fileUploadPath アプリケーションを使用して、このディクショナリにファイルを書き込みます。
更に、一時ファイルを保存するフォルダーが作成され、アップロード ファイルの最大サイズが 100 Mb に設定されます。
以下は、各アップロード済みファイルの一部を個別に処理してファイルをメモリ ストリームとして保存するための一般的な要件です。
Microsoft® Visual Studio 2010 またははそれ以降
ASP.NET Framework
Infragistics Ignite UI® 13.1 またはそれ以降
C# ASP.NET Web Application Microsoft Visual Studio プロジェクト “ WebUploadSaveFileAsStreamExample ”
以下のスクリプトがマスター ページに追加されます
<プロジェクト フォルダー>\Uploads フォルダー。一時ファイルがアップロードされます
以下はプロセスの概念的概要です。
1. WebUpload コントロールを ASPX ページ に追加
2. *(オプション) *WebUpload アプリケーション設定
3. ファイル キャッシュ機能の実装
4. WebUpload イベントの処理
5. 結果の確認
以下は、ファイルをメモリ ストリームとしてアップロードする方法の手順です。
1. デザイン ビューで Default.aspx ページを開く
2. ツールボックスで “13.1 ASP.NET CLR 4.0” セクションを開く
注: セクションがない場合、Ultimate UI for ASP.NET コントロールがツールボックスに追加されていない可能性があります。詳細については、 Ultimate UI for ASP.NET 2013.1 トピックの「ツールボックス ユーティリティを実行する」をご参照ください。
3. *WebScriptManager * コントロールをページにドラッグ アンド ドロップ*
4. WebUpload コントロールをページにドラッグ アンド ドロップ
コントロールに JavaScript と CSS ファイルが必要なため、 ig_ui ディレクトリにインポートされますというダイアログ “ ImportDefaultStyleSet ” が表示される場合があります。[OK] を押します。
注: ダイアログが表示されない場合は無効にされている可能性があります。ただし、スクリプトおよびスタイルがインポートされます。
5. WebUpload エラーを表示する div 要素を追加します
div 要素で WebUpload エラーを表示します。以下のコードを WebUpload コントロール コードの後に追加します。
HTML の場合:
<div id="uploadErrors" style="color: red;"></div>
6. *ig_ui ディレクトリをソリューションに追加します
すべてのファイルを表示を有効化 - ソリューション エクスプローラー ウィンドウで [すべてのファイルを表示] ボタンを押します。 ig_ui ディレクトリが表示されます。
ig_ui ディレクトリを右クリックして [プロジェクトに含む] をクリックすると、ディレクトリ全体がプロジェクトに含まれます。
7. WebUpload スクリプト参照をマスターページに追加します
スタイル参照を追加します
Site.Master
ファイルを開きます
以下のスタイル参照を Site.Master
ファイルに追加します。
HTML の場合:
<link href="ig_ui/css/structure/infragistics.css" rel="stylesheet" type="text/css" />
<link href="ig_ui/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" type="text/css" />
スクリプト参照を追加します
Site.Master
ファイルを開きます
jQuery および jQuery UI スクリプトの後に以下のスクリプト参照を Site.Master
ファイルに追加します。
HTML の場合:
<script src="ig_ui/js/infragistics.js" type="text/javascript"></script>
8.(オプション) *サイトの構築して実行します
これでプロジェクトをビルドし、実行できます。ファイルをアップロードして Uploads フォルダーに含まれていることを確認します。
問題がある場合は、ブラウザー エラー コンソールを確認してください。
1. (オプション) 一時ファイル フォルダー を構成します。
以下のコードは、一時ファイルを保存するために Uploads フォルダーを構成します。
XML の場合:
<appSettings>
<add key="fileUploadPath" value="~/Uploads" />
</appSettings>
2. (オプション) ファイル サイズ制限を構成します。
以下のコード セットは、アップロードするファイルの最大サイズを 100 Mb に設定します。
XML の場合:
<appSettings>
<!--100 Mb = 2097152 bytes-->
<add key="maxFileSizeLimit" value="104857600" />
</appSettings>
3.ファイル保存モードを構成します。
以下のコードは、ファイル保存モードを memorystream に設定します。
XML の場合:
<appSettings>
<add key="FileSaveType" value="memorystream"/>
</appSettings>
1.バッファー サイズを構成します。
web.config ファイルを開きます。
バッファー サイズ アプリケーション設定を追加します。
この例では、uploadUtilsBufferSize
アプリケーション設定でディスクにファイル データを書き込む前にバッファリングする際のしきい値を構成します。この構成を使用して ASP.NET キャッシュで独自のファイル バッファリングを実装します。以下のコードは 2 Mb に設定します。
XML の場合:
<appSettings>
<!--2 Mb = 2097152 bytes-->
<add key="uploadUtilsBufferSize" value="2097152" />
</appSettings>
2. UploadUtils.cs ファイルをプロジェクトに追加します。
プロジェクトを右クリックします。
コンテキスト メニューから追加、次に クラス…” を選択します。新しい項目を追加 ダイアログが開きます。
新しい項目を追加ダイアログの 名前 フィールドで UploadUtils.cs
を入力します。
追加を押します。ファイルがプロジェクトに追加されます。
3. UploadUtils
クラスを実装します。
UploadUtils.cs ファイルを開きます。手順のすべてのコードがこのファイルに書き込まれます。
クラスを静的にします。
static
を UploadUtils
クラス定義に追加します。
C# の場合:
public static class UploadUtils
{
// クラス定義については、手順 2 から 7 を参照
}
using
句を追加します。
using
句は、ConfigurationManager
および Path
クラスに必要です。以下のコードは、最初の using 句は ConfigurationManager
クラス用で 2 つ目の using 句は Path
クラス用です。
C# の場合:
using System.Configuration;
using System.IO;
定数の定義
定数は、 uploadUtilsBufferSize および fileUploadPath の web.config ファイルにアプリケーション定義を含まない場合に必要です。
C# の場合:
//4 Mb デフォルト バッファー サイズ
private const int DEFAULT_BUFFER_SIZE = 4 * 1024 * 1024;
private const string DEFAULT_UPLOAD_PATH = "~/Uploads";
バッファー サイズの構成
プロパティを定義します。このプロパティは、 uploadUtilsBufferSize アプリケーション設定を返します。
C# の場合:
public static int BufferSize
{
get
{
int bufferSize;
if (Int32.TryParse(ConfigurationManager.AppSettings ["uploadUtilsBufferSize"], out bufferSize))
{
return bufferSize;
}
return DEFAULT_BUFFER_SIZE;
}
}
アップロードパスを構成します。以下のコードを追加して、静的UploadPath
プロパティを定義します。このプロパティは、 fileUploadPath アプリケーション設定を返します。
C# の場合:
public static string UploadPath
{
get
{
string path = DEFAULT_UPLOAD_PATH;
if (ConfigurationManager.AppSettings["fileUploadPath"] != null)
{
path = ConfigurationManager.AppSettings["fileUploadPath"];
}
if (path.StartsWith("~"))
{
path = HttpContext.Current.Server.MapPath(path);
}
if (!path.EndsWith(Path.DirectorySeparatorChar.ToString()))
path += Path.DirectorySeparatorChar;
if (!Directory.Exists(path))
throw new DirectoryNotFoundException(path);
return path;
}
}
メソッドを構成してキャッシュからストリームを取得します。
GetStreamFromCache
静的メソッドを定義します。この静的メソッドは、指定したキーで MemoryStream
を返します。これを行うには、Dictionary< 文字列を用し、MemoryStream>
オブジェクトを ASP.NET キャッシュで使用します。ファイルがデータの一部をアップロードしている際にこのディクショナリを保持します。しきい値 (UploadUtils.BufferSize
で定義された値) に達すると 、データ群がディスクのファイル データに追加されます。Handle WebUpload イベントの処理 セクションでは、すべてのファイルをキャッシュに保持することが代わりに、UploadUtils.BufferSize
プロパティでサイズが定義されたデータ群をディスクのファイルに書き込みます。
C# の場合:
public static MemoryStream GetStreamFromCache(string key)
{
Dictionary<string, MemoryStream> uploadingFiles = HttpContext.Current.Cache["UploadingFiles"] as Dictionary<string, MemoryStream>;
MemoryStream stream;
if (uploadingFiles == null)
{
uploadingFiles = new Dictionary<string, MemoryStream>();
HttpContext.Current.Cache["UploadingFiles"] = uploadingFiles;
}
if (!uploadingFiles.ContainsKey(key))
{
stream = new MemoryStream();
uploadingFiles.Add(key, stream);
}
else
{
stream = uploadingFiles[key];
}
return stream;
}
メソッドを構成してキャッシュからストリームを削除します。
RemoveStreamFromCache
静的メソッドを定義します。このメソッドはキーを使用してディクショナリから項目を削除します。Handle WebUpload events セクションでは、現在アップロードしているファイル キャッシュからファイルを削除するためにこのメソッドを使用します。
C# の場合:
public static void RemoveStreamFromCache(string key)
{
Dictionary<string, MemoryStream> uploadingFiles = HttpContext.Current.Cache["UploadingFiles"] as Dictionary<string, MemoryStream>;
if (uploadingFiles != null && uploadingFiles.ContainsKey(key))
{
uploadingFiles.Remove(key);
}
}
ファイルにストリームを書き込む* * メソッドを構成します。
AppendStreamToFile
静的メソッドを定義します。この静的メソッドは、MemoryStream
オブジェクトをファイルに書き込みます。メソッドは、ファイル名とMemoryStream
値をパラメーターとして受け付けます。
C# の場合:
public static void AppendStreamToFile(string fileName, MemoryStream stream)
{
using (FileStream fs = new FileStream(fileName, FileMode.Append))
{
stream.WriteTo(fs);
}
}
1.クライアント側イベント
OnError
ハンドラーを追加
Default.aspx ファイルを開きます。
WebUpload1 コントロールを選択します。
Properties ウィンドウを開きます (F4 キー)。
Client Events ノードを展開します。
OnError フィールドの右にあるフィールドをダブルクリックします (あるいは、ドロップ ダウン ボタンを選択して [新しいハンドラーの追加…] オプションを選択します)。
ダイアログの確認 - 新しいクライアント イベント ハンドラーの追加がポップアップで表示されます。OK を押して確定します。
OnError
ハンドラーを実装します。
JavaScript の場合:
function WebUpload1_OnError(eventArgs, infoObject) {
if (infoObject.errorType === "serverside")
$("#uploadErrors").append("<p>" + infoObject.serverMessage + "</p>");
else
$("#uploadErrors").append("<p>" + infoObject.errorMessage + "</p>");
}
この OnError
クライアント サイド ハンドラーは、前の手順で定義した id uploadErrors で div にエラーを追加します。
エラーは、サーバー側とクライアント側の 2 タイプあり、infoObject.errorType
プロパティで識別できます。
infoObject.errorType
== “
の場合、エラーはサーバーの開発コードが原因です。エラー メッセージは、serverside
”infoObject.serverMessage
に保持されます。
infoObject.errorType
== “
の場合、エラーはクライアント側にあります。メッセージは、clientside
”infoObject.errorMessage
に保持されます。詳細については、 「クライアント側イベントの使用」トピックを参照してください。
2.サーバー側イベント
using 句を Default.aspx.cs ファイルに追加します
C# の場合:
using System.IO;
using Infragistics.Web.UI.EditorControls;
それらの句は MemoryStream
クラスと UploadStatus
列挙型で使用されます。
FileUploading
ハンドラーを追加します。
Default.aspx ファイルを開きます。
WebUpload1 コントロールを選択します。
Properties ウィンドウを開きます (F4 キー)。
Events ボタンをクリックして Events タブを開きます。
FileUploading フィールドの右にあるフィールドをダブル クリックします。
FileUploading
ハンドラーを実装します
C# の場合:
protected void WebUpload1_FileUploading(object sender, Infragistics.Web.UI.EditorControls.FileUploadingEventArgs e)
{
MemoryStream stream = UploadUtils.GetStreamFromCache(e.TemporaryFileName);
stream.Write(e.FileChunk, 0, e.FileChunk.Length);
if (stream.Length >= UploadUtils.BufferSize)
{
string fileName = UploadUtils.UploadPath + e.TemporaryFileName;
stream.Flush();
UploadUtils.AppendStreamToFile(fileName, stream);
stream.Close();
UploadUtils.RemoveStreamFromCache(e.TemporaryFileName);
}
e.Cancel = true;
}
FileUploading
イベントは、 FileSaveType アプリケーションが memorystream に設定されている場合に 開発者が手動でデータ アップロードを処理できます。FileUploadingEventArgs
クラスは、アップロードした byte 配列のデータ群を FileChunk
プロパティを含みます。
複数のファイルを一度にアップロードできることが重要です。その結果、このイベントはファイルで非同期に発生します。どのファイルにデータが書き込まれるかを認識するメソッドを採用する必要があります。1 つの方法として、ファイルの一意な名前を確実にする FileUploadingEventArgs.TemporaryFileName
プロパティがありますFileUploading
ハンドラーでは、UploadUtils.GetStreamFromCache
静的メソッドでファイルデータを ASP.NET キャッシュに書き込むためのキーとして TemporaryFileName
を使用します。
FileUploading
ハンドラーは、ストリームの長さが UploadUtils.BufferSize
しきい値を超えた場合もファイル データをファイルに書き込みます。これにより、コンピューター RAM が使用されることを確実にします。
FileFinishing
ハンドラーを追加します。
FileFinishing
ハンドラーを定義するためにセクション B 以降の手順を繰り返します。
FileFinishing
ハンドラーを実装します。
C# の場合:
protected void WebUpload1_UploadFinishing(object sender, Infragistics.Web.UI.EditorControls.UploadFinishingEventArgs e)
{
string uploadFilePath = UploadUtils.UploadPath;
string fileName = UploadUtils.UploadPath + e.TemporaryFileName;
MemoryStream stream = UploadUtils.GetStreamFromCache(e.TemporaryFileName);
UploadUtils.AppendStreamToFile(fileName, stream);
stream.Close();
UploadUtils.RemoveStreamFromCache(e.TemporaryFileName);
string newFileName = UploadUtils.UploadPath + e.FileName;
if (System.IO.File.Exists(newFileName))
System.IO.File.Delete(newFileName);
System.IO.File.Move(fileName, newFileName);
}
UploadFinishing
ハンドラーは、キャッシュに残っている最後のファイルの一部に書き込み、ファイルを元の名前に戻します。同じディレクトリに既存のファイルがある場合、削除されて新しいファイルが書き込まれます。
注: 実環境では、ファイルを上書きする必要はありません。 通常、ユーザー名または識別子を使用してファイルが互いに上書きされないようにします。ただし、これらすべては特定の業務を遂行する機能となります。
FileFinished
ハンドラーを追加します。
FileFinished
ハンドラーを定義するためにセクション B 以降の手順を繰り返します。
FileFinished
ハンドラーを実装します。
C# の場合:
protected void WebUpload1_UploadFinished(object sender, Infragistics.Web.UI.EditorControls.UploadFinishedEventArgs e)
{
switch (e.FileStatus)
{
case UploadStatus.CancelledByClientCommand:
case UploadStatus.CancelledByClientConnection:
// アップロードが失敗した場合にファイルを削除
System.IO.File.Delete(e.TemporaryFileName);
break;
}
}
ユーザーがアップロードをキャンセルしたときに UploadFinished
のシナリオを実装します。この実装は、ファイル データを保存する一時ファイルを削除します。
結果を確認するには、 プロジェクトをビルドして実行します 。ファイルをアップロードしてアップロード ファイルの一時フォルダーを確認します。