如何Spring Cloud Zuul作為網關的分布式系統中整合Swagger文檔在同一個頁面上
本文不涉及技術，只是單純的一個小技巧。
閱讀本文前，你需要對spring-cloud-zuul、spring-cloud-eureka、以及swagger的配置和使用有所了解。
如果你的系統也是用zuul作為分布式系統的網關，同時使用swagger生成文檔，想把整個系統的文檔整合在同一個頁面上，可以參考本文。
項目結構
eureka-server：eureka服務註冊中心，端口8080,
zuul-server：zuul網關，端口8081
payment-server：支付系統，端口8082
order-server：訂單系統，端口8083
order-server1：訂單系統，端口8084
order-server2：訂單系統，端口8085
其中order-server、order-server1、order-server2組成訂單系統集群。
下面是運行後的效果圖：
打開zuul的swagger首頁http://localhost:8081/swagger-ui.html
實現方法
zuul-server
路由配置
zuul:
routes:
payment-server:
path: /pay/**
order-server:
path: /order/**
1
2
3
4
5
6
swagger配置類SwaggerConfig
@Configuration
@EnableSwagger2
public class SwaggerConfig {
@Bean
public Docket createRestApi() {
return new Docket(DocumentationType.SWAGGER_2)
.apiInfo(apiInfo());
}
private ApiInfo apiInfo() {
return new ApiInfoBuilder()
.title("分布式購物系統")
.description("購物系統接口文檔說明")
.termsOfServiceUrl("http://localhost:8081")
.contact(new Contact("vker", "", "[email protected]"))
.version("1.0")
.build();
}
@Bean
UiConfiguration uiConfig() {
return new UiConfiguration(null, "list", "alpha", "schema",
UiConfiguration.Constants.DEFAULT_SUBMIT_METHODS, false, true, 60000L);
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
重點：swagger文檔資源配置類DocumentationConfig
@Component
@Primary
public class DocumentationConfig implements SwaggerResourcesProvider {
@Override
public List<SwaggerResource> get() {
List resources = new ArrayList<>();
resources.add(swaggerResource("訂單系統", "/order/v2/api-docs", "2.0"));
resources.add(swaggerResource("支付系統", "/pay/v2/api-docs", "2.0"));
return resources;
}
private SwaggerResource swaggerResource(String name, String location, String version) {
SwaggerResource swaggerResource = new SwaggerResource();
swaggerResource.setName(name);
swaggerResource.setLocation(location);
swaggerResource.setSwaggerVersion(version);
return swaggerResource;
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
可以看出來實現的重點就在DocumentationConfig中，通過配置文檔資源，當在首頁下拉框選擇訂單系統時，會請求http://localhost:8081/order/v2/api-docs獲取文檔詳情，而根據zuul的路由配置，zuul會將/order/**請求路由到serviceId為order-server的系統上。而且由於order-server是一個集群，就算其中一臺服務掛掉，也不會影響到文檔的獲取。
order-server
swagger配置類SwaggerConfig,order-server、payment-serverswagger配置基本相同。
@Configuration
@EnableSwagger2
public class SwaggerConfig {
@Bean
public Docket createRestApi() {
return new Docket(DocumentationType.SWAGGER_2)
.apiInfo(apiInfo())
.select()
.apis(RequestHandlerSelectors.basePackage("w.m.vker.demo"))
.apis(RequestHandlerSelectors.withClassAnnotation(Api.class))
.apis(RequestHandlerSelectors.withMethodAnnotation(ApiOperation.class))
.paths(PathSelectors.any())
.build();
}
private ApiInfo apiInfo() {
return new ApiInfoBuilder()
.title("訂單系統api")
.description("訂單系統接口文檔說明")
.contact(new Contact("vker", "", "[email protected]"))
.version("1.0")
.build();
}
@Bean
UiConfiguration uiConfig() {
return new UiConfiguration(null, "list", "alpha", "schema",
UiConfiguration.Constants.DEFAULT_SUBMIT_METHODS, false, true, 60000L);
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
swagger整合xrebel
xrebel是一款web調試工具，可以參考教程XRebel使用教程。
xrebel的工作原理是追蹤頁面的各種請求分析整個請求的流程和消耗時間，而swagger則提供了頁面在線接口調試功能，將兩則結合起來，可以快速調試接口的同時分析接口的流程和缺陷,可謂是如虎添翼。
如圖：
點擊swagger的try it out時 左下角的xrebel工具欄會記錄發起的請求詳情。
當我多次調用訂單系統接口的時候，xrebel甚至可以顯示zuul將這個請求通過負載均衡分發到哪一個服務上，如圖：
實現方法
將xrebel集成到zuul-server啟動的vm options參數中，在zuul其中成功後,打開http://localhost:8081/xrebel頁面，想頁面正下方中央的文本框內的js代碼
<script>
window.XREBEL_SERVERS = [‘http://localhost:8081‘];
(function() {
const script = document.createElement(‘script‘);
script.src = window.XREBEL_SERVERS[0] + ‘/a65f4bf22bdd793dca6963ffe7fa0c62/resources/init.min.js‘;
document.body.appendChild(script);
}());
</script>
1
2
3
4
5
6
7
8
復制出來。然後找到springfox-swagger-ui依賴的jar包，如果使用maven管理，則jar包的位置在maven倉庫路徑\io\springfox\springfox-swagger-ui\版本號 的文件夾下，將jar包用解壓後找到swagger-ui.html文件，將之前的復制的js文件粘貼到裏面，然後運行zuul-server，就可以在swagger首頁http://localhost:8081/swagger-ui.html看到左下角出現這個可愛的工具欄啦。
最後附上代碼地址：https://github.com/91wangmeng/spring-boot-swagger-distributed-demo.git
---------------------
作者：vkery92
來源：CSDN
原文：https://blog.csdn.net/qq6492178/article/details/78863935
版權聲明：本文為博主原創文章，轉載請附上博文鏈接！
如何Spring Cloud Zuul作為網關的分布式系統中整合Swagger文檔在同一個頁面上