Generowanie klienta JS na podstawie ASP.NET Kontroler WebAPI

właśnie znalazłem projekt o nazwie: ProxyApi

ProxyApi jest biblioteką, która automatycznie tworzy Proxy JavaScript przedmioty dla Twojego ASP.NET Kontrolery MVC i WebApi.

GitHub: https://github.com/stevegreatrex/ProxyApi

Blog: http://blog.greatrexpectations.com/2012/11/06/proxyapi-automatic-javascript-proxies-for-webapi-and-mvc/

ProxyApi wygenerował nieprawidłowy JavaScript dla mojego rozwiązania, które zawiera ponad sto oddzielnych akcji WebAPI. Dzieje się tak prawdopodobnie dlatego, że ProxyApi nie obejmuje wszystkich funkcji WebApi, takich jak własne atrybuty ActionName. Ponadto biblioteka ProxyApi jest trochę nieporęczna w moim guście. Musi być na to bardziej efektywny sposób...

Więc postanowiłem rzucić okiem na ASP.NET kod źródłowy WebAPI i okazuje się, że WebAPI ma wbudowaną funkcjonalność samoopisującą. Możesz użyć poniższego kodu z dowolnego miejsca w swoim ASP.NET roztwór do dostęp do Metadanych WebAPI:

var apiExplorer = GlobalConfiguration.Configuration.Services.GetApiExplorer();

Na podstawie danych wyjściowych z apiExplorer.ApiDescriptions, zwijałem własnego dostawcę metadanych:

public class MetadataController : Controller
{
    public virtual PartialViewResult WebApiDescription()
    {
        var apiExplorer = GlobalConfiguration.Configuration.Services.GetApiExplorer();
        var apiMethods = apiExplorer.ApiDescriptions.Select(ad => new ApiMethodModel(ad)).ToList();
        return PartialView(apiMethods);
    }

    public class ApiMethodModel
    {
        public string Method { get; set; }
        public string Url { get; set; }
        public string ControllerName { get; set; }
        public string ActionName { get; set; }
        public IEnumerable<ApiParameterModel> Parameters { get; set; }

        public ApiMethodModel(ApiDescription apiDescription)
        {
            Method = apiDescription.HttpMethod.Method;
            Url = apiDescription.RelativePath;
            ControllerName = apiDescription.ActionDescriptor.ControllerDescriptor.ControllerName;
            ActionName = apiDescription.ActionDescriptor.ActionName;
            Parameters = apiDescription.ParameterDescriptions.Select(pd => new ApiParameterModel(pd));
        }
    }

    public class ApiParameterModel
    {
        public string Name { get; set; }
        public bool IsUriParameter { get; set; }

        public ApiParameterModel(ApiParameterDescription apiParameterDescription)
        {
            Name = apiParameterDescription.Name;
            IsUriParameter = apiParameterDescription.Source == ApiParameterSource.FromUri;
        }
    }
}

Użyj tego kontrolera w połączeniu z następującym widokiem:

@model IEnumerable<Awesome.Controllers.MetadataController.ApiMethodModel>
<script type="text/javascript">
    var awesome = awesome || {};

    awesome.api = {
        metadata: @Html.Raw(Json.Encode(Model))
    };

    $.each(awesome.api.metadata, function (i, action) {
        if (!awesome.api[action.ControllerName]) {
            awesome.api[action.ControllerName] = {};
        }
        awesome.api[action.ControllerName][action.ActionName] = function (parameters) {
            var url = '/' + action.Url;
            var data;
            $.each(action.Parameters, function (j, parameter) {
                if (parameters[parameter.Name] === undefined) {
                    console.log('Missing parameter: ' + parameter.Name + ' for API: ' + action.ControllerName + '/' + action.ActionName);
                } else if (parameter.IsUriParameter) {
                    url = url.replace("{" + parameter.Name + "}", parameters[parameter.Name]);
                } else if (data === undefined) {
                    data = parameters[parameter.Name];
                } else {
                    console.log('Detected multiple body-parameters for API: ' + action.ControllerName + '/' + action.ActionName);
                }
            });
            return $.ajax({
                type: action.Method,
                url: url,
                data: data,
                contentType: 'application/json'
            });
        };
    });
</script>

Kontroler użyje ApiExplorer do wygenerowania metadanych o wszystkich dostępnych akcjach WebAPI. Widok renderuje te dane jako JSON, a następnie wykonuje niektóre JavaScript, aby przekształcić te dane do rzeczywistych funkcji wykonywalnych JavaScript.

Aby użyć tej odrobiny magii, włóż następująca linia w nagłówku strony układu po referencji jQuery.

@Html.Action(MVC.Metadata.WebApiDescription())

Od teraz możesz sprawić, by Twoje połączenia z WebAPI wyglądały tak:

// GET: /Api/Notes?id={id}
awesome.api.Notes.Get({ id: id }).done(function () {
    // .. do something cool       
});

// POST: /Api/Notes
awesome.api.Notes.Post({ form: formData }).done(function () {
    // .. do something cool       
});

Ten prosty serwer proxy automatycznie odróżni parametry ciągu zapytania od parametrów ciała żądania. Brakujące parametry lub wiele parametrów body-parameters wygeneruje błąd, aby zapobiec typo lub innym częstym błędom programistycznym WebAPI.