使用Swagger直接上传文件的方法

经常使用swagger,可以通过设置[ProducesResponseType]标记接口的返回信息;swagger也能通过接口的参数列表,自动获得发送的数据结构信息。

不过有一个例外,就是上传文件的时候,设置了[Consumes]的内容为multi-part/form-data,但是swagger并不能正常感知是上传文件的。代码是这个样子的:

关于文件上传的细节,可以看多年前我写过一篇有关通过WEBAPI上传文件的文章。

[Consumes("multipart/form-data")]
[ODataRoute]
[HttpPost]
public async Task<ActionResult> Post(IFormCollection collection)
{
 var file = collection.Files[0];
 if(file != null)
 {
 var filename = DateTime.Now.ToString("yyyyMMddHHmmss") + file.FileName;
 var path = Path.Combine(_webHostEnvironment.WebRootPath, "Files", filename);
 using FileStream fileStream = new FileStream(path, FileMode.Create);
 await file.CopyToAsync(fileStream);
 var uri = "Files/" + filename;
 var fileEntity = new Models.File { Url = uri, LastModified = DateTime.Now };
 _homeworkDataContext.Files.Add(fileEntity);
 await _homeworkDataContext.SaveChangesAsync();
 return Created(WebUtility.UrlEncode(uri), fileEntity);
 }
 return BadRequest();
}

实际上,swagger一直提示,上传的内容是一个array类型,当然API是没有问题的,可以通过POSTMAN进行发送,不过不能在网页上直接操作,总觉得心里有点不太舒服。

方法

搜索了一下办法,比较靠谱的,就是通过增加一个IOperationFilter来实现目的。

// CODE FROM https://www.talkingdotnet.com/how-to-upload-file-via-swagger-in-asp-net-core-web-api/
public class FileUploadOperation : IOperationFilter
{
 public void Apply(Operation operation, OperationFilterContext context)
 {
 if (operation.OperationId.ToLower() == "apivaluesuploadpost")
 {
  operation.Parameters.Clear();
  operation.Parameters.Add(new NonBodyParameter
  {
  Name = "uploadedFile",
  In = "formData",
  Description = "Upload File",
  Required = true,
  Type = "file"
  });
  operation.Consumes.Add("multipart/form-data");
 }
 }
}

然后,在services.ConfigureSwaggerGen()参数中,添加

options.OperationFilter<FileUploadOperation>(); 

方法的原理是通过重写操作某个特定API的的过滤器,来实现对返回内容的操作。

此方法适用于OAS2,实质上是实现了这里的规范要求。

我已经用上.NET 5.0了,自带了swagger都支持的是OpenAPI 3,这个方法不好用了。不过思想应该相同,首先看看OpenAPI 3的规范,文件上传需要定义为:

requestBody:
 content:
 multipart/form-data:
 schema:
 type: object
 properties:
  fileName:
  type: string
  format: binary

这个套路和OpenAPI 2完全不一样,需要重新设置requestBody才行。我们按照要求改造代码。

public class FileUploadOperation : IOperationFilter
{
 public void Apply(OpenApiOperation operation, OperationFilterContext context)
 {
 //判断上传文件的类型,只有上传的类型是IFormCollection的才进行重写。
 if (context.ApiDescription.ActionDescriptor.Parameters.Any(w => w.ParameterType == typeof(IFormCollection)))
 {
  Dictionary<string, OpenApiSchema> schema = new Dictionary<string, OpenApiSchema>();
  schema["fileName"] = new OpenApiSchema { Description = "Select file", Type = "string", Format = "binary" };
  Dictionary<string, OpenApiMediaType> content = new Dictionary<string, OpenApiMediaType>();
  content["multipart/form-data"] = new OpenApiMediaType { Schema = new OpenApiSchema { Type = "object", Properties = schema } };
  operation.RequestBody = new OpenApiRequestBody() { Content = content };
 }
 }
}

执行之后,swagger已经可以正常识别了,通过选择文件即可上传,效果如下:

参考资料

https://docs.microsoft.com/en-us/aspnet/core/tutorials/getting-started-with-swashbuckle?view=aspnetcore-5.0&tabs=visual-studio

https://docs.microsoft.com/en-us/aspnet/core/mvc/models/file-uploads?view=aspnetcore-5.0

https://www.talkingdotnet.com/how-to-upload-file-via-swagger-in-asp-net-core-web-api/

