本文版权归和讯和小编马建波自个儿共同持有,转发和爬虫请声明新浪蜗牛原著地址,cnblogs.com/tdws

  写在日前

请见谅自个儿这几个标题党,写到了第十0篇小说,说是深度优化,其实也并没有怎么深度。源码也没怎么修改,若是你想行使WebApi
Swagger文书档案,请先活动到上一篇的中度优化。

 第①篇:ASP.NET WebApi
文书档案Swagger中度优化
 http://www.cnblogs.com/tdws/p/6100126.html

 第1篇:ASP.NET WebApi
文书档案Swashbuckle.Core与SwaggerUI深度定制

1.文档前后端分离

2.类型结构

3.兑现分Area(模块)来筛选所需出示的Controller

 第三篇  :ASP.NET WebApi
文书档案扩张登录
 http://www.cnblogs.com/tdws/p/7395556.html

  文书档案前后端分离

本篇小说提供源码,下载链接:
 https://github.com/coderws/CustomSwagger 
(由于今日头条只可以上传10MB,就放github上吗,不求star,只为了便利我们下载)

   由于Swagger原版的swagger页面和能源js
css等公事被安放到dll个中,固然大家能够找到swagger
UI的源码,但用起来依然感到有点不便。所以选用了github上另2个开源项目sosoapi,它的文书档案功能也是基于swagger的,可是为我们搞好了必然得进行,比如现成的中国和英国切换一类的。并且财富完全与后边的嵌入性财富分裂,直接分离出来三个swagger
UI的文件夹,包罗js,css,images,html等等,那样的话,我们修改起来很便利啊,能够做到你想要的定制化,并且我将swagger的后台处理源码down下来,加到消除方案个中,将来遭逢难题,再也不用收到dll不可能修改和新增功用的困扰。能够将swagger作为你框架中的一有个别。

  项目布局

json 1

您能够见见Swashbuckle.Core。正是Swagger的后台源码,展开Test项目,在那之中的Doc文件夹,就是一体的SwaggerUI的始末啦,index.html正是我们的文书档案首页:

json 2

 

  完结分Area(模块)来筛选所需出示的Controller

  再说Area分组前提一点小的更改

json 3  Required为泾渭明显深青莲

json 4

Swagger
最大开间增添到1100px,

左手扩展模块筛选,点击筛选后,将只突显相应模块下。

json,实际的贯彻形式,正是基于你的模块名称,来筛选api访问路径json 5

如上海教室第伍个user,就表示user模块了,第三个user才是控制器名称。那样的概念,使用了MVC5的新特性RouteAttribute和RoutePrefixAttribute,他们用于在controller中自定义路由,你能够下载源码看到。

那大家左侧菜单栏的多寡是哪儿来的吗。请看源码SwaggerConfig中,作者定义了这么3个方法:

/// <summary>
        /// 从API文档中读取控制器描述
        /// </summary>
        /// <returns>所有控制器描述</returns>
        public static ConcurrentDictionary<string, string> GetControllerDesc(HashSet<string> moduleList)
        {
            string xmlpath = String.Format("{0}/bin/SwaggerCustom.Test.XML", AppDomain.CurrentDomain.BaseDirectory);
            ConcurrentDictionary<string, string> controllerDescDict = new ConcurrentDictionary<string, string>();
            if (File.Exists(xmlpath))
            {
                XmlDocument xmldoc = new XmlDocument();
                xmldoc.Load(xmlpath);
                string type = String.Empty, path = String.Empty, controllerName = String.Empty;
                string[] arrPath;
                int length = -1, cCount = "Controller".Length;
                XmlNode summaryNode = null;
                foreach (XmlNode node in xmldoc.SelectNodes("//member"))
                {
                    type = node.Attributes["name"].Value;
                    if (type.StartsWith("T:"))
                    {
                        //控制器
                        arrPath = type.Split('.');
                        length = arrPath.Length;
                        controllerName = arrPath[length - 1];
                        if (controllerName.EndsWith("Controller"))
                        {
                            //模块信息
                            var moduleName = arrPath[length - 2];
                            moduleList.Add(moduleName);

                            //获取控制器注释
                            summaryNode = node.SelectSingleNode("summary");
                            string key = controllerName.Remove(controllerName.Length - cCount, cCount);
                            if (summaryNode != null && !String.IsNullOrEmpty(summaryNode.InnerText) && !controllerDescDict.ContainsKey(key))
                            {

                                controllerDescDict.TryAdd(key, summaryNode.InnerText.Trim());
                            }
                        }
                    }
                }
            }
            return controllerDescDict;
        }

当然那么些法子仅用于读取Controller注释的,可是既然那里读取了xml,小编也就没供给再读贰次了。笔者扩充了1个HashSet<string>类型的参数,在联谊中数量每3个因素的多寡是唯一的,所以采用它来存模块音讯,xml每便遍历到Controller的时候,作者都会将其Modules消息读取出来(比如namespace
SwaggerCustom.Test.Controllers.Admin.AdminRoleController ),那么尾数第一个人的单词便是模块名称。那样一来大家的模块音信也含有在了json中,看下图AreaDescription,他证实了自身有八个模块。

