Asp.NET Web API client generator for TypeScript files
This tool helps you generating the complete client API in TypeScript to consume a Web API made in .NET . It generates interfaces for all the types exposed by the API and classes to request each controller.
The generation is based on the ASP.NET ApiExplorer class. wich defines metadata for all the controllers exposed. This metadata is fed on a template (using the RazorEngine), wich generates the client API files in TypeScript.
First, you need to install the NuGet package, you can do it with that command:
Install-Package WebApiClientTS
This is the old way, at this mode you need to explicit create a controller in your application. Them you need to implement a specific controller in your API to explore your API and generate the client API when you call that.
#if DEBUG // Use it just on development
namespace WebApiSample.Controllers.Api
{
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web.Http;
using System.Web.Http.Description;
using WebApiClientTS;
[RoutePrefix("Api/CodeGenerator")]
[System.Web.Http.Description.ApiExplorerSettings(IgnoreApi = true)] // Invisible in ApiExplorer, we don't want to generate this :D
public class CodeGeneratorController : ApiController
{
[HttpGet]
[Route("Run")]
public string Run()
{
GeneratorConfig config = new GeneratorConfig()
{
ControllerTemplate = System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/TsTemplates/template.cshtml"),
OutputFolderPath = Path.Combine(System.Web.Hosting.HostingEnvironment.MapPath("~"), "App_Data", "clientApi"),
IgnoreThoseControllers = new string[]
{
"Values"
}
};
Generator generator = new Generator(config);
List<ApiDescription> apis = Configuration.Services.GetApiExplorer().ApiDescriptions.OrderBy(o => o.RelativePath)
.Where(w => !config.IgnoreThoseControllers.Contains(w.ActionDescriptor.ControllerDescriptor.ControllerName))
.ToList();
// Sample of an stringify function
Func<string, string> stringifyFunction = (parameterName) => $"JSON.stringify({parameterName})";
//Func<string, string> stringifyFunction = (parameterName) => $"\"'\"+{parameterName}+\"'\"";
var metadata = ApiDescriptorMetadata.From(apis, stringifyFunction).Where(ctrl => !config.IgnoreThoseControllers.Contains(ctrl.Name));
// Add settings to the template of AngularJS request
metadata.SelectMany(a => a.Methods).ToList().ForEach(m =>
{
m.Parameters.Add(new ParameterMetadata()
{
Name = "config?",
Type = "ng.IRequestConfig"
});
});
generator.Run(metadata);
return "Ok";
}
}
}
#endifYou need to indicate a .cshtml template to the generator, use it like line 22.
Now you can run the web API and then access the controller to generate the typescript client API.
It's done, the typescript client api was generated
At this way you don't need to create a new controller in you application, you just need to configure the generator (at Global.asax) and call the implicit contoller.
#if DEBUG // Use it just on development
// The endpoint will be http://localhost:16120/c/g/api/run
// Sample of an stringify function
Func<string, string> stringifyFunction = (parameterName) => $"JSON.stringify({parameterName})";
//Func<string, string> stringifyFunction = (parameterName) => $"\"'\"+{parameterName}+\"'\"";
WebApiClientTS.GeneratorConfig config = new GeneratorConfig()
{
ControllerTemplate = System.Web.Hosting.HostingEnvironment.MapPath("~/App_Data/TsTemplates/template.cshtml"),
OutputFolderPath = Path.Combine(System.Web.Hosting.HostingEnvironment.MapPath("~"), "App_Data", "clientApi"),
IgnoreThoseControllers = new string[]
{
"Values"
},
RouteTemplate = "C/G/API/{action}",
StringifyFunction = stringifyFunction
};
WebApiClientTS.Generator.ConfigureApiGenerator(GlobalConfiguration.Configuration.Routes, config);
#endifTo call the controller
It's done, at the same way the typescript client api was generated
To create the package you just need to build the solution in Release mode and the package file will be created.
Or...
You will need the NuGet command line tool then visit this NuGet link to obtain and install this tool.
Do not forget to build the project Release mode before generate the package ;D
With NuGet installed, on \src\NuGetPkg folder of this repository, execute the following command to generate the package: nuget.exe pack Package.nuspec, it's done, the .nupkg was created at the same folder.
Danke