到此这篇关于使用Swagger直接上传文件的方法的文章就介绍到这了,更多相关Swagger上传文件内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • swagger上传文件并支持jwt认证的实现方法

    什么是 Swagger? Swagger的目标是为REST APIs 定义一个标准的,与语言无关的接口,使人和计算机在看不到源码或者看不到文档或者不能通过网络流量检测的情况下能发现和理解各种服务的功能.当服务通过Swagger定义,消费者就能与远程的服务互动通过少量的实现逻辑.类似于低级编程接口,Swagger去掉了调用服务时的很多猜测. 背景 由于swagger不仅提供了自动实现接口文档的说明而且支持页面调试,告别postman等工具,无需开发人员手动写api文档,缩减开发成本得到大家广泛认可

  • 如何使用Swagger上传文件

    前言 随着前后端分离开发模式的普及,后端人员更多是编写服务端API接口.调用接口实现文件上传是一个常见的功能,同时也需要一个选择文件上传的界面,可以编写前端界面上传,可以使用Postman.curl来模拟上传请求.上述的方式多多少少有点麻烦.Swagger作为Api说明文档及调试工具,如果它能提供文件上传的界面(默认不提供),那会更加方便文件上传提示,本文将介绍如何使用Swagger来上传文件. 步骤 1. 安装Swagger Install-Package Swashbuckle.AspNet

  • 使用Swagger直接上传文件的方法

    经常使用swagger,可以通过设置[ProducesResponseType]标记接口的返回信息:swagger也能通过接口的参数列表,自动获得发送的数据结构信息. 不过有一个例外,就是上传文件的时候,设置了[Consumes]的内容为multi-part/form-data,但是swagger并不能正常感知是上传文件的.代码是这个样子的: 关于文件上传的细节,可以看多年前我写过一篇有关通过WEBAPI上传文件的文章. [Consumes("multipart/form-data")

  • jQuery Ajax使用FormData对象上传文件的方法

    FormData对象,是可以使用一系列的键值对来模拟一个完整的表单,然后使用XMLHttpRequest发送这个"表单". 在 Mozilla Developer 网站 使用FormData对象 有详尽的FormData对象使用说明. 但上传文件部分只有底层的XMLHttpRequest对象发送上传请求,那么怎么通过jQuery的Ajax上传呢? 本文将介绍通过jQuery使用FormData对象上传文件. 使用<form>表单初始化FormData对象方式上传文件 HTM

  • jsp+ajax实现无刷新上传文件的方法

    本文实例讲述了jsp+ajax实现无刷新上传文件的方法.分享给大家供大家参考,具体如下: 列表页:selectaddress.jsp js页:ajax_edit.js jsp处理页:editaddress.jsp 上传工具类:UploadUtil.java 思想:由于安全问题,javascript操纵不了文件, 导致ajax不能动态上传文件,所以选择了iframe, 列表页把form表单提交到一个隐式的iframe里面,设置表单的属性 复制代码 代码如下: enctype='multipart/

  • form+iframe解决跨域上传文件的方法

    (1)  jsp代码: <form id="form" name="form" enctype="multipart/form-data" method="post" target="hidden_frame"> <table style="border:0;width:100%;text-align:middle;"> <tr style="bo

  • jQuery结合C#实现上传文件的方法

    本文实例讲述了jQuery结合C#实现上传文件的方法.分享给大家供大家参考.具体实现方法如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <script src="jquery-1.7.1.min.js"></script> <script src="j

  • PHP文件上传判断file是否己选择上传文件的方法

    本文实例讲述了PHP文件上传判断file是否己选择上传文件的方法.分享给大家供大家参考.具体方法如下: 一个合格的程序员在实现数据入库中时我们都会有一些非常严密的过滤与数据规则,像我们文件上传时在前段要判断用户是否选择上传文件同时在后台也可判断是否有上传的文件,本文实例即对此做一较为深入的分析. 如下html代码所示: 复制代码 代码如下: <form action="?" method="post" enctype='multipart/form-data'

  • yii实现使用CUploadedFile上传文件的方法

    本文实例讲述了yii实现使用CUploadedFile上传文件的方法.分享给大家供大家参考,具体如下: 一.前端代码 Html代码: <form action="<?php echo $this->createUrl('/upload/default/upload/');?>" method="post" enctype="multipart/form-data"> <input type="file

  • JSP实现快速上传文件的方法

    本文实例讲述了JSP实现快速上传文件的方法.分享给大家供大家参考.具体如下: 这里演示JSP不使用第三方库,实现快速上传文件的功能 1. FileUpload.java: package FileUpload; import java.io.BufferedOutputStream; import java.io.File; import java.io.FileOutputStream; import javax.servlet.ServletInputStream; /** * */ /*

  • NodeJS使用七牛云存储上传文件的方法

    1-准备工作 确认安装node和npm 安装 qiniu,formidable,express模块 npm install --save qiniu formidable [x] 导入模块 let qiniu = require('qiniu'), formidable = require('formidable'), express = require('express'), router = express.Router(); 2-服务器端的云存储操作 2-1文件上传 router.post

  • jQuery Ajax方式上传文件的方法

    jQuery Ajax方式上传文件用到两个对象 第一个对象:FormData 第二个对象:XMLHttpRequest 目前新版的Firefox 与 Chrome 等支持HTML5的浏览器完美的支持这两个对象,但IE9尚未支持 FormData 对象,还在用IE6 ? 只能仰天长叹.... 有了这两个对象,我们可以真正的实现Ajax方式上传文件. 示例代码: <!DOCTYPE html> <html> <head> <title>Html5 Ajax 上传

随机推荐