本篇分为以下几个部分:
Swagger的简单应用
1、首先新建一个Api项目
2、使用Nuget添加Swashbuckle.AspNetCore,我使用的版本为1.1.0(
版本不一样,后面的配置可能不一样)
3、为了在swagger上显示注释,右键项目MiniprofilerApi,属性=>生成=>输出为XML文档文件
4、右键项目=>编辑.csproj添加如下代码,避免一些警告:
4、在Startup类的ConfigureServices方法和Configure方法中配置如下:
5、添加接口注释:
6、修改项目运行端口,访问路径,关闭ssl,右键项目=>属性=>调试,配置如下:
7、启动项目,界面效果如下:
Miniprofier的后台配置
1、安装MiniProfiler.AspNetCore.Mvc
2、在Startup类的ConfigureServices方法和Configure方法中配置如下:
3、运行程序:访问http://localhost:5000/mini-profiler-resources/results
跨域配置:
在angular中显示Miniprofier
1、在页面创建Miniprofier需要的js和css
import { Component } from ‘@angular/core‘;
import { HttpClient } from‘@angular/common/http‘;
@Component({
selector:‘app-root‘,templateUrl:‘./app.component.html‘,styleUrls: [‘./app.component.css‘]
})
export class AppComponent {
private src: string= ‘http://localhost:5000/mini-profiler-resources/‘;
private scriptSrc: string= `${this.src}includes.min.js`;
private cssSrc: string= `${this.src}includes.min.css`;
private id: string= ‘mini-profiler‘;
private dataPath: string= `${this.src}`;
private dataVersion: string= ‘‘;
private dataPosition: string= ‘right‘;
private dataChildren:boolean = true;
private dataMaxTraces: number= 35;
private dataAuthorized:boolean = true;
private dataStartHidden: string= ‘false‘;
private dataToggleShortcut: string= ‘Alt+P‘;
private dataTrivialMilliseconds: number= 35;
private dataTrivial:boolean = true;
private dataControls:boolean = true;
private dataCurrentId: string= ‘‘;
private dataIds: string= ‘‘;
private scriptAsync:boolean = true;
private innerHTML: string= ‘‘;
constructor(private http: HttpClient){
}
ngAfterViewInit():void{//添加Miniprofier的js
this.appendDivElement();//添加Miniprofier的css
t