网上关于asp.net mvc与js(jquery)配合上传图片例子不多，大多数还是遇见request.files取值是空。遇见这个问题，可能原因大概两个：1. 使用form时没有加enctype="multipart/form-data"；2. input 没有加名字；3. 前后台传值不正确
关于其他的例子挺多，比如结合form使用，或者使用内置的asp.net语法上传都是可以。
下面介绍一个成功的案例，分为移动端和PC端：

一、移动端

前端代码：

 <!--H5-->
 //之后为了入库的处理存储位置   主要是上传成功后更新图片路径
 <input id="imgTitleUrl" name="imgTitleUrl" type="text" class="form-control " />
 <input id="image" name="image" type="file" />
 <a href="javascript:;" onclick="SaveImg()" style="background-color: blue;" class="label">上传服务器</a>

 <!--JS-->

    /**
     * 上传图片  单个
     **/
    function SaveImg() {
        // js 获取文件对象
        var fileObj = document.getElementById("image").files[0]; 
        if (typeof (fileObj) == "undefined" || fileObj.size <= 0) {
            alert("请选择图片信息！");
            return;
        }
        var formFile = new FormData();
        formFile.append("action", "img");
        formFile.append("file", fileObj); //加入文件对象
        var data = formFile;
        $.ajax({
            url: '@Url.Action("SaveImg", "MISOpUploadion")',//负责处理的接口
            data: data,
            type: "Post",
            dataType: "json",
            cache: false,//上传文件无需缓存
            processData: false,//用于对data参数进行序列化处理 这里必须false
            contentType: false, //必须
            success: function (result) {
            /**
            result格式：
            {
            	"state":"success/error",
            	"url":"图片服务器路径"，
            	"msg":"接口返回提示信息(成功/失败)"，
            	"code":"错误编码，自定义"
            }
            **/
                if (result.state == "success") {
                    $("#imgTitleUrl").val(result.url);
                    alert(result.msg);
                } else {
                    alert(result.msg);
                }
            },
        })
    }

后台代码：

        /// <summary>
        /// 本地上传图片信息至服务器处理
        /// </summary>
        /// <returns></returns>
        [HttpPost] 
        public ActionResult SaveImg()
        {
            string imgurl = "";
            foreach (string key in Request.Files)
            {
                //这里只测试上传第一张图片file[0]
                HttpPostedFileBase file0 = Request.Files[key];
                //转换成byte,读取图片MIME类型
                Stream stream;
                int size = file0.ContentLength / 1024; //文件大小KB
                if (size > 1024)
                {
                    return Json(new {content = "上传图片格式有误！", success = false});
                }
                byte[] fileByte = new byte[2];//contentLength，这里我们只读取文件长度的前两位用于判断就好了，这样速度比较快，剩下的也用不到。
                stream = file0.InputStream;
                stream.Read(fileByte, 0, 2);//contentLength，还是取前两位
                //获取图片宽和高
                //System.Drawing.Image image = System.Drawing.Image.FromStream(stream);
                //int width = image.Width;
                //int height = image.Height;
                string fileFlag = "";
                if (fileByte != null && fileByte.Length > 0)//图片数据是否为空
                {
                    fileFlag = fileByte[0].ToString() + fileByte[1].ToString();
                }
                string[] fileTypeStr = { "255216", "7173", "6677", "13780" };//对应的图片格式jpg,gif,bmp,png
                if (fileTypeStr.Contains(fileFlag))
                {
                    string action = Request["action"];
                    //存储路径    一般情况下都是uploads文件夹
                    string path = "/uploads/"+DateTime.Now.Year+"/"+ DateTime.Now.Month+"/";
                    //文件名称     我用的时间+名称处理  一般会增加一个随机数
                    string fileName = DateTime.Now.Millisecond+Request.Files[key].FileName  ;
                    string fullpath = path;
                    //校验文件夹是否存在  不存在进行创建
                    if (!Directory.Exists(Server.MapPath(fullpath)))
                    {
                        Directory.CreateDirectory(Server.MapPath(fullpath));
                    }
                    //文件保存信息
                    Request.Files[key].SaveAs(Server.MapPath(fullpath)+ fileName);
                    //最后输出存储的图片路径信息
                    imgurl = fullpath + fileName; 
                }
                else
                {
                    return Json("");
                }
                stream.Close();
            }
            return Json(new {content = "上传成功", success = true});
        }

总结：

