.NET Core Web API使用HttpClient提交文件的二进制流(multipart/form-data内容类型)

news/2024/5/19 21:48:36 标签: .netcore, 前端, .net, c#

需求背景:

   在需要通过服务端请求传递文件二进制文件流数据到相关的服务端保存时,如对接第三方接口很多情况下都会提供一个上传文件的接口,但是当你直接通过前端Ajax的方式将文件流上传到对方提供的接口的时候往往都会存在跨域的情况,这时候我们就需要通过服务端提交文件流来解决这个跨域的情况。本篇的主角就是使用HttpClient进行Http请求,提交二进制文件流到文件服务器中。

HttpClient简单介绍:

HttpClient类实例充当发送 HTTP 请求的会话。 HttpClient实例是对该实例执行的所有请求应用的设置的集合。 此外,每个 HttpClient 实例都使用其自己的连接池,并从其他实例所执行的请求隔离其请求 HttpClient 。

使用注意点:HttpClient对象比较特殊,虽然继承了IDisposable这个接口但是它可以被共享实例,并且使用完不能立即关闭连接、性能消耗严重。所以我们在使用的时候,需要主动调用Dispose方法来释放它。可以使用using如下所示:

using(var client = new HttpClient())
{
    //do something with http client
}

网上说.NET Core版本的HttpClient存在比较多的问题(不过我自己一直在使用HttpClient做一些http请求),大家也可以HttpClientFactory,ASP.NET Core中使用HttpClientFactory官方教程:

在 ASP.NET Core 中使用 IHttpClientFactory 发出 HTTP 请求

前端使用Ajax-FormData对象上传文件:

注意点:

FormData:对象用以将数据编译成键值对,以便用XMLHttpRequest来发送数据。其主要用于发送表单数据,但亦可用于发送带键数据(keyed data),而独立于表单使用。

contentType:需设置为false,在Ajax中contentType 设置为false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件。

processData:需设置为false,默认为true,表示以对象的形式上传的时候会默认把对象转化为字符串的形式上传。

<div class="text-center">
    <p><input type="file" id="imageFile" onchange="uploadImage(this)" /></p>
</div>

<div id="imageBox">

</div>

<script type="text/javascript">
    //图片上传
    function uploadImage(fileObject) {
        var formData = new FormData();
        var files = $(fileObject).prop('files'); //获取到文件列表【$("#imageFile").get(0)通过id获取文件列表】
        formData.append("files", files[0]);//图片文件流
        console.log('formData=>>>', formData, files);
        $.ajax({
                async: true,
                url:"@Url.Action("UploadImage", "ImageFileManage")",
                type: 'post',
                data: formData,
                //https://segmentfault.com/a/1190000007207128?utm_source=tag-newest
                //在 ajax 中 contentType 设置为 false 是为了避免 JQuery 对其操作,从而失去分界符,而使服务器不能正常解析文件
                contentType: false,
                //告诉jQuery不要去处理发送的数据
                processData: false,
                success: function (res) {
                    console.log(res);
                    if (res.code == 0) {
                        $("#imageBox").append("<img width='100' height='100' src=" + res.msg.completeFilePath+">");
                    }
                }
              });
    }
</script>

接收Ajax传递的文件流,并转化为转化字节类型:

  /// <summary>
    /// 图片文件管理
    /// </summary>
    public class ImageFileManageController : Controller
    {
        /// <summary>
        /// 接收Ajax传递的文件流
        /// </summary>
        /// <param name="files">表单文件信息</param>
        /// <returns></returns>
        public IActionResult UploadImage(IFormFile files)
        {
            //var files = Request.Form.Files[0];//获取请求发送过来的文件
            if (files.Length <= 0)
                return Json(new { code = 1, msg = "请选择需要上传的文件~" });

            var fileBytes = ReadFileBytes(files);
            var fileExtension = Path.GetExtension(files.FileName);//获取文件格式,拓展名
            var result = HttpClientHelper._.HttpClientPost("https://localhost:44347/FileUpload/SingleFileUpload", fileBytes, fileExtension, files.FileName);

            var resultObj = JsonConvert.DeserializeObject<UploadReponse>(result);
            if (resultObj.IsSuccess)
            {
                return Json(new { code = 0, msg = resultObj });
            }
            else
            {
                return Json(new { code = 1, msg = resultObj.ReturnMsg });
            }
        }


        /// <summary>
        /// 文件流类型转化字节类型
        /// </summary>
        /// <param name="fileData">表单文件信息</param>
        /// <returns></returns>
        private byte[] ReadFileBytes(IFormFile fileData)
        {
            byte[] data;
            using (Stream inputStream = fileData.OpenReadStream())//读取上传文件的请求流
            {
                MemoryStream memoryStream = inputStream as MemoryStream;
                if (memoryStream == null)
                {
                    memoryStream = new MemoryStream();
                    inputStream.CopyTo(memoryStream);
                }
                data = memoryStream.ToArray();
            }
            return data;
        }

    }


    /// <summary>
    /// 上传响应模型
    /// </summary>
    public class UploadReponse
    {
        /// <summary>
        /// 是否成功
        /// </summary>
        public bool IsSuccess { get; set; }

        /// <summary>
        /// 结果
        /// </summary>
        public string ReturnMsg { get; set; }

        /// <summary>
        /// 完整地址
        /// </summary>
        public string CompleteFilePath { get; set; }
    }

