【问题标题】:Uplaod image over 4 mb using asp file uploader?使用 asp 文件上传上传超过 4 mb 的图像?
【发布时间】:2013-07-29 09:10:58
【问题描述】:

我正在使用一个 ASP 文件上传器,通过它我在单击按钮时上传图像。每当我上传超过 4 mb 的图像时,它就会崩溃。如果我在配置中为 maxrequestlength 定义大小 然后如果我再次超过文件大小它会崩溃。如果上传了一个大文件,是否可以限制用户并显示免责声明消息。我的意图是让用户知道文件很大。

aspx 页面

<tr>
                    <td align="center" class="title" colspan="2">
                        Image Upload
                    </td>
                </tr>
                <tr>
                    <td align="center" colspan="2">
                        <asp:Label ID="lblImageDisclaimer" runat="server" Text="Please upload an image file less than 3MB in size"
                            Font-Bold="true" ForeColor="Highlight"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td align="center" colspan="2">
                        <asp:DropDownList ID="ddlImageType" runat="server" AutoPostBack="false" OnSelectedIndexChanged="ddlImageType_SelectedIndexChanged">
                        </asp:DropDownList>
                    </td>
                </tr>
                <tr>
                    <td align="center" colspan="2" id="tdUpload" runat="server">
                        <asp:Label ID="lblImage1" runat="server" Text="Upload images : " Font-Bold="true"></asp:Label>
                        &nbsp;
                        <asp:FileUpload ID="fileUploader" runat="server" /><asp:Button ID="btnUpload" CssClass="button"
                            runat="server" Text="Upload" OnClick="btnUpload_Click" OnClientClick="javascript:return validateFile();" />
                        <asp:Label ID="lblMessage" runat="server" Text="" CssClass="errorText"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td id="Td2" runat="server" align="center" colspan="1">
                        <asp:Label ID="Label1" runat="server" Text="SCREENSHOT 1" Font-Bold="true"></asp:Label>
                    </td>
                    <td id="Td3" runat="server" align="center" colspan="1">
                        <asp:Label ID="Label2" runat="server" Text="SCREENSHOT 2" Font-Bold="true"></asp:Label>
                    </td>
                </tr>
                <tr>
                    <td id="imgHolder" runat="server" align="center" colspan="1">
                        <div style="border: SOLID 1px BLACK; width: 575px; height: 250px; overflow: auto;">
                            <%--<asp:Image ID="imgPreview" runat="server" ImageUrl="~/FIRE/ImageHandler.ashx?id=1&imageNo=2" />--%>
                            <asp:Image ID="imgPreview" runat="server" />
                        </div>
                    </td>
                    <td id="imgHolder2" runat="server" align="center" colspan="1">
                        <div style="border: SOLID 1px BLACK; width: 575px; height: 250px; overflow: auto;">
                            <%--<asp:Image ID="imgPreview" runat="server" ImageUrl="~/FIRE/ImageHandler.ashx?id=1&imageNo=2" />--%>
                            <asp:Image ID="imgPreview2" runat="server" />
                        </div>
                    </td>
                </tr>
                <tr>
                    <td id="tdDelete1" align="left" style="width: 100%; padding-left: 15px;" colspan="1">
                        <asp:Button ID="btnDelete1" runat="server" Text="Delete" CssClass="button" OnClick="btnDelete_Click"
                            ToolTip="Click to Delete" OnClientClick="javascript:return  confirm('Are you sure you want to delete this image?');" />
                    </td>
                    <td id="tdDelete2" align="left" style="width: 100%" colspan="1">
                        <asp:Button ID="btnDelete2" runat="server" Text="Delete" CssClass="button" OnClick="btnDelete_Click"
                            ToolTip="Click to Delete" OnClientClick="javascript:return  confirm('Are you sure you want to delete this image?');" />
                    </td>
                </tr>

.cs 页面事件。 protected void btnUpload_Click(对象发送者,EventArgs e) { 尝试 { //hfCurrentId.Value = "工作项id:" + hfWorkItemID.Value; 如果 (fileUploader.HasFile) { if (fileUploader.PostedFile.ContentType.Contains("image") && 文件上传器.PostedFile.ContentLength

                    if (ddlImageType.SelectedValue == "1")
                    {
                        Session["FileBytes"] = fileUploader.FileBytes;
                        hfImage1Byte.Value = Convert.ToBase64String(fileUploader.FileBytes);
                        imgPreview.ImageUrl = "~/Handlers/ImageHandler.ashx?workItemId=" + workItemId
                        + "&imageTypeId=" + ddlImageType.SelectedValue;
                    }
                    else
                    {
                        Session["FileBytes2"] = fileUploader.FileBytes;
                        hfImage2Byte.Value = Convert.ToBase64String(fileUploader.FileBytes);
                        imgPreview2.ImageUrl = "~/Handlers/ImageHandler.ashx?workItemId=" + workItemId
                        + "&imageTypeId=" + ddlImageType.SelectedValue;
                    }


                }
                else
                {
                    lblMessage.Text = Constants.ImageFileError;
                }
            }
            else
            {
                lblMessage.Text = Constants.FileError;
            }
            //lblHeader.Text = hfCurrentId.Value;
            //upPanel1.Update();
        }
        catch (System.Exception ex)
        {
            //DisplayError(ex);
            Session["ExceptionDetails"] = ex;
            Response.Redirect(Constants.FIREErrorDetails);
        }
    }

