首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >asp.net mvc 3剃刀文件上传

asp.net mvc 3剃刀文件上传
EN

Stack Overflow用户
提问于 2012-05-11 03:29:05
回答 3查看 8.1K关注 0票数 3

使用asp.net mvc3剃刀上传单个文件并使用jquery进行验证的最佳方式是什么?

我只需要用户上传jpg,png小于5mb。

谢谢

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2012-05-11 04:05:24

您需要使用javascript进行验证,下面是一个示例

代码语言:javascript
复制
function onSelect(e) {
    if (e.files[0].size > 256000) {
        alert('The file size is too large for upload');
        e.preventDefault();
        return false;
    }
    // Array with information about the uploaded files
    var files = e.files;
    var ext = $('#logo').val().split('.').pop().toLowerCase();
    if ($.inArray(ext, ['gif', 'jpeg', 'jpg', 'png', 'tif', 'pdf']) == -1) {
        alert('This type of file is restricted from being uploaded due to security reasons');
        e.preventDefault();
        return false;
    } 
    return true;
}

这说明文件大小不能超过256K,并且只允许gif、jpg、jpeg、tif、png和pdf。只需将256000更改为5000000和您的特定文件类型

我在MVC3中的一个带有Telerik上传控件的剃刀视图中使用了它。您也可以使用标准的上载输入,只需在选择时或提交前触发此事件

票数 8
EN

Stack Overflow用户

发布于 2012-05-11 05:44:57

除了jQuery验证(非常好的Acid的回答),你还应该做服务器验证。下面是一些简单的例子:

视图:

代码语言:javascript
复制
@if (TempData["imageUploadFailure"] != null)
{
    @* Here some jQuery popup for example *@
}

@using (Html.BeginForm("ImageUpload", "Home", FormMethod.Post, new { enctype = "multipart/form-data" }))
{                  
    <legend>Add Image</legend>

    <label>Image</label>
    <input name="image" type="file" value=""/>
    <br/>

    <input type="submit" value="Send"/>
}

控制器:

代码语言:javascript
复制
public ActionResult ImageUpload()
{
    return View();
}

[HttpPost]
public ActionResult ImageUpload(HttpPostedFileBase image)
{
    var result = ImageUtility.SaveImage("/Content/Images/", 1000000, "jpg,png", image, HttpContext.Server);

    if (!result.Success)
    {
        var builder = new StringBuilder();
        result.Errors.ForEach(e => builder.AppendLine(e));

        TempData.Add("imageUploadFailure", builder.ToString());
    }

    return RedirectToAction("ImageUpload");
}

ImageUtility帮助器类:

代码语言:javascript
复制
public static class ImageUtility
{
    public static SaveImageResult SaveImage(string path, int maxSize, string allowedExtensions,  HttpPostedFileBase image, HttpServerUtilityBase server)
    {
        var result = new SaveImageResult { Success = false };

        if (image == null || image.ContentLength == 0)
        {
            result.Errors.Add("There was problem with sending image.");
            return result;
        }

        // Check image size
        if (image.ContentLength > maxSize)
            result.Errors.Add("Image is too big.");

        // Check image extension
        var extension = Path.GetExtension(image.FileName).Substring(1).ToLower();
        if (!allowedExtensions.Contains(extension))
            result.Errors.Add(string.Format("'{0}' format is not allowed.", extension));

        // If there are no errors save image
        if (!result.Errors.Any())
        {
            // Generate unique name for safety reasons
            var newName = Guid.NewGuid().ToString("N") + "." + extension;
            var serverPath = server.MapPath("~" + path + newName);
            image.SaveAs(serverPath);

            result.Success = true;
        }

        return result;
    }
}

public class SaveImageResult
{
    public bool Success { get; set; }
    public List<string> Errors { get; set; }

    public SaveImageResult()
    {
        Errors = new List<string>();
    }
}

您也可以修补响应格式,不同的文件重命名或添加多个文件处理等功能。

票数 5
EN

Stack Overflow用户

发布于 2012-09-10 17:02:14

这只是为了指定要接受的文件类型: MSvisualstudio2010。

在您的视图(.cshtml)中:

代码语言:javascript
复制
ATTACHMENT:<input type="file" name="file" id="file" accept=".PNG,.TXT,.JPG,.BMP" />

只需指定所需的格式即可。

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/10540901

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档