Asp.Net Web API项目配置Miniprofiler和Swagger集成
-
新建Web API项目
-
配置Swagger,本项目中使用的swagger包如下

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

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


如何才能使监控结果直接显示在Swagger页面呢?别急,继续如下步骤
- 下载默认的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>
- 在文件头部添加如下代码
<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>
- 修改SwaggerConfig.cs
c.CustomAsset("index", thisAssembly, "YourProjectName.index.html");
-
重新运行项目,即可看到在右上角出现了监控信息

-
修改接口代码,再次运行,可以看到更加详细的信息
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

浙公网安备 33010602011771号