¿Cómo agregar API web a un proyecto de aplicación web ASP.NET MVC (5) existente?

Suponiendo que olvidó marcar la casilla de verificación API web (agregarlo al proyecto) al hacer un nuevo proyecto MVC (5), ¿qué debe hacer para agregar API web y hacer que funcione?

Hay un montón de preguntas de migración, pero ninguna parecía tener los pasos completos y actualizados para agregar API web a un proyecto MVC 5 y parece haber cambiado de algunas de las respuestas anteriores.

Agregar API web a MVC 4

Agregar GlobalConfiguration.Configure (WebApiConfig.Register) MVC 4

Actualiza el proyecto MVC

Usar Nuget para obtener la API web más reciente.

Proyecto - Haga clic derecho - Administrar paquetes Nuget - Busque API web (API web Microsoft ASP.NET ...) e instálelo en su proyecto MVC.

Entonces todavía necesita que el enrutamiento de la API web funcione. Desde la configuración de la API web 2 de ASP.NET de Microsoft

Agregue WebApiConfig.cs a la carpeta App_Start /

using System.Web.Http;

namespace WebApplication1
{
    public static class WebApiConfig
    {
        public static void Register(HttpConfiguration config)
        {
            // TODO: Add any additional configuration code.

            // Web API routes
            config.MapHttpAttributeRoutes();

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

        // WebAPI when dealing with JSON & JavaScript!
        // Setup json serialization to serialize classes to camel (std. Json format)
        var formatter = GlobalConfiguration.Configuration.Formatters.JsonFormatter;
        formatter.SerializerSettings.ContractResolver =
            new Newtonsoft.Json.Serialization.CamelCasePropertyNamesContractResolver();
        }
    }
}

Si tiene un proyecto MVC, tendrá Global.asax.cs , agregue las nuevas rutas. El orden de las rutas de Global.asax.cs es crítico. Tenga en cuenta que hay ejemplos obsoletos que usan WebApiConfig.Register

Agregue esta línea a Global.asax.cs: GlobalConfiguration.Configure(WebApiConfig.Register);

protected void Application_Start()
{
    // Default stuff
    AreaRegistration.RegisterAllAreas();

    // Manually installed WebAPI 2.2 after making an MVC project.
    GlobalConfiguration.Configure(WebApiConfig.Register); // NEW way
    //WebApiConfig.Register(GlobalConfiguration.Configuration); // DEPRECATED

    // Default stuff
    FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
    RouteConfig.RegisterRoutes(RouteTable.Routes);
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

Ayuda de WebAPI

Para obtener las páginas de ayuda ( muy ) útiles de WebAPI , instale WebAPI.HelpPage. Consulte http://channel9.msdn.com/Events/Build/2014/3-644 (~ 42 minutos) para saber qué hace. ¡Se ve muy útil!

Consola Nuget: Install-Package Microsoft.AspNet.WebApi.HelpPage

Para verificar que WebAPI está funcionando:

A la carpeta de controladores -> Agregar nuevo elemento -> Clase de controlador de API web.

public class TestController : ApiController
{
    //public TestController() { }

    // GET api/<controller>
    public IEnumerable<string> Get()
    {
        return new string[] { "value1", "value2" };
    }

    // GET api/<controller>/5
    public string Get(int id)
    {
        return "value";
    }
    //...
}

Ahora puede probar en IE / FF / Chrome como de costumbre, o en las consolas de JavaScript para pruebas que no se realizan.

(Con solo el controlador en la URL, llamará a la acción GET () en el nuevo controlador Web API, se asigna automáticamente a métodos / acciones dependiendo de REST, por ejemplo, PUT / POST / GET / DELETE. No es necesario llamar ellos por acción como en MVC) La URL directamente:

http://localhost:PORT/api/CONTROLLERNAME/

Alternativamente, use jQuery para consultar el controlador. Ejecute el proyecto, abra la consola (F12 en IE) e intente ejecutar una consulta Ajax. (Verifique su PUERTO Y NOMBRE DE CONTROL)

$.get( "http://localhost:PORT/api/CONTROLLERNAME/", function( data ) {
    //$( ".result" ).html( data );
    alert( "Get data received:" + data);
});

Nota al margen: hay algunos pros / contras a tener en cuenta al combinar MVC y API web en un proyecto

Verificación de la ayuda de WebAPI: http://localhost:PORT/help