系统接口及调用情况
系统接口及调用情况
说明：系统中经需要统计接口的调用情况，所以特此写了这个功能。（适用于spring boot框架）
1. 统计系统中有哪些接口及接口的功能
思路，当服务器启动后统计系统的@requestMapper，并根据方法上的注解获取该接口的功能。
1.1 启动时注册一个监听器
SpringApplication app=new SpringApplication(Application.class);
app.addListeners(new ApplicationStartup());
app.run( args);
1.2 编写监听器中的业务逻辑
public class ApplicationStartup implements ApplicationListener
public void onApplicationEvent(ContextRefreshedEvent event) {
getAllUrls(event);
}
/**
* 获取所有的url数据
* @param event
*/
public void getAllUrls(ContextRefreshedEvent event) {
AbstractHandlerMethodMapping
InterfaceMethodMapper interfaceMethodMapper=event.getApplicationContext().getBean(InterfaceMethodMapper.class);
Map
//先删除所有数据
interfaceMethodMapper.deleteByExample(null);
if(mapRet!=null){
List
Date date=new Date();
for(RequestMappingInfo info:mapRet.keySet()) {
HandlerMethod handlerMethod=mapRet.get(info);
//获取对应的类
String type=handlerMethod.getBeanType().getName();
//获取方法
Method method=handlerMethod.getMethod();
InterfaceDescript interfaceScript=method.getAnnotation(InterfaceDescript.class);
String name=method.getName();
//只对有该注解的方法做处理
if(interfaceScript!=null) {
String descript=interfaceScript.value();
//获取url
Set
for(String url:urls) {
InterfaceMethod interfaceMethod=new InterfaceMethod();
interfaceMethod.setPath(url);
interfaceMethod.setClassName(type);
interfaceMethod.setMethodName(name);
interfaceMethod.setRmark(descript);
interfaceMethod.setCreateTime(date);
InterfaceMethodList.add(interfaceMethod);
}
}
}
if(InterfaceMethodList.size()>0) {
//将获取的url信息插入到数据库中
interfaceMethodMapper.insertList(InterfaceMethodList);
}
}
}
}
1.3 对应的数据库（mapper是通过工具直接生成的）
CREATE TABLE `interface_method` (
`path` varchar(200) NOT NULL COMMENT '路径',
`class_name` varchar(200) NOT NULL COMMENT '类名',
`method_name` varchar(100) NOT NULL COMMENT '方法名',
`rmark` varchar(1000) NOT NULL COMMENT '备注',
`create_time` datetime NOT NULL COMMENT '更新时间',
PRIMARY KEY (`path`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;
批量插入数据
<insert id="insertList" parameterType="com.trilink.counter.entity.InterfaceMethod" >
insert into interface_method (path, class_name, method_name,
rmark, create_time)
values
<foreach collection="recordList" separator="," item="record">
(#{record.path,jdbcType=VARCHAR}, #{record.className,jdbcType=VARCHAR}, #{record.methodName,jdbcType=VARCHAR},
#{record.rmark,jdbcType=VARCHAR}, #{record.createTime,jdbcType=TIMESTAMP})
foreach>
insert>
2. 通过spring AOP拦截Controller对应的方法获取返回数据，以便于通过返回值获取响应数成功与否.
2.1 拦截器的设计
/***
* aop拦截器获取返回值(返回对象里面有 errCode字段的可以做出处理)
*
* @author acer
*
*/
@Aspect
@Component
public class ControllerInterceptor {
@Autowired
private InterfaceCounterMapper interfaceCounterMapper;
//用于存放请求数据
private static List
//统计数量达到限制后批量写入数据库，以减轻数据库压力
public static final int UPDATESIZE=3;
/**
* 定义拦截规则：拦截com.xjj.web.controller包下面的所有类中，有@RequestMapping注解的方法。
*/
@Pointcut("(execution(* com.trilink.common.controller..*(..)) || execution(* com.trilink.counter.controller..*(..))) and @annotation(org.springframework.web.bind.annotation.RequestMapping)")
public void controllerMethodPointcut() {
}
/**
* 拦截器具体实现
*
* @param pjp
* @return JsonResult（被拦截方法的执行结果，或需要登录的错误提示。）
*/
@Around("controllerMethodPointcut()") // 指定拦截器规则；也可以直接把“execution(* com.xjj.........)”写进这里
public Object Interceptor(ProceedingJoinPoint pjp) {
boolean isError = false;
Object result = null;
Gson gson = new Gson();
ServletRequestAttributes requestAttributes = (ServletRequestAttributes) RequestContextHolder.getRequestAttributes();
HttpServletRequest httpServletRequest = requestAttributes.getRequest();
//获取请求路径
String url=httpServletRequest.getRequestURI();
String appId=httpServletRequest.getParameter("appId");
Map
//获取请求参数
String param=gson.toJson(par);
String errMsg;
int mcode=-1;
try {
result = pjp.proceed();
String json = gson.toJson(result);
Map
Object code = reponse.get("errCode");
errMsg = (String)reponse.get("errMsg");
if (code != null) {
if (code instanceof Integer) {
mcode=(int)(code);
} else if (code instanceof String) {
mcode=Integer.parseInt((String)code);
} else if (code instanceof Double) {
Double cd=(Double)code;
mcode=cd.intValue();
} else if (code instanceof Long) {
mcode=(int)(code);
}
}
} catch (Throwable e) {
Map
error.put("errCode", -1);
error.put("errMsg", e.getMessage());
result = error;
mcode=-2;
isError = true;
errMsg= e.getMessage();
}
InterfaceCounter InterfaceCounter=new InterfaceCounter();
InterfaceCounter.setPath(url);
InterfaceCounter.setParam(param);
InterfaceCounter.setMessage(errMsg);
InterfaceCounter.setStatus(mcode);
InterfaceCounter.setCreateTime(new Date());
InterfaceCounter.setAppId(appId);
list.add(InterfaceCounter);
if(list.size()>=UPDATESIZE) {
interfaceCounterMapper.insertList(list);
list.removeAll(list);
}
return result;
}
}
3. 数据的展示
说明:数据主要以图表的形式展示，前台html页面通过ajax请求来与后台交互。
3.1 后台服务的编写
/**
* 统计接口请求量
* @author acer
*
*/
@Controller
@RequestMapping("interfaceCounter")
public class InterfaceCounterController {
@Autowired
private InterfaceCounterService interfaceCounterService;
@RequestMapping("counterInterface")
@ResponseBody
@InterfaceDescript("统计接口请求量")
/**
* 统计信息
* @param type 类型，1:年,2:月,3:日,4:小时,5:分
* @param year
* @param month
* @param day
* @param hour
* @param min
* @return
*/
public Map
Map
if(type==null) {
type=1;
year=2010;
}
if(type==1) {
year=2010;
}
try {
result=interfaceCounterService.counterInterface(type,year,month,day,hour);
}catch(Exception e) {
result.put("errCode", 101);
result.put("errMsg", "查询失败:"+e.getMessage());
}
return result;
}
@RequestMapping("counterMathods")
@ResponseBody
@InterfaceDescript("某个接口的单位请求量")
/**
*
* @param type 类型，1:年,2:月,3:日,4:小时,5:分
* @param year
* @param month
* @param day
* @param hour
* @return
*/
public Map
Map
if(type==null) {
type=1;
year=2010;
}
try {
result=interfaceCounterService.counterMathods(type,year,month,day,hour);
}catch(Exception e) {
result.put("errCode", 101);
result.put("errMsg", "查询失败:"+e.getMessage());
}
return result;
}
@RequestMapping("mathodsDetail")
@ResponseBody
@InterfaceDescript("所有接口的详细信息")
/**
*
* @param order 1位降序，2为升序（时间）
* @param page默认值为1
* @param rows
* @return
*/
public Map
Map
if(page==null||page<1) {
page=1;
}
if(order==null||order<1) {
order=1;
}
if(rows==null||rows<1) {
rows=10;
}
try {
result=interfaceCounterService.mathodsDetail(order,page,rows,start,end);
}catch(Exception e) {
result.put("errCode", 101);
result.put("errMsg", "查询失败:"+e.getMessage());
}
return result;
}
}
@Service
public class InterfaceCounterService {
@Autowired
private InterfaceCounterMapper interfaceCounterMapper;
/**
* 统计接口请求信息
* @param type 类型，1:年,2:月,3:日,4:小时,5:分
* @param year
* @param month
* @param day
* @param hour
* @param min
* @return
*/
public Map
Map
Calendar calendar=Calendar.getInstance();
List
if(type==1) {//年
timeList=getListYear(calendar.get(Calendar.YEAR),year);
}else if(type==2) {//月
timeList=getListMonth(year);
}else if(type==3) {//日
timeList=getListDay(year, month);
}else if(type==4) {//时
timeList=getListHour(year, month, day);
}else if(type==5) {//分
timeList=getListMinut(year, month, day, hour);
}
if(timeList==null||timeList.size()<1) {
result.put("errCode", 101);
result.put("errMsg", "输入的参数存在问题");
return result;
}else {
Date start=null;
Date end=null;
//总请求量
List
//描述
List
//成功请求量
List
for(int i=0;i<timeList.size()-1;i++) {
start=timeList.get(i);
end=timeList.get(i+1);
InterfaceCounterExample interfaceCounterExample =new InterfaceCounterExample();
InterfaceCounterExample.Criteria interfaceCounterExampleCriteria = interfaceCounterExample.createCriteria();
interfaceCounterExampleCriteria.andCreateTimeBetween(start, end);
int count=interfaceCounterMapper.countByExample(interfaceCounterExample);
numberList.add(count);
InterfaceCounterExample interfaceCounterExample2 =new InterfaceCounterExample();
InterfaceCounterExample.Criteria interfaceCounterExampleCriteria2 = interfaceCounterExample2.createCriteria();
interfaceCounterExampleCriteria2.andStatusEqualTo(0);
interfaceCounterExampleCriteria2.andCreateTimeBetween(start, end);
int countSuccess=interfaceCounterMapper.countByExample(interfaceCounterExample2);
successList.add(countSuccess);
//根据不同的类型返回不同的坐标数据
if(type==1) {//年
decsList.add(start.getYear()+1900);
}else if(type==2) {//月
decsList.add(start.getMonth()+1);
}else if(type==3) {//日
decsList.add(start.getDate());
}else if(type==4) {//时
decsList.add(start.getHours());
}else if(type==5) {//分
decsList.add(start.getMinutes());
}
}
result.put("dataY", numberList);
result.put("sdataY", successList);
result.put("dataX", decsList);
result.put("errCode", 0);
result.put("errMsg", "查询成功");
}
return result;
}
/**
* 根据日期统计每个接口调用情况
* @param type
* @param year
* @param month
* @param day
* @param hour
* @return
*/
public Map
Map
Date start=getFirstDate(type,year, month, day, hour);
Date end=getLastDate(type,year, month, day, hour);
List
List
List
for(InterfaceCounter item:list) {
dataY.add(item.getPath());
dataX.add(item.getNum());
}
result.put("dataY", dataY);
result.put("dataX", dataX);
result.put("errCode", 0);
result.put("errMsg", "查询成功");
return result;
}
public Map
Map
InterfaceCounterExample interfaceCounterExample = new InterfaceCounterExample();
InterfaceCounterExample.Criteria InterfaceCounterExampleCriteria=interfaceCounterExample.createCriteria();
if(order==1) {
interfaceCounterExample.setOrderByClause("create_time desc");
}else {
interfaceCounterExample.setOrderByClause("create_time asc");
}
//当时间不为空时根据时间段查询
if(start!=null&&!start.equals("")&&end!=null&&!end.equals("")) {
SimpleDateFormat fmt=new SimpleDateFormat("yyyy-MM-dd HH:mm");
Date startDate=fmt.parse(start);
Date endDate=fmt.parse(end);
InterfaceCounterExampleCriteria.andCreateTimeBetween(startDate, endDate);
}
PageHelper.startPage(page, rows);
List
PageInfo
result.put("data", list);
result.put("tatal", pages.getTotal());
result.put("errCode", 0);
result.put("errMsg", "查询成功");
return result;
}
/**
* 获取当前时间的第一时刻
* @param type 1:年，2：月，3：日，4:小时
* @param year
* @param month
* @param day
* @param hour
* @return
*/
private static Date getFirstDate(Integer type, Integer year, Integer month, Integer day, Integer hour) {
Calendar calendar=Calendar.getInstance();
if(type==1) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, 0);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
return calendar.getTime();
}else if(type==2) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
return calendar.getTime();
}else if(type==3) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH,day);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
return calendar.getTime();
}else if(type==4||type==5) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH,day);
calendar.set(Calendar.HOUR_OF_DAY, hour);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
return calendar.getTime();
}
return null;
}
/**
* 获取当前时间的第一时刻
* @param type 1:年，2：月，3：日，4:小时
* @param year
* @param month
* @param day
* @param hour
* @return
*/
private static Date getLastDate(Integer type, Integer year, Integer month, Integer day, Integer hour) {
Calendar calendar=Calendar.getInstance();
if(type==1) {
calendar.set(Calendar.YEAR, year+1);
calendar.set(Calendar.MONTH, 0);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
return calendar.getTime();
}else if(type==2) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
return calendar.getTime();
}else if(type==3) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH,day+1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
return calendar.getTime();
}else if(type==4||type==5) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH,day);
calendar.set(Calendar.HOUR_OF_DAY, hour+1);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
return calendar.getTime();
}
return null;
}
/**
* 获取年的列表
* @param year
* @return
*/
private static List
List
Calendar calendar=Calendar.getInstance();
Date cur=calendar.getTime();
for(;current>=year;year++) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, 0);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
list.add(calendar.getTime());
}
list.add(cur);
return list;
}
/**
* 获取月列表
* @param currentYear
* @param year
* @param month
* @return
*/
private static List
List
Calendar calendar=Calendar.getInstance();
Date current=calendar.getTime();
int currentYear=calendar.get(Calendar.YEAR);
int end=0;
if(year<calendar.get(Calendar.YEAR)) {
end=11;
}else {
end=calendar.get(Calendar.MONTH);
}
for(int i=0;i<=end;i++) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, i);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
list.add(calendar.getTime());
}
if(year>=currentYear) {
list.add(current);
}else {
calendar.set(Calendar.YEAR, year+1);
calendar.set(Calendar.MONTH, 0);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
list.add(calendar.getTime());
}
return list;
}
/**
* 获取某个月对应的日
* @param year
* @param month
* @return
*/
private static List
List
Calendar calendar=Calendar.getInstance();
Date current=calendar.getTime();
int day=calendar.get(Calendar.DAY_OF_MONTH);
int end=0;
Date endDay=calendar.getTime();
if(year<calendar.get(Calendar.YEAR)||(year==calendar.get(Calendar.YEAR)&&(month-1)<calendar.get(Calendar.MONDAY))) {
//获取本月最后一天
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month);
calendar.set(Calendar.DAY_OF_MONTH, 1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
endDay=calendar.getTime();
end=calendar.get(Calendar.DAY_OF_MONTH);
}else if(year==calendar.get(Calendar.YEAR)&&(month-1)==calendar.get(Calendar.MONDAY)){
endDay=current;
end=day;
}
for(int i=1;i<=end;i++) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH, i);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
list.add(calendar.getTime());
}
list.add(endDay);
return list;
}
/**
* 获取当天的时间列表信息
* @param year
* @param month
* @param day
* @return
*/
private static List
List
Calendar calendar=Calendar.getInstance();
Date current=calendar.getTime();
//是当天时间
int end=0;
boolean isCurrent=false;
if(year==calendar.get(Calendar.YEAR)&&(month-1)==calendar.get(Calendar.MONTH)&&day==calendar.get(Calendar.DAY_OF_MONTH)) {
//获取现在时间
end=calendar.get(Calendar.HOUR_OF_DAY);
isCurrent=true;
}else {
end=23;
}
for(int i=0;i<=end;i++) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH, day);
calendar.set(Calendar.HOUR_OF_DAY, i);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, 0);
list.add(calendar.getTime());
}
if(isCurrent) {
list.add(current);
}else {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH, day+1);
calendar.set(Calendar.HOUR_OF_DAY, 0);
calendar.set(Calendar.MINUTE, 0);
calendar.set(Calendar.SECOND, -1);
list.add(calendar.getTime());
}
return list;
}
/**
* 获取当天小时列表
* @param year
* @param month
* @param day
* @param hour
* @return
*/
private static List
List
Calendar calendar=Calendar.getInstance();
Date current=calendar.getTime();
int minut=0;
if(year==calendar.get(Calendar.YEAR)&&(month-1)==calendar.get(Calendar.MONTH)&&day==calendar.get(Calendar.DAY_OF_MONTH)&&hour==calendar.get(Calendar.HOUR_OF_DAY)) {
minut=calendar.get(Calendar.MINUTE);
}else {
minut=60;
}
//每5分钟统计一次
for(int i=0;i<=minut;i+=5) {
calendar.set(Calendar.YEAR, year);
calendar.set(Calendar.MONTH, month-1);
calendar.set(Calendar.DAY_OF_MONTH, day);
calendar.set(Calendar.HOUR_OF_DAY,hour);
calendar.set(Calendar.MINUTE, i);
calendar.set(Calendar.SECOND, 0);
list.add(calendar.getTime());
}
return list;
}
}
/**
* 统计系统接口的数量和基本信息
* @author acer
*
*/
@Controller
@RequestMapping("interfaceMethod")
public class InterfaceMethodController {
@Autowired
private InterfaceMethodService interfaceMethodService;
@RequestMapping("/listMethod")
@ResponseBody
@InterfaceDescript("获取系统中的调用接口信息")
public Map
if(page==null||page<=0) {
page=1;
}
if(rows==null||rows<=0) {
rows=10;
}
Map
try {
result=interfaceMethodService.listInterfaceMethod(page, rows);
}catch(Exception e) {
result.put("errCode", 101);
result.put("errMsg", "查询失败");
}
return result;
}
}
@Service
public class InterfaceMethodService {
@Autowired
private InterfaceMethodMapper interfaceMethodMapper;
/**
* 查询接口信息
* @return
*/
public Map
Map
PageHelper.startPage(page, rows);
List
PageInfo
result.put("data", pageinfo.getList());
result.put("total", pageinfo.getTotal());
result.put("errCode", 0);
result.put("errMsg", "查询成功");
return result;
}
}
3.2数据表
CREATE TABLE `interface_counter` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`path` varchar(200) CHARACTER SET utf8 NOT NULL COMMENT '请求的url',
`status` int(11) DEFAULT '-1' COMMENT '请求状态码： 默认值为-1，0成功，大于0失败',
`message` varchar(100) CHARACTER SET utf8 DEFAULT NULL COMMENT '响应信息',
`create_time` datetime DEFAULT NULL COMMENT '请求时间',
`param` varchar(255) CHARACTER SET utf8 DEFAULT NULL COMMENT '请求参数',
`app_id` varchar(100) CHARACTER SET utf8 DEFAULT NULL COMMENT 'app的标识',
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=990 DEFAULT CHARSET=utf8mb4;
其中controller中使用了自定义注解，主要是为了获取接口功能信息。
3.3html页面的展示
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>系统接口信息title>
<link href="/css/bootstrap.min.css" rel="stylesheet" />
<link href="/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css" rel="stylesheet" media="screen">
<link href="/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
head>
<style>
.chart{
width:1000px;
height:500px;
}
style>
<script type="text/javascript" src="/js/jquery-1.7.2.min.js">script>
<script type="text/javascript" src="/js/echarts.min.js">script>
<script type="text/javascript" src="js/bootstrap.min.js">script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8">script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js" charset="UTF-8">script>
<body>
<div class="container">
<div class="row">
<div class="col-md-12" style="height:60px;">div>
<div class="form-group col-md-5">
<label for="type" class="col-sm-3 control-label">视图方式:label>
<div class="col-sm-6">
<select id="type" class="form-control">
<option value="5">分钟option>
<option value="4">小时option>
<option value="3" selected >日option>
<option value="2">月option>
<option value="1">年option>
select>
div>
div>
<div class="form-group col-md-5">
<label for="dtp_input1" class="col-md-3 control-label">时间:label>
<div class="input-group date form_datetime col-md-6" data-date-format="yyyy/MM/dd - hh:ii" data-link-field="dtp_input1">
<input id="dates" class="form-control" size="16" type="text" value="" readonly>
<span class="input-group-addon"><span class="glyphicon glyphicon-remove">span>span>
<span class="input-group-addon"><span class="glyphicon glyphicon-th">span>span>
div>
<input type="hidden" id="dtp_input1" value="" /><br/>
div>
<div class="form-group col-md-2">
<button class="btn btn-success" id="search">
<span class="glyphicon glyphicon-search">span>查询
button>
div>
<div class="col-lg-12">
<div id="chart" class="chart">
div>
div>
<div class="col-lg-12">
<div id="chart2" class="chart">
div>
div>
div>
div>
body>
<script>
//对控件汉化
$.fn.datetimepicker.dates['zh-CN'] = {
days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
daysMin: ["日", "一", "二", "三", "四", "五", "六", "日"],
months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
today: "今天",
suffix: [],
meridiem: ["上午", "下午"]
};
var pic=$('.form_datetime').datetimepicker({
format: "yyyy-mm-dd hh:ii",
autoclose: true,
todayBtn: true,
language:'zh-CN',
pickerPosition:"bottom-left"
});
$(function(){
var chart=$("#chart").get(0);
var myChart=echarts.init(chart);
//异步加载数据
var date1=new Date();
$('.form_datetime').data("datetimepicker").setDate(date1);
var year1=date1.getYear()+1900;
var month1=date1.getMonth()+1;
var day1=date1.getDate();
var hours1=date1.getHours();
loadData(myChart,3,year1,month1,day1,hours1);
var chart2=$("#chart2").get(0);
var myChart2=echarts.init(chart2);
loadMethodsData(myChart2,3,year1,month1,day1,hours1);
/*
$("#type").change(function(){
var type=$(this).val();
var date=$('.form_datetime').data("datetimepicker").getDate();
var year=date.getYear()+1900;
var month=date.getMonth()+1;
var day=date.getDate();
var hours=date.getHours();
loadData(myChart,type,year,month,day,hours);
loadMethodsData(myChart2,type,year1,month1,day1,hours1);
//用户获取时间数据
});
*/
$("#search").click(function(){
var type=$("#type").val();
var date=new Date($("#dates").val());
var year=date.getYear()+1900;
var month=date.getMonth()+1;
var day=date.getDate();
var hours=date.getHours();
loadData(myChart,type,year,month,day,hours);
loadMethodsData(myChart2,type,year1,month1,day1,hours1);
});
});
function loadMethodsData(myChart,type,year,month,day,hours){
var title="";
if(type==1){
title="年请求量"
}else if(type==2){
title="月请求量"
}else if(type==3){
title="日请求量"
}else if(type==4){
title="时请求量"
}
$.ajax({
url:'/interfaceCounter/counterMathods.do',
data:{'appId':10010,'type':type,'year':year,'month':month,'day':day,'hour':hours},
dataType:'json',
type:'post',
success:function(data){
if(data.errCode==0){
var dataX=data.dataX;
var dataY=data.dataY;
var option = {
dataZoom: {
orient: 'vertical', // 布局方式，默认为水平布局，可选为：
backgroundColor: 'rgba(0,0,0,0)', // 背景颜色
dataBackgroundColor: '#eee', // 数据背景颜色
fillerColor: 'rgba(144,197,237,0.2)', // 填充颜色
handleColor: 'rgba(70,130,180,0.8)' // 手柄颜色
},
title : {
text: title
},
tooltip : {
trigger: 'axis'
},
legend: {
data:['接口请求']
},
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType: {show: true, type: ['line', 'bar']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
xAxis : [
{
type : 'value',
boundaryGap : [0, 0.01]
}
],
yAxis : [
{
type : 'category',
data : dataY
}
],
series : [
{
name:'接口请求',
type:'bar',
data:dataX
}
]
};
myChart.setOption(option);
}
}
});
}
function loadData(myChart,type,year,month,day,hours){
//设置x周轴单位
var wei="hello";
if(type==1){
wei="年";
}else if(type==2){
wei="月";
}else if(type==3){
wei="日";
}else if(type==4){
wei="时";
}else if(type==5){
wei="分";
}
$.ajax({
url:'/interfaceCounter/counterInterface.do',
data:{'appId':10010,'type':type,'year':year,'month':month,'day':day,'hour':hours},
dataType:'json',
type:'post',
success:function(data){
var chartDate=[];
//var weight=[55.4,55.9,53];
var weight=[];
var weight2=[];
var weight3=[];
//对echarts做基础配置
if(data.errCode==0){
chartDate=data.dataX;
weight=data.dataY;
weight2=data.sdataY;
for(var i=0;i
var temp=weight[i]-weight2[i];
weight3.push(temp);
}
}
option={
toolbox: {
show : true,
feature : {
mark : {show: true},
dataView : {show: true, readOnly: false},
magicType : {show: true, type: ['line', 'bar']},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
title:{
text: '请求量走势图'
},
legend: {
data:['总请求量','成功请求','失败请求']
},
tooltip : {
trigger: 'axis',
},
label:{
normal:{
show:true,
position:[0,-20],
textStyle:{
color:"#1daffa"
}
}
},
/*
lineStyle:{
normal:{
color: 'rgba(29, 175, 250,1)',
}
},
itemStyle:{
normal:{
color: 'rgba(29, 175, 250, 0.8)',
}
},
*/
xAxis:[
{
type : 'category',
boundaryGap : false,
data :chartDate,
axisLabel : {
formatter: '{value}'+wei
}
}
],
yAxis:{}
,
series:[
{
name:"总请求量",
type:"line",//折线图，还有pie（饼状图），
data:weight,
itemStyle:{
normal:{
color: 'rgba(255,0,0, 0.8)',
}
}
},
{
name:"成功请求",
type:"line",//折线图，还有pie（饼状图），
data:weight2,
itemStyle:{
normal:{
color: 'rgba(0,0,255, 0.8)',
}
}
},
{
name:"失败请求",
type:"line",//折线图，还有pie（饼状图），
data:weight3,
itemStyle:{
normal:{
color: 'rgba(0, 255, 0, 0.8)',
}
}
}
]
}
myChart.setOption(option);
}
});
}
script>
html>
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>系统接口详细信息title>
<link href="/css/bootstrap.min.css" rel="stylesheet" />
<link href="/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css" rel="stylesheet" media="screen">
<link href="/js/bootstrap-datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet" media="screen">
head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12" style="height:20px;">div>
<div class="col-lg-12">
<div>
<div class="form-group col-md-5">
<label for="dtp_input1" class="col-md-4 control-label">开始时间:label>
<div class="input-group date form_datetime col-md-8" data-date-format="yyyy/MM/dd - hh:ii" data-link-field="dtp_input1">
<input class="form-control" id="startTime" size="16" type="text" value="" readonly>
<span class="input-group-addon"><span class="glyphicon glyphicon-remove">span>span>
<span class="input-group-addon"><span class="glyphicon glyphicon-th">span>span>
div>
div>
<div class="form-group col-md-5">
<label for="dtp_input2" class="col-md-4 control-label">结束时间:label>
<div class="input-group date form_datetime col-md-8" data-date-format="yyyy/MM/dd - hh:ii" data-link-field="dtp_input1">
<input class="form-control" id="endTime" size="16" type="text" value="" readonly>
<span class="input-group-addon"><span class="glyphicon glyphicon-remove">span>span>
<span class="input-group-addon"><span class="glyphicon glyphicon-th">span>span>
div>
div>
<div class="form-group col-md-2">
<button class="btn btn-success" id="search">
<span class="glyphicon glyphicon-search">span>查询
button>
<button class="btn btn-warning" id="reset">
<span class="glyphicon glyphicon-remove-sign">span>重置
button>
div>
div>
<div>
<table id="table" class="table table-bordered">
<thead align="center">
<tr>
<td>编号td>
<td>请求路径td>
<td>请求日期td>
<td>状态码td>
<td>返回信息(message)td>
<td>请求参数td>
tr>
thead>
<tbody align="center">
tbody>
table>
div>
<div>
<ul class="pagination">
<li><a class="first" href="#">«上一页a>li>
<li><a value="0" class="index disabled" href="#">1a>li>
<li><a class="total disabled" href="#">总数:a>li>
<li><a class="next" href="#">下一页»a>li>
ul>
div>
div>
div>
div>
body>
<script type="text/javascript" src="/js/jquery-1.7.2.min.js">script>
<script type="text/javascript" src="js/bootstrap.min.js">script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js" charset="UTF-8">script>
<script type="text/javascript" src="/js/bootstrap-datetimepicker/js/bootstrap-datetimepicker.min.js" charset="UTF-8">script>
<script>
$.fn.datetimepicker.dates['zh-CN'] = {
days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
daysMin: ["日", "一", "二", "三", "四", "五", "六", "日"],
months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
today: "今天",
suffix: [],
meridiem: ["上午", "下午"]
};
$('.form_datetime').datetimepicker({
format: "yyyy-mm-dd hh:ii",
autoclose: true,
todayBtn: true,
language:'zh-CN',
pickerPosition:"bottom-left"
});
$(function(){
$("#search").click(function(){
var startTime=$("#startTime").val();
var endTime=$("#endTime").val();
$(".pagination .index").attr("value",0)
$(".pagination .index").html("当前"+0+"页");
createTable({'page':1,'rows':10,'start':startTime,'end':endTime},1);
});
$("#reset").click(function(){
$("#startTime").val("");
$("#endTime").val("");
});
$(".pagination .first").click(function(){
var index=parseInt($(".pagination .index").attr("value"))-1;
if(index>0){
var startTime=$("#startTime").val();
var endTime=$("#endTime").val();
createTable({'page':index,'rows':10,'start':startTime,'end':endTime},2);
}
});
$(".pagination .next").click(function(){
var index=parseInt($(".pagination .index").attr("value"))+1;
var tatal=parseInt($(".pagination .total").attr("value"));
if((index-1)*10
var startTime=$("#startTime").val();
var endTime=$("#endTime").val();
createTable({'page':index,'rows':10,'start':startTime,'end':endTime},1);
}
});
createTable({'page':1,'rows':10},1);
});
function createTable(datas,type){
$.ajax({
url:'/interfaceCounter/mathodsDetail.do',
data:datas,
dataType:'json',
type:'post',
success:function(data){
if(data.errCode!=0){
$("#table tbody").html("无法获取数据
}else{
var table="";
var index="";
if(type==1){
index=parseInt($(".pagination .index").attr("value"))+1;
}else{
index=parseInt($(".pagination .index").attr("value"))-1;
}
$(".pagination .index").attr("value",index)
$(".pagination .index").html("当前"+index+"页");
$(".pagination .total").html("共"+data.tatal+"条");
$(".pagination .total").attr("value",data.tatal);
for(var i=0;i
var item=data.data[i];
table+=" table+=" table+=" table+=" table+=" table+=" table+=" table+="";
";"+item.id+" ";
"+item.path+" ";
"+item.createTime+" ";
"+item.status+" ";
"+item.message+" ";
"+item.param+" ";
}
$("#table tbody").html(table);
}
}
});
}
script>
html>
DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>系统接口信息title>
<link href="/css/bootstrap.min.css" rel="stylesheet" />
head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12" style="height:20px;">div>
<div class="col-lg-12">
<div>
<table id="table" class="table table-bordered">
<thead align="center">
<tr>
<td>编号td>
<td>接口描述td>
<td>请求路径td>
<td>类名td>
<td>方法名td>
tr>
thead>
<tbody align="center">
tbody>
table>
div>
div>
div>
div>
body>
<script type="text/javascript" src="/js/jquery-1.7.2.min.js">script>
<script>
$(function(){
$.ajax({
url:'/interfaceMethod/listMethod.do',
data:{'page':1,'rows':1000},
dataType:'json',
type:'post',
success:function(data){
if(data.errCode!=0){
$("#table tbody").html("无法获取数据
}else{
var $tbody=$("#table tbody");
var items=data.data;
var str="";
var index=0;
for(var i=0;i
index++;
var item=items[i];
str+=" str+=" str+=" str+=" str+=" str+=" str+="";
";"+index+" ";
"+item.rmark+" ";
"+item.path+" ";
"+item.className+" ";
"+item.methodName+" ";
}
$tbody.html(str);
}
}
});
});
script>
html>
3.4效果展示图
