如何使用asp.net mvc3 razor上传单个文件并使用jquery进行验证是最佳方法。
我只需要上传小于5 mb的jpg、png文件。
谢谢。
如何使用asp.net mvc3 razor上传单个文件并使用jquery进行验证是最佳方法。
我只需要上传小于5 mb的jpg、png文件。
谢谢。
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;
}
@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"/>
}
控制器:
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辅助类:
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>();
}
}
您还可以调整响应格式,更改文件命名方式,为多文件处理添加功能等。
这仅用于指定要接受的文件类型:MSvisualstudio2010。
在您的View(.cshtml)中:
ATTACHMENT:<input type="file" name="file" id="file" accept=".PNG,.TXT,.JPG,.BMP" />
只需指定所需格式。