1. 接口处理的时候 为了省事 直接用Json输出了 这样看起来比较方便，
2. 接口处理是可以进行多个图片的处理的， 上述例子中在传值的时候将file[0]删掉。imgurl处理起来也比较快，先判断是否为空，空就取第一个URL，不为空用，(英文)隔开就行。
至于多张图片的样式问题，建议结合jquery使用，特别多张图片的处理。
具体实现：

var fileObj = document.getElementById("choose-file").files; 
//原生js获取的DOM集合是一个类数组对象，不能直接利用数组的方法 （例如：forEach，map等），需要进行转换为数组后，才能用数组的方法！
let fileObjList = Array.prototype.slice.call(fileObj);

//处理多张图片上传
for (let i = 0; i<fileObjList.length; i++) {
    formFile.append("file"+i, fileObjList[i]);
}

原理就是formFile append 多个键值对，后台根据Request.Files的key进行循环存储图片。

3. 例子中使用的判断文件格式可能有点繁琐，建议使用后缀判断，但是这也是个方法判断。
4. ajax那里的URL建议使用razor自带的语法吗，这样上传到服务器就不会出现请求异常。

二、PC端

前端使用Layui框架：

html部分：

 <button type="button" class="layui-btn layui-btn-danger" id="ImgUpload" style="margin-top: 5px"><i class="layui-icon"></i>上传图片</button> 
 <span id="appendTo"></span> 
 <span style="margin-left: 5px">图片大小不超过4M。</span> 
 <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;"> 
     预览图： 
     <div class="layui-upload-list" id="demo2"></div> 
 </blockquote> 

js部分：

//上传图片，设定文件大小限制
upload.render({
elem: '#ImgUpload',
url: '@Url.Action("Upload", "MISOption")',//此处配置你自己的上传接口即可,
// size: 4096 //限制文件大小，单位 KB, 4096代表4M,
before: function(obj){
  //预读本地文件示例，不支持ie8
  obj.preview(function(index, file, result){
      $('#appendTo').append('<span class="delete-css"><button id="upload_img" class="layui-btn layui-btn-sm layui-btn-primary"><i class="layui-icon"></i></button></span>');
      $('#demo2').append('<img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" width="100px" height="200px">');
      //删除某图片
      $("#upload_img").bind('click', function () {
          delete file;
          $("#container").remove();
          var demoText = $('#demoText');
          demoText.html('');
          $("#ImgUpload").attr("disabled",false);
      });
  });
},
done: function(res){
    $("#ImgUpload").attr("disabled","true");
    layer.msg('仅支持上传一张图片！');
  // console.log(res)
}
});

后端部分：

//保存图片，获取图片存储本地的URL，然后存入数据库
[HttpPost]
public ActionResult Upload(HttpPostedFileBase file)
{
    //获取文件
    HttpPostedFileBase proImage = Request.Files["imgUploadName"]; //获取上传的图片
    if (file != null)
    {
        if (file.ContentLength == 0)
        {
            return Json(new {content = "不可上传空图片！", success = true});
        }
        else
        {
            string fileName = file.FileName;
            string fileFormat = fileName.Split('.')[fileName.Split('.').Length - 1]; // 以“.”截取，获取“.”后面的文件后缀
            Regex imageFormat = new Regex(@"^(bmp)|(png)|(gif)|(jpg)|(jpeg)"); // 验证文件后缀的表达式（自己写的，不规范别介意哈）
            if (string.IsNullOrEmpty(fileName) || !imageFormat.IsMatch(fileFormat)) // 验证后缀，判断文件是否是所要上传的格式
            {
                Json(new {content = "上传图片格式有误！", success = false});
            }
            else
            {
                string timeStamp = DateTime.Now.Ticks.ToString(); // 获取当前时间的string类型
                string firstFileName = timeStamp.Substring(0, timeStamp.Length - 4); // 通过截取获得文件名
                string imageStr = "Upload/"; // 获取保存图片的项目文件夹
                string uploadPath = Server.MapPath("~/" + imageStr); // 将项目路径与文件夹合并
                string pictureFormat = fileName.Split('.')[fileName.Split('.').Length - 1]; // 设置文件格式
                string saveFileName = firstFileName + "." + fileFormat; // 设置完整（文件名+文件格式） 
                string saveFile = uploadPath + saveFileName; //文件路径
                file.SaveAs(saveFile); // 保存文件
                // 如果单单是上传，不用保存路径的话，下面这行代码就不需要写了！
                Global.imageUrl = imageStr + saveFileName; // 设置数据库保存的路径

                return Json(new {content = saveFileName, success = true});
            }
        }
    }

    return Json(new {content = "图片保存失败！", success = true});
}