Ajax文件上傳器.Net

Question

我已經找到了很多類似這樣的文件加載器的鏈接[這里] [1]

但是它們都需要一個php文件來移動文件。 我想要的是使用Ajax將文件傳遞給ASP處理程序甚至Web服務，以便我可以將其編碼為byte []並將其插入數據庫。

任何有任何想法如何做到這一點的人？

Answer 1

我已經使用jquery.form.js插件將大文件上傳到ASP.NET中的服務器。

FileUpload.aspx

<html>
<head runat="server">
    <title></title>
    <script type="text/javascript" src="Scripts/jquery-1.8.1.min.js"></script>
    <script type="text/javascript" src="Scripts/jquery.form.js"></script>
    <style type="text/css">
        form#upForm
        {
            display: block;
            margin: 20px auto;
            background: #eee;
            border-radius: 10px;
            padding: 15px;
        }

        .progress
        {
            position: relative;
            width: 400px;
            border: 1px solid #ddd;
            padding: 1px;
            border-radius: 3px;
        }

        .bar
        {
            background-color: #B4F5B4;
            width: 0%;
            height: 20px;
            border-radius: 3px;
        }

        .percent
        {
            position: absolute;
            display: inline-block;
            top: 3px;
            left: 48%;
        }
    </style>
</head>
<body>
<h3>File Uploading</h3>

    <form id="upForm" action="UploadHandler.aspx" method="post" enctype="multipart/form-data">
        <input type="file" name="myfile" /><br />
        <input type="submit" value="Upload File to Server" />
    </form>

    <div class="progress">
        <div class="bar"></div>
        <div class="percent">0%</div>
    </div>

    <div id="status"></div>
    <script>
        (function () {

            var bar = $('.bar');
            var percent = $('.percent');
            var status = $('#status');

            if ($.browser.msie ||
                ($.browser.mozilla && $.browser.version.slice(0, 3) < 2))
                $(".progress").hide();

            $('form#upForm').ajaxForm({
                beforeSend: function () {
                    status.empty();
                    var percentVal = '0%';
                    bar.width(percentVal)
                    percent.html(percentVal);
                    if ($.browser.msie ||
                        ($.browser.mozilla && $.browser.version.slice(0, 1) < 2))
                        status.html("uploading....");
                },
                uploadProgress: function (event, position, total, percentComplete) {
                    var percentVal = percentComplete + '%';
                    bar.width(percentVal)
                    percent.html(percentVal);
                },
                complete: function (xhr) {
                    status.html(xhr.responseText);
                },
                resetForm: true

            });

        })();
    </script>
</body>
</html>

UploadHandler.aspx.cs

using System;
using System.Web;

public partial class UploadHandler : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        Response.Clear();
        HttpFileCollection hfc = Request.Files;
        HttpPostedFile hpf = hfc[0];

        string filename = hpf.FileName;
        string folderLoc = @"d:\foldername";

        if (hpf.ContentLength > 0)
            hpf.SaveAs((folderLoc) + @"\" + filename);

        Response.AddHeader("Content-type", "text/html");
        Response.Write("The file " + filename + " is successfully uploaded");
    }
}

需要注意的幾點：

當我嘗試使FileUpload.aspx從MasterPage繼承時遇到了一些問題。
您可以在后面使用相同的Fileupload.aspx頁面代碼，而不是使用單獨的Uploadhandler.aspx文件。 我沒有嘗試過，但是我認為有可能。
除了使用aspx頁面，您還可以嘗試使用generic handler頁面。 再一次，我沒有嘗試過，但是認為可能。
您需要為此使用jquery 1.8.3或更低版本，因為$.browser在更高版本中不可用。 或者您可以編輯代碼以使其與最新版本的jquery一起使用。

Ajax文件上傳器.Net

問題描述

1 個解決方案

解決方案1
0 已采納 2013-10-25 18:59:38

Ajax文件上傳器.Net

問題描述

1 個解決方案

解決方案1 0 已采納 2013-10-25 18:59:38

解決方案1
0 已采納 2013-10-25 18:59:38