第32章 uView多文件上传

1 WebApi.Controllers.ProductController

using Microsoft.AspNetCore.Mvc;

using Microsoft.Net.Http.Headers;

using WebApi.Data;

using WebApi.Domain.Catalog;

namespace WebApi.Controllers

{

    [ApiController]

    [Route("[controller]/[action]")]

    public class ProductController : ControllerBase

    {

        private readonly EFCoreContext _eFCoreContext;

        private readonly IHttpContextAccessor _httpContextAccessor;

        private readonly IWebHostEnvironment _webHostEnvironment;

        public ProductController(EFCoreContext eFCoreContext,

         IHttpContextAccessor httpContextAccessor,

         IWebHostEnvironment webHostEnvironment)

        {

            _eFCoreContext = eFCoreContext;

            _httpContextAccessor = httpContextAccessor;

            _webHostEnvironment = webHostEnvironment;

        }

        private string GetAbsoluteAvatarUrl(string virtualAvatarUrl)

        {

            string absoluteAvatarUrl = string.Empty;

            var hostHeader = string.Empty;

            if (_httpContextAccessor.HttpContext.Request.IsHttps)

            {

                hostHeader = "https://" + _httpContextAccessor.HttpContext.Request.Headers[HeaderNames.Host];

            }

            else

            {

                hostHeader = "http://" + _httpContextAccessor.HttpContext.Request.Headers[HeaderNames.Host];

            }

            if (string.IsNullOrEmpty(virtualAvatarUrl))

            {

                absoluteAvatarUrl = hostHeader + "/images/Product/Default.jpg";

            }

            else

            {

                absoluteAvatarUrl = hostHeader + virtualAvatarUrl;

            }

            return absoluteAvatarUrl;

        }

        #region CURD

        [HttpGet]

        public List<Product> ProductList()

        {

            var productList = _eFCoreContext.ProductDbSet.ToList();

            for (int i = 0; i < productList.Count; i++)

            {

                var pictureList = _eFCoreContext.PictureDbSet.Where(p=>p.ProductId.Equals(productList[i].Id)).ToList();

                for (int j = 0; j < pictureList.Count; j++)

                {

                    pictureList[j].VirtualPath = GetAbsoluteAvatarUrl(pictureList[j].VirtualPath);

                }

                productList[i].PictureCollection = pictureList;

            }

            return productList;

        }

        /// name="id">1个指定产品的长整型值。

        /// name="formFileCollection">多个指定的上传文件实例的集合。

        ///

        /// 【上传多个文件--无需权限】

        ///

        ///

        /// 摘要：

        ///     把多个指定的上传文件从客户端上传到服务器端的指定目录中。

        /// 说明(elmentUI Upload组件)：

        ///   1、如果使用头属性字典传递customerId参数实例，则不用使用“[FromForm]”标记，

        /// URL为：this.actionRequestUrl = "https://localhost:7239/Customer/PostAvatarStream?customerId=" + this.formUser.id;

        ///   2、如果使用“:data/:form-data”传递customerId参数实例，则必须使用“[FromForm]”标记，否则customerId参数实例会一直为:0，

        /// URL为：this.actionRequestUrl = "https://localhost:7239/Customer/PostAvatarStream"。

        /// 注意：

        ///   formFileCollection参数实例在多文件上传中1次只包含1个指定的上传文件实例。

        ///

        ///

        /// 返回：

        ///     多个指定的上传文件上传操作后的状态信息。

        ///

        [HttpPost]

        public bool PostAvatarStream([FromForm] long id, IFormFileCollection formFileCollection)

        {

            if (formFileCollection != null)

            {

                foreach (IFormFile formFile in formFileCollection)

                {

                    if (formFile.Length > 0)

                    {

                        string _avatarDirectory = _webHostEnvironment.WebRootPath + @"\images\Product\"+id+ @"\";

                        string _filePath = string.Empty;

                     

                         string _filename = Guid.NewGuid().ToString() + Path.GetExtension(formFile.FileName);

                        _filePath = _avatarDirectory + _filename;

                        using FileStream fileStream = new FileStream(_filePath, FileMode.Create);

                        formFile.CopyTo(fileStream);

                        Picture picture = new Picture();

                        picture.ProductId = id;

                        picture.VirtualPath= $"/images/Product/{id}/{_filename}";

                        _eFCoreContext.PictureDbSet.Add(picture);

                        _eFCoreContext.SaveChanges();

                    }

                }

                return true;

            }

            return false;

        }

        #endregion

    }

}

2 pages\Product\ProductList\ProductList.vue

lang="scss" scoped>

    .content {

        display: flex;

        flex-direction: column;

        align-items: center;

        justify-content: center;

        padding: 40rpx;

    }

    .logo {

        height: 200rpx;

        width: 200rpx;

        margin-top: 100rpx;

        margin-left: auto;

        margin-right: auto;

        margin-bottom: 50rpx;

    }

    .text-area {

        display: flex;

        justify-content: center;

    }

    .title {

        font-size: 28rpx;

        color: $u-content-color;

    }

    .button-demo {

        margin-top: 80rpx;

    }

    .link-demo {

        margin-top: 80rpx;

    }

对以上功能更为具体实现和注释见：230722_032WebApi(uView多文件上传)

230722_006uView_default(uView多文件上传)