在这里我将大小限制为 3145728 并以客户端大小处理它

function validateFile() {
            var strFileName = document.getElementById('<%=fileUploader.ClientID %>').value;
            var strExtName = strFileName.substring(strFileName.lastIndexOf('.')).toLowerCase();
            var objFSO = new ActiveXObject("Scripting.FileSystemObject");
            var e = objFSO.getFile(strFileName);
            var fileSize = e.size;
            //file size limit for 3mb
            if (fileSize > 3145728) {
                alert("Maximum size of uploaded file should be less than 3 MB.");
                return false;
            }
            else
                return true;
        }

有没有其他方法可以避免

var objFSO = new ActiveXObject("Scripting.FileSystemObject");

由于某些客户端问题,我无法使用 ActiveXObject

【问题讨论】:

    标签: c# javascript asp.net ajax jquery


    【解决方案1】:

    假设您没有使用 HTML5。假设您没有按照 Karl 的建议使用自定义/第三方组件。

    (1) 您需要先在 IIS 的 web.config 中限制上传大小:

    <system.webServer>
        <security>
            <requestFiltering>
                <requestLimits maxAllowedContentLength="YOUR_MAX_ALLOWED_SIZE IN BYTES"/>
            </requestFiltering>
        </security>
    </system.webServer>
    

    (2) 确保 ASP.Net 的 httpRuntime 中的值匹配:

    <httpRuntime executionTimeout="SECONDS" maxRequestLength="YOUR_MAX_ALLOWED_SIZE IN KB"/>
    

    (3) 检查大小是否超出服务器端代码并​​适当通知用户:

    if (fileUpload.PostedFile.ContentLength > (YOUR_MAX_ALLOWED_SIZE - n)) {
        // where "n" is arbitrary number to intercept uploads before IIS kicks it
        // you display limit to users as (YOUR_MAX_ALLOWED_SIZE - n)
        // inform problem to the user here
    }
    

    除非您使用 HTML5 File API,否则您无法在客户端检查它。因此,用户必须等到整个文件上传完毕,然后才被刷爆。因此,请谨慎设置 YOUR_MAX_ALLOWED_SIZE。

    更新

    如您所见,如果尺寸超过限制,则很难捕捉。有一些解决方法:

    1. 设置自定义错误:

    2. system.webServer 部分设置httpErrors

    在此处查看 Marcus 接受的答案:Display custom error page when file upload exceeds allowed size in ASP.NET MVC

    【讨论】:

      【解决方案2】:

      简短的回答是不,您不能使用代码来捕获大文件并通知用户,因为在您的任何代码执行之前会检查 IIS 设置,因此为时已晚。

      如果您想要更好的用户体验,那么我建议您研究一些开源解决方案,如下所示:

      1. 自定义 HTTP 模块

        NeatUpload 是免费选项。

      2. Silverlight/Flash 选项

        SWFUpload 是免费选项。

      3. 异步分块选项

        RadAsyncUpload - Telerik's ASP.NET AsyncUpload 是付费选项,请查看网站了解价格。

      【讨论】:

      • 我可以使用 AjaxFileUploader 吗?
      • 如果您专门针对 HTML5 浏览器,那么是的,您可以在上传之前使用 HTML5 File API 获取文件大小,但如果您有任何用户使用基于 HTML4 的浏览器,那么这将适用窗外。如果您阅读了 ASP.NET AJAX AjaxFileUploader 的文档,它会说它需要 HTML5 来获得进度反馈;否则它会显示一个微调器。所以它真的归结为 HTML5 与否; HTML5 开辟了许多可能性,但要注意并非所有版本的 IE 都支持所有 HTML5 功能;查看Can I Use 网站。
      猜你喜欢
      • 2011-11-01
      • 2013-12-11
      • 2020-01-18
      • 2018-06-06
      • 2019-06-29
      • 2019-05-11
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多