ttmind

Main Navigation

ttmind
  • jim-jams
  • Tech
  • Positive
Login

Login

Facebook Google

OR

Remember me Forgot password?

Don't have account? Signup here.

Sort by Categorys

.Net

PHP

Java

JavaScript

Database

Server

Client Side

Tools

Artificial Intelligence

Cloud

Hybrid Development

Event

Smart City

Education

Security

Scrum

Digital Marketing

APP Development

Business

Internet

Simulation

Art

Network

Microservices

Architecture

Technology

Leadership

    Top Articles

  • How Does Social Media Bring People Together?
    TTMind Author
  • How to read appSettings JSON from Class Library in ASP.NET Core
    Anil Shrestha
  • Printing Support In Asp.Net Core
    TTMind Author
  • HOW TO EXTRACT TEXT FROM IMAGE USING JAVASCRIPT (OCR with Tesseract.js)?
    Prakash Pokhrel
  • Images Upload REST API using ASP.NET Core
    Prakash Pokhrel
  • Related Topic

  • How to read appSettings JSON from Class Library in ASP.NET Core
  • Printing Support In Asp.Net Core
  • Images Upload REST API using ASP.NET Core
  • How to use IActionFilter, IAsyncActionFilter in ASP.NET Core MVC?
  • ASP.NET CORE - Blazor CRUD operation using ADO.NET
  • Tech
  • About Us
  • Contact Us
  • TechHelp
  • PositiveHelp
  • Jim-Jams Help
  • Terms & Conditions

© Copyright ttmind.com

Main Content

How to upload file via Swagger in ASP.NET Core Web API?

.Net .Net Core about 8 years ago || 2/19/2018 || 13.6 K View

  • Hide

Let us first understand a little bit about Swagger.

Swagger :-

Swagger is a Document which are generated by an open source project Swashbucle.AspNetCore for Web APIs that are built in asp.net core MVC. It is a machine readable representation of a RESTful API which enables support interactive documentation, client SDK generation and discoverability. In simple words it is a simple, clean but powerful representation of RESTful APIs.

Before uploading file via Swagger let us look at how to add Swagger in asp.net core Web API first.

First of all, create .Net Core API project.

  • Open Visual Studio >> New project
  • Under Visual C# Tab >> .Net Core
  • Choose .Net Core Web Application and provide a name for your project.
  • And Tab OK.

Now Choose Web API Template from new window and keep all other in default and click on OK.The default Web API Template comes with the Controller named Values with Get, Post, Put and Delete Methods.

Once the WEB API project is created, just run the app. You will see the following. There is no UI. There isn’t a list of all API methods and any other detail about them.

Here is the where swagger helps us out. To Configure Swagger first of all we have to install the  nugget package for it. To do that there are many ways but this one is the easiest one.

  • Open project.json file
  • Write "Swashbuckle": "6.0.0-beta901" under dependencies like this.

Now open  Startup.cs  file to add swagger service to middleware. And add the codes in configure Service Method  as shown in the figure.

And In Configure Method like this:

Now run the application IIS button but still now swagger UI is generated. To see the UI we have configure our URL our project. To do that we need to go to properties of our project.

  • Right click on project name in the Solution Explorer. New window will appear.
  • Go to DEBUG Tab and Edit the Launch URL to swagger/ui as shown below:

Now again start the project and you will see the output :

Click on Values to see the values.

HTTP verb settings and along that API methods of Values Controller are shown in the Swagger UI. To Identify the actions easily different colours are used. Click on any of the methods given will give you details about accepted parameters and return type which allows us to test the method.

Now Let us head into uploading a file in asp.net core using Swagger.

  • Go to the Values Controller  and provide the action to upload the file as shown in figure.
  • Use the Namespace  Microsoft.AspNetCore.Http

Now run the application you will see the method you have just added. Navigate to upload method and you will see the screen as following:

Here you see the multiple input boxes which are the properties of IFormFile which represents the uploaded file. But you cant’t upload file with these input boxes but it will make file upload control easy. Now Instead of these input boxes lets get the file upload control

Swashbuckle has IOperationFilter which allows to post-modify operation descriptions once they’ve been generated by wiring up one or more Operation filters. Implementing this filter will provide the option to modify or replace the operation parameters. To implement IOperationFilter, let’s add a class FileUploadOperation which implement this filter. IOperationFilter has only one method called Apply to implement.

This filter will replace the multiple input boxes with file upload control. The above code does following things.

  • It first checks for operation with OperationId as “apivaluesuploadpost“. The operationId name is a combination of couple of parameters. It is made up of “api” + [Controller name] + [Method Name] + [HTTP Verb].
    Or in other words, it is the URL of your controller method, but without “/” + [HTTP Verb].
  • It clears all the parameters. So all the properties of IFromFile interface are cleared.
  • And then adds custom parameters to the operation. Please note, the Name parameter value must be equal to parameter name to the method. So in this case, it is “uploadedFile” PostFile(IFormFile uploadedFile). In property must be set to “formData” and Type must be “file”.
  • Finally, consume type multipart/form-data which is required for file transfer from client to server.

And final step is to register this operation filter in Startup.cs.

 

 

  • 4
  • 0
  • 0
    • Facebook
    • Twitter
    • Google +
    • LinkedIn

About author

Alok Pandey

Alok Pandey

Love to share what I know.

Reset Your Password
Enter your email address that you used to register. We'll send you an email with your username and a link to reset your password.

Quick Survey