Asp.Net Web API项目配置Miniprofiler和Swagger集成

  1. 新建Web API项目

  2. 配置Swagger,本项目中使用的swagger包如下

  3. Nuget安装MiniProfiler,目前最新版本是4.2.1,支持的.Net框架是4.6.1,注意不要选错

  4. 在Global.asax.cs中添加如下代码

protected void Application_Start()
{
    GlobalConfiguration.Configure(WebApiConfig.Register);
    MiniProfiler.Configure(new MiniProfilerOptions
    {
        RouteBasePath = "~/mini-profiler-resources",
        PopupRenderPosition = RenderPosition.Right,  // defaults to left
        PopupMaxTracesToShow = 2,                   // defaults to 15
        ColorScheme = ColorScheme.Auto,              // defaults to light
        IgnoredPaths = { "/lib/","/css/","images"}

     });
}
protected void Application_BeginRequest()
{
    MiniProfiler.StartNew();
}

protected void Application_EndRequest()
{
    MiniProfiler.Current?.Stop();
}
  1. web.config当中添加如下代码(添加在节点下)
<add name="MiniProfiler" path="mini-profiler-resources/*" verb="*"
           type="System.Web.Routing.UrlRoutingModule" resourceType="Unspecified"
           preCondition="integratedMode" />
  1. 这时候在swagger当中调用API之后,再访问~/mini-profiler-resources/results路径就会看到如下结果

如何才能使监控结果直接显示在Swagger页面呢?别急,继续如下步骤

  1. 下载默认的index.html页面添加到项目当中,注意:需要将index.html设置为嵌入的资源 官方下载🔗
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>%(DocumentTitle)</title>
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="./swagger-ui-css">%(CssTheme)
    <link rel="icon" type="image/png" href="./favicon-32x32-png" sizes="32x32" />
    <link rel="icon" type="image/png" href="./favicon-16x16-png" sizes="16x16" />
    <style>
        html {
            box-sizing: border-box;
            overflow: -moz-scrollbars-vertical;
            overflow-y: scroll;
        }

        *,
        *:before,
        *:after {
            box-sizing: inherit;
        }

        body {
            margin: 0;
            background: #fafafa;
        }
    </style>
    %(StylesheetIncludes)
</head>
<body>
<div id="swagger-ui"></div>

<script src="swagger-ui-bundle-js"> </script>
<script src="swagger-ui-standalone-preset-js"> </script>
<script>
    // Get Swagger-Net config into JavaScript
    function arrayFrom(configString) {
        return (configString !== "") ? configString.split('|') : [];
    }

    function stringOrNullFrom(configString) {
        return (configString !== "null") ? configString : null;
    }

    function getScript(source) {
        var script = document.createElement('script');
        var prior = document.getElementsByTagName('script')[0];
        script.async = 1;

        script.onload = script.onreadystatechange = function (_, isAbort) {
            if (isAbort || !script.readyState || /loaded|complete/.test(script.readyState)) {
                script.onload = script.onreadystatechange = null;
                script = undefined;
            }
        };

        script.src = source;
        prior.parentNode.insertBefore(script, prior);
    }

    window.swaggerNetConfig = {
        rootUrl: '%(RootUrl)',
        discoveryPaths: arrayFrom('%(DiscoveryPaths)'),
        booleanValues: arrayFrom('%(BooleanValues)'),
        validatorUrl: stringOrNullFrom('%(ValidatorUrl)'),
        customScripts: arrayFrom('%(CustomScripts)'),
        docExpansion: '%(DocExpansion)',
        defaultModelRendering: '%(DefaultModelRendering)',
        defaultModelExpandDepth: %(DefaultModelExpandDepth),
        defaultModelsExpandDepth: %(DefaultModelsExpandDepth),
        maxDisplayedTags: %(UImaxDisplayedTags),
        filter: %(UIfilter),
        showExtensions: ('%(ShowExtensions)' == 'true'),
        showCommonExtensions: ('%(ShowCommonExtensions)' == 'true'),
        supportedSubmitMethods: arrayFrom('%(SupportedSubmitMethods)'),
        discoveryUrlSelector: ('%(DiscoveryUrlSelector)' == 'true'),
        oAuth2Enabled: ('%(OAuth2Enabled)' == 'true'),
        oAuth2ClientId: '%(OAuth2ClientId)',
        oAuth2ClientSecret: '%(OAuth2ClientSecret)',
        oAuth2Realm: '%(OAuth2Realm)',
        oAuth2AppName: '%(OAuth2AppName)',
        OAuth2ScopeSeparator: '%(OAuth2ScopeSeparator)',
        oAuth2AdditionalQueryStringParams: JSON.parse('%(OAuth2AdditionalQueryStringParams)')
    };
</script>
<script>
    var multiUrls = null;
    var rootUrl = swaggerNetConfig.rootUrl
    if (swaggerNetConfig.discoveryPaths.length > 1) {
        multiUrls = [];
        swaggerNetConfig.discoveryPaths.forEach(function (path) {
            multiUrls.push({
                name: path,
                url: swaggerNetConfig.rootUrl + "/" + path
            });
        });
    }
    if (swaggerNetConfig.discoveryPaths[0]) {
        rootUrl += "/" + swaggerNetConfig.discoveryPaths[0];
    }
    window.onload = function () {
        // Build a system
        const ui = SwaggerUIBundle({
            url: rootUrl,
            urls: multiUrls,
            deepLinking: true,
            dom_id: '#swagger-ui',
            presets: [ SwaggerUIBundle.presets.apis, SwaggerUIStandalonePreset ],
            plugins: [ SwaggerUIBundle.plugins.DownloadUrl ],
            layout: "StandaloneLayout",
            docExpansion: swaggerNetConfig.docExpansion,
            defaultModelRendering: swaggerNetConfig.defaultModelRendering,
            defaultModelExpandDepth: swaggerNetConfig.defaultModelExpandDepth,
            defaultModelsExpandDepth: swaggerNetConfig.defaultModelsExpandDepth,
            maxDisplayedTags: swaggerNetConfig.maxDisplayedTags,
            filter: swaggerNetConfig.filter,
            showExtensions: swaggerNetConfig.showExtensions,
            showCommonExtensions: swaggerNetConfig.showCommonExtensions,
            supportedSubmitMethods: swaggerNetConfig.supportedSubmitMethods,
            validatorUrl: swaggerNetConfig.validatorUrl,
            oauth2RedirectUrl: (window.location.origin + window.location.pathname).replace('/index', '/oauth2-redirect-html'),
            onComplete: function () {
                swaggerNetConfig.customScripts.forEach(function (script) {
                    getScript(script);
                });
            }
        })
        window.ui = ui;

        if (swaggerNetConfig.oAuth2Enabled) {
            ui.initOAuth({
                clientId: swaggerNetConfig.oAuth2ClientId,
                clientSecret: swaggerNetConfig.oAuth2ClientSecret,
                realm: swaggerNetConfig.oAuth2Realm,
                appName: swaggerNetConfig.oAuth2AppName,
                scopeSeparator: swaggerNetConfig.OAuth2ScopeSeparator,
                additionalQueryStringParams: swaggerNetConfig.oAuth2AdditionalQueryStringParams
            })
        }
    }
</script>
</body>
</html>
  1. 在文件头部添加如下代码
<script type="text/javascript" id="mini-profiler" async="" src="/mini-profiler-resources/includes.min.js?v=4.2.1+b27bea37e9" 
        data-version="4.2.1+b27bea37e9" data-path="/mini-profiler-resources/" 
        data-current-id="94489ad6-d578-44ef-8803-3366cdeb11dd" data-ids="" 
        data-position="Right" data-scheme="Auto" data-authorized="true" data-max-traces="2" data-toggle-shortcut="Alt+P" 
        data-trivial-milliseconds="2.0" data-ignored-duplicate-execute-types="Open,OpenAsync,Close,CloseAsync"></script>
  1. 修改SwaggerConfig.cs
c.CustomAsset("index", thisAssembly, "YourProjectName.index.html");
  1. 重新运行项目,即可看到在右上角出现了监控信息

  2. 修改接口代码,再次运行,可以看到更加详细的信息

using (MiniProfiler.Current.Step("Get方法"))
            {
                using (MiniProfiler.Current.Step("准备数据"))
                {
                    using (MiniProfiler.Current.CustomTiming("SQL", "SELECT * FROM Config"))
                    {
                        // 模拟一个SQL查询
                        Thread.Sleep(500);

                        url1 = "https://www.baidu.com";
                        url2 = "https://www.sina.com.cn/";
                    }
                }


                using (MiniProfiler.Current.Step("使用从数据库中查询的数据,进行Http请求"))
                {
                    using (MiniProfiler.Current.CustomTiming("HTTP", "GET " + url1))
                    {
                        var client = new WebClient();
                        var reply = client.DownloadString(url1);
                    }

                    using (MiniProfiler.Current.CustomTiming("HTTP", "GET " + url2))
                    {
                        var client = new WebClient();
                        var reply = client.DownloadString(url2);
                    }
                }
            }


源代码地址:https://github.com/yunjie-yao/MiniProfiler-Sample/tree/main/src/API_MiniProfiler

参考文章:ASP.NET Core WebAPI中的分析工具MiniProfiler

posted @ 2020-10-31 14:37  倒不了的西恩塔  阅读(511)  评论(0)    收藏  举报