ABP-SwaggerUI integration

The project structure is shown in the figure:

The WebApi layer introduces Swashbuckle.Core.dll through the Nuget package

Then add the following method to the SampleTaskSystemWebApiModule module class file:

In the module initialization function add:

The above operations basically complete the integration of Abp-Swagger

There are a few things to note:

1. Add SwaggerUI documentation comments

Right click on the Application layer - Properties click Generate

Annotate the IPersonAppService method of the application service interface

2. SwaggerUI document localization

First define the Swagger.js file: change the properties of the file to embedded resources

code show as below:

$(function () {

$("#logo").text("Demo");
$("#logo").attr("href", "http://www.Demo.com");

$("#explore").text("查询");

$(".options .toggleEndpointList").each(function () {
$( this ).text( " Expand/Hide " );
});
$(".options .collapseResource").each(function () {
$( this ).text( " Show resource list " );
});

$(".options .expandResource").each(function () {
$( this ).text( " Show resource details " );
});

$(".operations .description-link").each(function () {
$( this ).text( " Entity Model " );
});

$(".operations .snippet-link").each(function () {
$( this ).text( " Entity Type " );
});

$(".operations .response-content-type label").each(function () {
$( this ).text( " Request method " );
});
$(".operations .sandbox h4").each(function () {
$( this ).text( " Parameter list " );
});

$(".operations .response_hider").each(function () {
$( this ).text( " Hide the response interface " );
});
$(".operations .response .curl").each(function () {
$( this ).text( " Request Header " );
});

$(".operations .response .curl").each(function () {
$( this ).next().text( " Request path " );
});

$(".response_body").each(function () {
$( this ).prev().text( " Response body " );
});

$("[class='block response_code']").each(function () {
$( this ).prev().text( " Response Code " );
});

$("[class='block response_headers']").each(function () {
$( this ).prev().text( " Response Header " );
});

$(".parameter-content-type div label").each(function () {
$( this ).text( " Parameter content type: " );
});

$("small.notice").each(function () {
$( this ).text( " Click to set as parameter value " );
});

$(".body-textarea").each(function () {
var op = $(this).attr("placeholder");

if (op === "(required)") {
$( this ).attr( " placeholder " , " (cannot be null) " );
}
});

$(".body-textarea required");

$(".fullwidth thead tr th").each(function () {
var key = $(this).text();
switch (key) {
case "Parameter":
$(this).text("参数名");
break;
case "Value":
$(this).text("参数值");
break;
case "Description":
$(this).text("描述");
break;
case "Parameter Type":
$( this ).text( " Parameter Type " );
 break ;
 case  " Data Type " :
$( this ).text( " Data Type " );
 break ;

default:
break;
}
});

$("input[type='submit']").val("测试");
})

Then run the web project, and the preview result is shown in the figure: