Deploy Your First Azure API App

by | Jun 8, 2018 | App Service, Azure

In a previous post, I was trying to explain what Azure API App is. In this one, I show you the steps to deploy your first Azure API App.

Create API App

From the Azure Portal click Create a resource and search for “API App” and click Create.

 

Azure API App Parameters

In the image below you can see how to fill up the parameters to create API App.

* More details about App Service Plan you can find in this link.

After deployment ends, in the Resource Group container you will see the below three elements :

 

The Visual Studio Story

Until now all the previous steps were easy. Many of you probably believe that now the hard job begins. But the next steps will prove you the opposite.

Open the Visual Studio, go to File – New – Project, select from Visual C# – Web – ASP.NET Web Application (.NET Framework) and click OK. In the next screen select “Azure API App” and click OK.

The next step is to Publish the project to Azure API App service. Select Publish – Microsoft Azure App Service – Select Existing and click Publish.

Follow the steps, select your Subscription, Resource Group and click OK.

Build and Publish of the API App started as the next piece of log shows.

------ Build started: Project: cloudopszone-API_App, Configuration: Release Any CPU ------
------ Publish started: Project: cloudopszone-API_App, Configuration: Release Any CPU ------
.
.
.
Publish Succeeded.
Web App was published successfully http://cloudopszone.azurewebsites.net/
========== Build: 1 succeeded, 0 failed, 0 up-to-date, 0 skipped ==========
========== Publish: 1 succeeded, 0 failed, 0 skipped ==========

 

After build finishes and Publishing procedure ends, a page will open on your browser which informs you that your App Service app is up and running and offers to you a number methods like GET, POST, PUT, DELETE..

More Details About API App

OK, I understand that what I already mentioned is not enough, so we will say a few more about the SwaggerConfig.cs and the WebApiConfig.cs.

WebApiConfig.cs

The WebApiConfig.cs located on the VS solution explorer inside the folder App_Start.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web.Http;

namespace cloudopszone_API_App
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // Web API configuration and services

            // Web API routes
            config.MapHttpAttributeRoutes();

            config.Routes.MapHttpRoute(
                name: "DefaultApi",
                routeTemplate: "api/{controller}/{id}",
                defaults: new { id = RouteParameter.Optional }
            );
        }
    }
}

In the WebApiConfig.cs what is quite important is the MapHttpRoute which is responsible to route incoming HTTP requests to a method action on a Web API controller.
Below you can see the methods that your API App supports. And you must notice the namespace Swashbuckle.Swagger.Annotations which is responsible for Swagger.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Net.Http;
using System.Web.Http;
using Swashbuckle.Swagger.Annotations;

namespace cloudopszone_API_App.Controllers
{
    public class ValuesController : ApiController
    {
        // GET api/values
        [SwaggerOperation("GetAll")]
        public IEnumerable<string> Get()
        {
            return new string[] { "value1", "value2" };
        }

        // GET api/values/5
        [SwaggerOperation("GetById")]
        [SwaggerResponse(HttpStatusCode.OK)]
        [SwaggerResponse(HttpStatusCode.NotFound)]
        public string Get(int id)
        {
            return "value";
        }

        // POST api/values
        [SwaggerOperation("Create")]
        [SwaggerResponse(HttpStatusCode.Created)]
        public void Post([FromBody]string value)
        {
        }

        // PUT api/values/5
        [SwaggerOperation("Update")]
        [SwaggerResponse(HttpStatusCode.OK)]
        [SwaggerResponse(HttpStatusCode.NotFound)]
        public void Put(int id, [FromBody]string value)
        {
        }

        // DELETE api/values/5
        [SwaggerOperation("Delete")]
        [SwaggerResponse(HttpStatusCode.OK)]
        [SwaggerResponse(HttpStatusCode.NotFound)]
        public void Delete(int id)
        {
        }
    }
}

 

SwaggerConfig.cs

The SwaggerConfig.cs located on the VS solution explorer inside the folder App_Start and if you are observant you notice that swagger is disabled. So, I will show you how to enable and call Swagger in you API App.
To enable Swagger just uncomment the lines 190 and 194, build your solution and Publish your app to Azure.

                       /*
                            })
                        .EnableSwaggerUi(c =>
                            {
                        */ 

                      

                            })
                        .EnableSwaggerUi(c =>
                            {

Now, you are ready to open Swagger. You just need to add /swagger 

468
Share This