之前的文章中有写到在ASP.NET MVC 5中如何使用Layui的上传组件上传图片，文章链接在下面：

ASP.NET MVC5 使用LAYUI 2.2.2 上传组件上传简单示例文件（图片）

上面的文章中讲到的上传图片只是上传到系统所在的本地服务器，但当前实际应用环境中存储在本地服务器通常是不够的，通常是本地服务器作为文件的备份，而上传到OSS或其他的文件或图片公有云服务的作为外部访问，这样在OSS中启用CDN的话，将大大优化这些静态资源的访问速率，达到最优的访问效果。

此处仍然以之前的上传轮播图作为案例：

1、首先需要开通阿里OSS（对象云存储）服务

https://www.aliyun.com/product/oss?utm_content=se_1000000532

2、开通OSS服务后创建一个Bucket 对应你的项目名就可以，并创建自己需要的目录，可以对应项目中的目录

3、下带对应的.NET版本SDK，也可以直接在Nuget服务器中搜索安装

4、在阿里OSS的控制台中找到对应的 AccessKey、AccessSecre、EndPoint  同时你还能绑定自己的域名作为访问方式

5、必须要注意的是，Bucket的访问属性一定要设置为公共读，否则外部环境可访问不了，同时还可以设置防盗链等等

6、接下来就是进行程序Coding啦

相对于之前的轮播图上传案例，前端的代码没有变化：

<div class="layui-form-item">
    <label class="layui-form-label">上传图片</label>
    <div class="layui-input-block layui-upload">
        <button type="button" class="layui-btn" id="btn_UploadImage">上传图片</button>
        <div class="layui-upload-list">
            <img class="layui-upload-img" id="previewBox">
            <p id="remindText"></p>
        </div>
    </div>
</div>

JS代码也没变化，直接请求后端的方法即可：

var $;
layui.use(['form', 'layer', 'jquery','upload'], function () {
    var form = layui.form,
    layer = parent.layer === undefined ? layui.layer : parent.layer,
    laypage = layui.laypage, upload = layui.upload;
    $ = layui.jquery;
    //单张图片上传
    var uploadInst = upload.render({
        elem: '#btn_UploadImage'
      , url: '../CarouselPicture/Upload'
      , before: function (obj) {
          //预读本地文件，需要IE9及以上版本
          obj.preview(function (index, file, result) {
              $('#previewBox').attr('src', result); //图片链接（base64）
          });
      }, done: function (data) {
          //如果上传失败
          if (data.Code != 0) {
              return layer.msg(data.Message);
          }
          //上传成功
          else {
              //设置图片地址
              $(".PicOSSUri").val(data.Data.src);
              $(".PicOSSUri").attr("readonly", "readonly");
              $(".PicOSSUri").css("background-color", "#EBEBE4");
              return layer.msg(data.Message + ":" + data.Data.src);
          }
      }, error: function () {
          //重传
          var demoText = $('#remindText');
          demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini upload-reload">重试</a>');
          demoText.find('.upload-reload').on('click', function () {
              uploadInst.upload();
          });
      }
    });
});

后端的代码在上传本地服务器成功后需要进行上传：

/// <summary>
/// 上传轮播图片
/// </summary>
/// <returns></returns>
[HttpPost]
public ActionResult Upload()
{
    #region + 变量
    //文件大小（字节数）
    long fileSize = 0;
    //重命名的文件名称
    string tempName = "";
    //物理路径+重命名的文件名称
    string fileName = "";
    //文件扩展名
    string extname = "";
    //虚拟路径
    string virtualPath = "/Uploads/Advs/Carousels/";
    //上传固定路径
    string path = Server.MapPath(virtualPath);
    //上传文件夹名称
    string dir = "";
    //获取提交的文件
    var file = Request.Files[0];
    //反馈对象        
    BaseGetResponse<object> _response = new BaseGetResponse<object>();
    #endregion

    #region + 服务器本地文件上传处理

    try
    {
           if (file != null && !string.IsNullOrEmpty(file.FileName))
           {
               dir = DateTime.Now.ToString("yyyy-MM-dd");
               if (!Directory.Exists(path + dir))
               {
                   Directory.CreateDirectory(path + dir);
               }
               extname = file.FileName.Substring(file.FileName.LastIndexOf('.'), (file.FileName.Length - file.FileName.LastIndexOf('.')));
               tempName = Guid.NewGuid().ToString().Substring(0, 6) + extname;
               fileName = path + dir + "/" + tempName;
               fileSize += file.ContentLength;
               using (FileStream fs = System.IO.File.Create(fileName))
               {
                   file.InputStream.CopyTo(fs);
                        fs.Flush();
               }
               _response.Data = new
               {
                   src = virtualPath + dir + "/" + tempName,
               };
               _response.Message = "服务器本地上传成功";
           }
      }
      catch (Exception ex)
      {
         _response.Code = ResultCode.UnknownException;
         _response.Message = "服务器本地上传失败/n" + "错误信息：" + ex.Message;
      }

    #endregion

    #region + OSS对象云存储上传
    try
    {
        FileStream fstream = new FileStream(Server.MapPath(virtualPath + dir + "/" + tempName), FileMode.Open);
        int nBytes = (int)fstream.Length;//计算流的长度
        byte[] byteArray = new byte[nBytes];//初始化用于MemoryStream的Buffer
        int nBytesRead = fstream.Read(byteArray, 0, nBytes);//将File里的内容一次性的全部读到byteArray中去
        //上传到阿里云  
        using (Stream fileStream = new MemoryStream(byteArray))//转成Stream流  
        {
            string md5 = OssUtils.ComputeContentMd5(fileStream, nBytes);
            string today = DateTime.Now.ToString("yyyyMMdd");
            string FileName = tempName;//文件名=文件名+当前上传时间  
            string FilePath = "adv/index/" + today + "/" + FileName;//云文件保存路径  
            OSSConfig config = new OSSConfig();
            //这边的AccessKey 等等信息可以从配置文件获取 也可以直接写死
            //初始化阿里云配置--外网Endpoint、访问ID、访问password  
            OssClient aliyun = new OssClient(config.OSSEndPoint, config.OSSAccessKey, config.OSSAccessSecret);

            //将文件md5值赋值给meat头信息，服务器验证文件MD5  
            var objectMeta = new ObjectMetadata
            {
                ContentMd5 = md5,
            };
            //文件上传--空间名、文件保存路径、文件流、meta头信息(文件md5) //返回meta头信息(文件md5)  
            aliyun.PutObject(config.Bucket, FilePath, fileStream, objectMeta);

            _response.Data = new
            {
                src = config.OSSBindDomain + FilePath,
            };
        }
    }
    catch (Exception ex)
    {
        _response.Code = ResultCode.UnknownException;
        _response.Message = "OSS对象云存储上传失败/n" + "错误信息：" + ex.Message;
        //删除本地上传的图片
        System.IO.File.Delete(fileName);
    }
    #endregion
    return Json(_response);
}

就这样Layui 上传组件上传图片或文件到阿里OSS

阿里OSS其实还提供了很多图片服务，如裁剪、水印等等，有兴趣的可以自己研究一下