json 6

那么接下去就是要做页面渲染前的筛选工作了。作者首先估计渲染一定和再次来到json中的path(接口路径)有关,所以作者在swagger-ui-ext.js中搜索path,总算找到了结果:

正如所示:遍历时,通过筛选Module模块,对不符合自个儿所想要的module实行直接return,而不向下执行,最后完结想要的指标。之所以说作者没有做深度优化的来头也是此处,真正的深浅优化应该是在后台代码中所筛选,只回去本人想要的json结果,偷懒了。

json 7

故而下图,就是本身点击Admin选项后所筛选的结果,该模块下唯有七个Controller。

json 8

关于本人个人所充实的js代码,在Doc/lib/swagger-custom.js中。

//获取Controller描述
function SwaggerCustom() {
    this.setControllerSummary = function () {
        $.ajax({
            type: "get",
            async: true,
            url: $("#input_baseUrl").val(),
            dataType: "json",
            success: function (data) {
                var summaryDict = data.ControllerDesc;
                var id, controllerName, strSummary;
                $("#resources_container .resource").each(function (i, item) {
                    id = $(item).attr("id");
                    if (id) {
                        controllerName = id.substring(9);
                        strSummary = summaryDict[controllerName];
                        if (strSummary) {
                            $(item).children(".heading").children(".options").prepend('<li style="color:red;" class="controller-summary" title="' + strSummary + '">' + strSummary + '</li>');
                        }
                    }
                });
                swaggerCustom.loadMenu(data.AreaDescription);
                expendtoggle();//注册菜单收缩事件
            }
        });

    };
    //获取当前参数
    this.getQueryString = function (name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.search.substr(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
    },
    this.loadMenu = function (modules) {
        var url = window.location.href;
        url = url.substring(0, url.lastIndexOf('?'));
        $('body').prepend('<div class="menu-expender" id="menuExpend">←</div><div id="moduleMenu"><div onclick="menuClick(this)" data-url="' + url + '?module=all"  " data-module="all" class="menu-inner" >全部</div></div>');
        var menuInner = '';
        modules.forEach(function (item) {
            menuInner += '<div onclick="menuClick(this)" data-url="' + url + '?module=' + item.toLowerCase() + '" data-module="' + item.toLowerCase() + '" class="menu-inner" >' + item + '</div>';
        });
        $('#moduleMenu').append(menuInner);
        $('#moduleMenu').css("position", "fixed").css("top", "20%");
    }
}
var swaggerCustom = new SwaggerCustom();
var swaggerCustomGlobalData = {
    currentModule: "all"
}
$(function () {
    swaggerCustomGlobalData.currentModule = swaggerCustom.getQueryString('module') == null ? "all" : swaggerCustom.getQueryString('module');
    //alert(swaggerCustomGlobalData.currentModule);
});
var swaggerStyle = {
    showActionLink: function () {
        $("li .toggleEndpointList").css("color", "#2392f7");
    },
    titleStyle: function () {
        $("h2 .toggleEndpointList").css("color", "green");
    },
    showDetailLink: function () {
        $("li .expandResource").css('color', '#996633');
    },
    paramTable: function () {
        $('.fullwidth.parameters thead tr th:nth-child(1)').width('50px');
        $('.fullwidth.parameters thead tr th:nth-child(2)').width('350px');
        $('.fullwidth.parameters thead tr th:nth-child(3)').width('100px');
        $('.fullwidth.parameters thead tr th:nth-child(4)').width('60px');
        $('.fullwidth.parameters thead tr th:nth-child(5)').width('400px');
        $('td textarea').width('380px');
    },
    init: function () {
        this.showActionLink();
        this.titleStyle();
        this.showDetailLink();
        //this.paramTable();
    }
}

function menuClick(ele) {
    window.location.href = (ele.dataset.url);
}
function expendtoggle() {
    $('#menuExpend').toggle(function () {
        $(this).html('→');
        $('#moduleMenu').hide();
    }, function () {
        $(this).html('←');
        $('#moduleMenu').show();
    });
}

 

  该怎么行使??

  使用直接copy走SwaggerConfig.cs和Doc文件放到你项目下,并且引用Swashbuckle就没难题(能够直接拿源码类库,也足以一贯从nuget上设置)。并且你想行使那些模块划分的法力,就一定要顺应路由规则api/modulename/controller/action.因为模块的筛选正是通过modulename嘛。借使您只想利用swagger的基本成效,看上一篇的分享就足足了。得到本次分享的源码,你就足以在中间合理的修改源码,自定义你的功能

  写在最后

json 9

 

2017-03-13补偿几点

json 10

本条处理结果的展现,通过在action的叙述文书档案注释上 ,扩展节点<response
code=”201″>Returns the newly created item</response>  

 

Swagger不识别ActionResult,要求明显再次来到类型,所以在Core中
要求充实风味标签 

json 11

 

 

依旧请见谅本身那一个标题党。

若是本人的简单分享对您有点滴帮忙,欢迎点下方铅白按钮关心,笔者将不止输出分享。也欢迎为自己,也为你协调点赞。关于本篇源码有任何难题,欢迎留言。

相关文章

网站地图xml地图