向目标地址提交图片文件参数数据(HttpClient-上传multipart/form-data内容类型):

注意:

 

/// <summary>
    /// Http网络请求帮助类
    /// </summary>
    public class HttpClientHelper
    {
        private static HttpClientHelper _httpClientHelper;

        public static HttpClientHelper _
        {
            get => _httpClientHelper ?? (_httpClientHelper = new HttpClientHelper());
            set => _httpClientHelper = value;
        }

        /// <summary>
        /// 向目标地址提交图片文件参数数据
        /// </summary>
        /// <param name="requestUrl">请求地址</param>
        /// <param name="bmpBytes">图片字节流</param>
        /// <param name="imgType">上传图片类型</param>
        /// <param name="fileName">图片名称</param>
        /// <returns></returns>
        public string HttpClientPost(string requestUrl, byte[] bmpBytes, string imgType, string fileName)
        {
            using (var httpClient = new HttpClient())
            {
                List<ByteArrayContent> byteArrayContents = new List<ByteArrayContent>();

                var imgTypeContent = new ByteArrayContent(Encoding.UTF8.GetBytes(imgType));
                imgTypeContent.Headers.ContentDisposition = new ContentDispositionHeaderValue("form-data")
                {
                    Name = "imgType"
                };
                byteArrayContents.Add(imgTypeContent);

                var fileContent = new ByteArrayContent(bmpBytes);//填充图片文件二进制字节
                fileContent.Headers.ContentDisposition = new ContentDispositionHeaderValue("form-data")
                {
                    Name = "file",
                    FileName = fileName
                };
                byteArrayContents.Add(fileContent);

                var content = new MultipartFormDataContent();
                //将ByteArrayContent集合加入到MultipartFormDataContent中
                foreach (var byteArrayContent in byteArrayContents)
                {
                    content.Add(byteArrayContent);
                }

                try
                {
                    var result = httpClient.PostAsync(requestUrl, content).Result;//post请求
                    return result.Content.ReadAsStringAsync().Result;
                }
                catch (Exception ex)
                {
                    return ex.Message;
                }
            }
        }
    }

模拟第三方上传文件接口,保存图片到服务端并返回文件预览完整地址:

关于.NET Core上传文件的后端服务接口可以参考我之前写过的文章:

ASP.NET Core单文件和多文件上传并保存到服务端

 /// <summary>
        /// 单文件上传(Ajax,Form表单都适用)模拟第三方服务端接口
        /// </summary>
        /// <param name="file">表单文件信息</param>
        /// <returns></returns>
        public JsonResult SingleFileUpload(IFormFile file)
        {
            try
            {
                if (file != null)
                {
                    var currentDate = DateTime.Now;
                    var webRootPath = _hostingEnvironment.WebRootPath;//>>>相当于HttpContext.Current.Server.MapPath("") 

                    var filePath = $"/UploadFile/{currentDate:yyyyMMdd}/";

                    //创建每日存储文件夹
                    if (!Directory.Exists(webRootPath + filePath))
                    {
                        Directory.CreateDirectory(webRootPath + filePath);
                    }

                    //文件后缀
                    var fileExtension = Path.GetExtension(file.FileName);//获取文件格式,拓展名

                    //判断文件大小
                    var fileSize = file.Length;

                    if (fileSize > 1024 * 1024 * 10) //10M TODO:(1mb=1024X1024b)
                    {
                        return Json(new { isSuccess = false, resultMsg = "上传的文件不能大于10M" });
                    }

                    //保存的文件名称(以名称和保存时间命名)
                    var saveName = file.FileName.Substring(0, file.FileName.LastIndexOf('.')) + "_" + currentDate.ToString("HHmmss") + fileExtension;

                    //文件保存
                    using (var fs = System.IO.File.Create(webRootPath + filePath + saveName))
                    {
                        file.CopyTo(fs);
                        fs.Flush();
                    }

                    //完整的文件路径
                    var completeFilePath = Path.Combine(filePath, saveName);

                    return Json(new { isSuccess = true, returnMsg = "上传成功", completeFilePath = completeFilePath });
                }
                else
                {
                    return Json(new { isSuccess = false, resultMsg = "上传失败,未检测上传的文件信息~" });
                }

            }
            catch (Exception ex)
            {
                return Json(new { isSuccess = false, resultMsg = "文件保存失败,异常信息为:" + ex.Message });
            }
        }

项目完整示例:

 https://github.com/YSGStudyHards/DailyLearning

参考文章:

https://www.cnblogs.com/willick/p/net-core-httpclient.html

HttpClient 类 (System.Net.Http) | Microsoft Learn

IFormFile.OpenReadStream 方法 (Microsoft.AspNetCore.Http) | Microsoft Learn


http://www.niftyadmin.cn/n/5366357.html

相关文章

多模态对比语言图像预训练CLIP:打破语言与视觉的界限,具备零样本能力

多模态对比语言图像预训练CLIP:打破语言与视觉的界限,具备零样本能力。 一种基于多模态(图像、文本)对比训练的神经网络。它可以在给定图像的情况下,使用自然语言来预测最相关的文本片段,而无需为特定任务进行优化。CLIP的设计类似于GPT-2和GPT-3,具备出色的零射击能力…

ESP32QRCodeReader库使用,ESP32-CAM识别二维码并向自写接口发出请求确认身份。

#include <Arduino.h> #include <WiFi.h> #include <HTTPClient.h> #include <ESP32QRCodeReader.h>#define WIFI_SSID "username" #define WIFI_PASSWORD "password" // 连接电脑主机的IP地址的8088端口 #define WEBHOOK_URL &qu…

【LeetCode每日一题】2381. 字母移位 II2406. 将区间分为最少组数 (差分数组)

差分数组案例 2381. 字母移位 II 给你一个小写英文字母组成的字符串 s 和一个二维整数数组 shifts &#xff0c;其中 shifts[i] [starti, endi, directioni] 。对于每个 i &#xff0c;将 s 中从下标 starti 到下标 endi &#xff08;两者都包含&#xff09;所有字符都进行移…

MC34063异常发热分析

问题描述&#xff1a; 工程现场反馈若干电源转换模块损坏&#xff0c;没有输出。拿到问题模块后&#xff0c;查看有一个MC34063周围的PCB有比较明显的高温痕迹&#xff0c;配套的电感也有明显的高温过热痕迹。 问题调查&#xff1a; MC34063的电路非常经典&#xff08;虽然自…

OCR文本纠错思路

文字错误类别&#xff1a;多字 少字 形近字 当前方案 文本纠错思路 简单&#xff1a; 一、构建自定义词典&#xff0c;提高分词正确率。不在词典中&#xff0c;也不是停用词&#xff0c;分成单字的数据极有可能是错字&#xff08;少部分可能是新词&#xff09;。错字与前后的…

Windows11安装运行Linux(Ubuntu)

一、安装windows支持 输入windows打开界面 选择虚拟机监控程序平台、适用于linux的子系统、虚拟机平台 在 Windows 系统中&#xff0c;"虚拟机平台"和"虚拟机监控程序平台"是两个与虚拟化相关的功能&#xff0c;但它们各自有着不同的作用和用途。 虚拟机…

Bug地狱 #1 突然宕机,企业级应用到底怎么了

Bug地狱 #1 突然宕机&#xff0c;企业级应用到底怎么了 背景 目前就职的企业经营是一家服务小微门店Saas企业&#xff0c;以进销存管理和客户营销为主体提供订阅服务。项目正式上线可以说是从13年&#xff0c;基础架构是Web和后端使用C# .net&#xff0c;数据库使用SQL Serve…

arcgis各种版本下载

arcgic 下载&#xff01;&#xff01;&#xff01; ArcGIS是一款地理信息系统软件&#xff0c;由美国Esri公司开发。它提供了一系列完整的GIS功能&#xff0c;包括地图制作、空间数据管理、空间分析、空间信息整合、发布与共享等。ArcGIS是一个可扩展的GIS平台&#xff0c;提供…