Add an upload button to your swagger page

The swagger adventures continue…

In .NET Core the current recommended way to upload a file in ASP.NET is with an IFormFile.

If you’re using an IFormFile in your ASP.NET Web Api like so:

[HttpPost("upload")]
public IActionResult UploadFile(IFormFile file)
{

If you do this, the Swagger page as rendered by Swashbuckle won’t look correct:

However, if you install version 2.5.0 or later of my Swashbuckle.AspNetCore.Examples NuGet package, then you can add the [AddSwaggerFileUploadButton] attribute to your controller action, like so:

[HttpPost("upload")]
[AddSwaggerFileUploadButton]
public IActionResult UploadFile(IFormFile file)
{

and then enable my filter in your Startup.cs:

services.AddSwaggerGen(c =>
{
    c.OperationFilter<AddFileParamTypesOperationFilter>();

Then you’ll get a nice upload button:

Advertisements

8 thoughts on “Add an upload button to your swagger page

  1. Above attribute expects parameter name to be “File” else it will fail to create the upload button. is there a way we can configure the parameter name ?

      • Thanks for responding Matt. Your Swashbuckle Examples package is just what the doctor ordered!

        ([FromForm]IFormFile file ,[FromForm]string otherParm) does work! The SwaggerUI however includes Headers, Dispositions, etc that clutter it up quite a bit.

        When you leave [FromForm] off the file parameters, you get TWO “file” parameters in the SwaggerUI—one specified as “query” (the value of which doesn’t come through the method), and one from the body that has the upload button (thank you!!!!)–and this one DOES work.

        I would love to be able to get the clean SwaggerUI with the upload button on the ONE parameter, without the Header, Dispositions etc or the superfluous duplicate “file” parameter.

        Does this make sense? Please email me matt.page@niceincontact.com

        Your work is much appreciated. Thank you so much!

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s