Create HTML document from the swagger generated JSON file using Asp.Net Core

Today, We will create HTML document from the Swagger generated JSON file using Asp.net.

Let's create document step by steps.

Step 1 : Create Asp.Net Core Web API project using visual studio.

Step 2 : Once the solution is ready then follow below link to configure Swagger in Asp.Net Core.

https://docs.microsoft.com/en-us/aspnet/core/tutorials/web-api-help-pages-using-swagger

First Install Swashbuckle NuGet Package.

Install-Package Swashbuckle -Pre

Once NuGet Package successfully installed then add the following code on startup.cs for Swagger integration with the solution.

// This method gets called by the runtime. Use this method to add services to the container
        public void ConfigureServices(IServiceCollection services)
        {
            // Add framework services.
            services.AddApplicationInsightsTelemetry(Configuration);

            services.AddMvc();

            // Inject an implementation of ISwaggerProvider with defaulted settings applied
            services.AddSwaggerGen();
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline
        public void Configure(IApplicationBuilder app, IHostingEnvironment env, ILoggerFactory loggerFactory)
        {
            loggerFactory.AddConsole(Configuration.GetSection("Logging"));
            loggerFactory.AddDebug();

            app.UseApplicationInsightsRequestTelemetry();

            app.UseApplicationInsightsExceptionTelemetry();

            app.UseMvc();

            // Enable middleware to serve generated Swagger as a JSON endpoint
            app.UseSwagger();

            // Enable middleware to serve swagger-ui assets (HTML, JS, CSS etc.)
            app.UseSwaggerUi();
        }

Hope you get the better idea after visited link and above steps.

Step 3 : After completed above step your solution is ready and run and browse the swagger ui.

For the same configuration on application example, you can fine on my GitHub repository

Step 4 : Now time to run the application and browse the Swagger UI page.

It will be URL like http://localhost:XXXX/swagger/ui/index.html (XXXX is your port number).
Once navigate to this URL. It will look like below image.

Step 5 : You can see on the swagger screen there is a one JSON file link. It looks like http://localhost:XXXX/swagger/v1/swagger.json.

Step 6 : We have JSON file ready with all contain so time to browse http://editor.swagger.io/.

Step 7 : On Swagger editor click on file menu and choose "Import URL" and a popup will open and asking for URL.

Step 8 : Copy JSON URL and paste on above popup dialog. Make sure "Use CORS proxy" uncheck when your URL is from localhost.

Else you can paste JSON string directly to the "Paste JSON" (Select file menu and choose Paste JSON). Click on Import button to load the JSON file on Swagger editor.

Step 9: After clicking on Import button it will show two part of the screen. One side YAML and once side HTML document.

Step 10 : Last and important step once you see above the screen. Now we are ready to perform download document. 

For HTML document click on "Generate Client" from the menu and select "HTML" 

Once you download the file you will able to view beautiful HTML document generated.

Hope you are like it so please keep reading .