最近、Excel スプレッドシートに大量のデータをダウンロードするときに、進行状況インジケーターまたはビジー インジケーターをユーザーに提供する方法を検討していました。~ 3000 行の場合、これには約 9 ～ 10 秒かかるため、ユーザーを楽しませるための何かが必要です。
私は blockUI の使用を検討しましたが、これは最初は素晴らしいことでしたが、問題は、ファイルの確認を受け取った後に UI のブロックを解除する方法でした。私は良い記事を読みました：
そのため、jquery cookie と blockUI を使用することになりました。何らかの理由で Firefox では表示されませんが、IE8 では表示されます (!!!!)。まったく別の問題。
表面的には、その記事のコードは機能します。テストアプリを作成しましたが、すべて問題ありませんでしたが、これを作成中のアプリケーションに適用すると、Cookie の削除に失敗しました。バーに完全なURLがあると気に入らないことがわかりました：
http://localhost:4790/Home.aspx/Index ^^ Global.asax.cs は、このアプリケーションが IIS6 にデプロイされるという事実のために変更されました。
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
"Default", // Route name
"{controller}.aspx/{action}/{id}",
//"{controller}/{action}/{id}", // URL with parameters
new { action = "Index", id = "" } // trying for IIS6
//new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
);
// New - trying for IIS6
routes.MapRoute(
"Root",
"",
new { controller = "Home", action = "Index", id = "" }
);
}
/*
public static void RegisterRoutes(RouteCollection routes)
{
routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
routes.MapRoute(
"Default", // Route name
"{controller}/{action}/{id}", // URL with parameters
new { controller = "Home", action = "Index", id = UrlParameter.Optional } // Parameter defaults
);
}
* */
コントローラーでは、私が持っているインデックスアクションのために：
public ActionResult Index()
{
return View();
}
ホームコントローラーにも、ファイルを送り返す「偽装」するメソッドがあります。また、Cookie「fileDownloadToken」を「export」の値に設定します。
public ActionResult GetFile()
{
Thread.Sleep(5000);
byte[] test = new byte[1000];
this.Response.AppendCookie(new HttpCookie("fileDownloadToken", "export"));
return File(test, "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", "test.xlsx");
}
インデックス ビューの内容は次のとおりです。
@{
ViewBag.Title = "Home Page";
}
<input id="save_button" type="button" value="Get" onclick='window.location.href=("@Url.Action("GetFile")")' />
<script type="text/javascript">
$(document).ready(function () {
$('#save_button').click( function () {
$.blockUI({
message: $('#loading')
});
blockUIForDownload();
});
});
var fileDownloadCheckTimer;
function blockUIForDownload() {
fileDownloadCheckTimer = window.setInterval(function() {
var cookieValue = $.cookie('fileDownloadToken');
if (cookieValue == "export")
finishDownload();
}, 100);
}
function finishDownload() {
window.clearInterval(fileDownloadCheckTimer);
$.cookie('fileDownloadToken', null);
$.unblockUI();
}
</script>
<div id="loading" style="display: none;">
<br />
<img src="@Url.Content("~/Content/Images/loading.gif")" /><br />
<h2>Exporting, Please Wait...</h2>
</div>
さて、上で述べたように、VS2010 で指定されているように localhost: を直接参照すると機能しますが、localhost:/Home.aspx/Index を参照すると失敗します。
IE8 で開発者ツールを使用してデバッグし、アラートなどを使用して Cookie の値を警告しましたが、$.cookie("XXXX", null) を呼び出した後でも Cookie の値は残ります。それが何らかのパス/ドメインの問題であった場合、Cookieの値をまったく取得できないため、ボタンを押した直後にUIのブロックが解除されるという点では逆ですが、