# POM依赖的引入
```xml
<dependency>
<groupId>io.springfox</groupId>
<artifactId>springfox-swagger2</artifactId>
<version>2.5.0</version>
</dependency>
<dependency>
<groupId>io.springfox</groupId>
<artifactId>springfox-swagger-ui</artifactId>
<version>2.5.0</version>
</dependency>
```
# SwaggerConfig配置
```java
@Configuration
@EnableSwagger2
public class SwaggerConfig {
@Bean
public Docket api() {
return new Docket(DocumentationType.SWAGGER_2)
.apiInfo(apiInfo())
.select()
.apis(RequestHandlerSelectors.withMethodAnnotation(ApiOperation.class))
.build();
}
//api接口作者相关信息
private ApiInfo apiInfo() {
Contact contact = new Contact("名称", "url", "邮箱");
ApiInfo apiInfo = new ApiInfoBuilder().title("标题").description("描述").contact(contact).version("版本").build();
return apiInfo;
}
}
```
# 控制器请求
对于wagger-ui的页面访问,默认是swagger-ui.html就可访问到swagger页面,而它请求的地址是/v2/api-docs。
我们可以发现,/v2/api-docs的请求是在页面上通过http请求的,那么可以确定的是,肯定有一个js会发起请求。
我们看swagger-ui.jar,这个他是一个webjar,放着静态文件和一个swagger-ui.html页面,里面引用许多js。
因此我们可以不需要默认的swagger-ui.html访问,我们可以自定义controller,然后请求到自己的swagger-ui.html页面
```java
/**
* swagger-ui控制器,不使用原生swagger-ui页面,
* 原理:配置新请求指向该文件
* @author cgq_r
* @version 1.0
*/
@RequestMapping("/swagger")
@Controller
public class SwaggerController {
@RequestMapping("swagger-ui.html")
public String index(){
return "modules/swagger";
}
}
```
# 新建jsp页面
我们新建的是项目名/swagger/swagger-ui.html的路径。在自定义swagger页面中,只需要把原来swagger-ui.html中的内容拷贝过来即可。
```html
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/webpage/include/taglib.jsp"%>
<html>
<head>
<meta charset="UTF-8">
<title>Swagger UI</title>
<link rel="icon" type="image/png" href="${swagger}/webjars/springfox-swagger-ui/images/favicon-32x32.png" sizes="32x32"/>
<link rel="icon" type="image/png" href="${swagger}/webjars/springfox-swagger-ui/images/favicon-16x16.png" sizes="16x16"/>
<link href='${swagger}/webjars/springfox-swagger-ui/css/typography.css' media='screen' rel='stylesheet' type='text/css'/>
<link href='${swagger}/webjars/springfox-swagger-ui/css/reset.css' media='screen' rel='stylesheet' type='text/css'/>
<link href='${swagger}/webjars/springfox-swagger-ui/css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
<link href='${swagger}/webjars/springfox-swagger-ui/css/reset.css' media='print' rel='stylesheet' type='text/css'/>
<link href='${swagger}/webjars/springfox-swagger-ui/css/print.css' media='print' rel='stylesheet' type='text/css'/>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/jquery-1.8.0.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/jquery.slideto.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/jquery.wiggle.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/jquery.ba-bbq.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/handlebars-2.0.0.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/underscore-min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/backbone-min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/swagger-ui.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/highlight.7.3.pack.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/jsoneditor.min.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/marked.js' type='text/javascript'></script>
<script src='${swagger}/webjars/springfox-swagger-ui/lib/swagger-oauth.js' type='text/javascript'></script>
<%--<script src='${swagger}/webjars/springfox-swagger-ui/springfox.js' type='text/javascript'></script>--%>
<script src='${ctxStatic}/plugin/swagger/springfox.js' type='text/javascript'></script>
<style>
#header,#api_info {
display: none;
}
</style>
</head>
<body class="swagger-section">
<div id='header'>
<div class="swagger-ui-wrap">
<a id="logo" href="http://swagger.io">swagger</a>
<form id='api_selector'>
<div class='input'>
<select id="select_baseUrl" name="select_baseUrl"/>
</div>
<div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text"/>
</div>
<div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text"/></div>
<div class='input'><a id="explore" href="#" data-sw-translate>Explore</a></div>
</form>
</div>
</div>
<div id="message-bar" class="swagger-ui-wrap" data-sw-translate> </div>
<div id="swagger-ui-container" class="swagger-ui-wrap"></div>
</body>
</html>
```
这里的${swagger}就是c:set定义的当前项目路径,引用一堆js。
这里我们演示的是去除swagger-ui.html中的头部等信息,只留下接口列表,其他的都不需要。因此这里面的header需要隐藏,而不能删除,只要去除,就会因为其他原因,该页面无法正常请求展示。
我们还需要修改springfox.js,也就是swagger-ui.html引用的。
```js
$(function() {
var springfox = {
"baseUrl": function() {
var urlMatches = /(.*)\/swagger-ui.html.*/.exec(window.location.href);
var swagger = urlMatches[1].indexOf("/swagger");
var result = urlMatches[1].substring(0,swagger);
return result;
},
"securityConfig": function(cb) {
$.getJSON(this.baseUrl() + "/swagger-resources/configuration/security", function(data) {
cb(data);
});
},
"uiConfig": function(cb) {
$.getJSON(this.baseUrl() + "/swagger-resources/configuration/ui", function(data) {
cb(data);
});
}
};
window.springfox = springfox;
window.oAuthRedirectUrl = springfox.baseUrl() + '/webjars/springfox-swagger-ui/o2c.html';
window.springfox.uiConfig(function(data) {
window.swaggerUi = new SwaggerUi({
dom_id: "swagger-ui-container",
validatorUrl: data.validatorUrl,
supportedSubmitMethods: data.supportedSubmitMethods || ['get', 'post', 'put', 'delete', 'patch'],
onComplete: function(swaggerApi, swaggerUi) {
initializeSpringfox();
if (window.SwaggerTranslator) {
window.SwaggerTranslator.translate();
}
$('pre code').each(function(i, e) {
hljs.highlightBlock(e)
});
},
onFailure: function(data) {
log("Unable to Load SwaggerUI");
},
docExpansion: data.docExpansion || 'none',
jsonEditor: data.jsonEditor || false,
apisSorter: data.apisSorter || 'alpha',
defaultModelRendering: data.defaultModelRendering || 'schema',
showRequestHeaders: data.showRequestHeaders || true
});
initializeBaseUrl();
function addApiKeyAuthorization() {
var key = (window.apiKeyVehicle == 'query') ? encodeURIComponent($('#input_apiKey')[0].value) : $('#input_apiKey')[0].value;
if (key && key.trim() != "") {
var apiKeyAuth = new SwaggerClient.ApiKeyAuthorization(window.apiKeyName, key, window.apiKeyVehicle);
window.swaggerUi.api.clientAuthorizations.add(window.apiKeyName, apiKeyAuth);
log("added key " + key);
}
}
$('#input_apiKey').change(addApiKeyAuthorization);
function log() {
if ('console' in window) {
console.log.apply(console, arguments);
}
}
function oAuthIsDefined(security) {
return security.clientId
&& security.clientSecret
&& security.appName
&& security.realm;
}
function initializeSpringfox() {
var security = {};
window.springfox.securityConfig(function(data) {
security = data;
window.apiKeyVehicle = security.apiKeyVehicle || 'query';
window.apiKeyName = security.apiKeyName || 'api_key';
if (security.apiKey) {
$('#input_apiKey').val(security.apiKey);
addApiKeyAuthorization();
}
if (typeof initOAuth == "function" && oAuthIsDefined(security)) {
initOAuth(security);
}
});
}
});
$('#select_baseUrl').change(function() {
window.swaggerUi.headerView.trigger('update-swagger-ui', {
url: $('#select_baseUrl').val()
});
});
function maybePrefix(location, withRelativePath) {
var pat = /^https?:\/\//i;
if (pat.test(location)) {
return location;
}
return withRelativePath + location;
}
function initializeBaseUrl() {
var relativeLocation = springfox.baseUrl();
$('#input_baseUrl').hide();
$.getJSON(relativeLocation + "/swagger-resources", function(data) {
var $urlDropdown = $('#select_baseUrl');
$urlDropdown.empty();
$.each(data, function(i, resource) {
var option = $('<option></option>')
.attr("value", maybePrefix(resource.location, relativeLocation))
.text(resource.name + " (" + resource.location + ")");
$urlDropdown.append(option);
});
$urlDropdown.change();
});
}
});
```
我们重新拷贝并引用,其中baseUrl这个funcation是需要更改的,他会匹配响应的url,也就是你需要更改urlMatches匹配路径。其实他就是想要一个项目路径而已。
也可以根据这个文件,自定义自己的UI显示。