Web前端开发网

web.fly63.com

首页 资源 工具 文章 教程 栏目
  • 在线搜索
  • 文章标签
  • 文章投稿
  • 关于我们
资源分类
AI智能酷站推荐招聘/兼职框架/库模块/管理移动端UI框架Web-UI框架Js插件CSS相关在线工具建站资源 更多
网站收录 / 问题反馈

Swagger UI

分享
复制链接
新浪微博
QQ 好友

扫一扫分享

Swagger UI
网站地址:http://swagger.io
GitHub:https://github.com/swagger-api/swagger-ui
描述信息:一个Restful风格接口的文档在线自动生成和测试的框架
访问官网
GitHub

Swagger是个前后端协作的利器,解析代码里的注解生成JSON文件,通过Swagger UI生成网页版的接口文档,可以在上面做简单的接口调试 。


实现原理:

因为Swagger-ui读取的数据来源于/v2/api-docs,并且返回的是json数据。 

所以只要自己写一个页面去解析json数据,并展现就可以实现自定义swagger的UI界面了 


如何使用Swagger

1、引入jar包

首首先需要在你的 pom.xml 中引入swagger的包

<dependency>
    <groupId>io.springfox</groupId>
    <artifactId>springfox-swagger2</artifactId>
    <version>2.2.2</version>
</dependency>


2.启用swagger

启用swagger ,创建SwaggerConfig文件,内容如下,

@Configuration
@EnableSwagger2
public class SwaggerConfig {

    @Bean
    public Docket ProductApi() {
        return new Docket(DocumentationType.SWAGGER_2)
                .genericModelSubstitutes(DeferredResult.class)
                .useDefaultResponseMessages(false)
                .forCodeGeneration(false)
                .pathMapping("/")
                .select()
                .build()
                .apiInfo(productApiInfo());
    }

    private ApiInfo productApiInfo() {
        ApiInfo apiInfo = new ApiInfo("XXX系统数据接口文档",
                "文档描述。。。",
                "1.0.0",
                "API TERMS URL",
                "联系人邮箱",
                "license",
                "license url");
        return apiInfo;
    }
}


3.添加swagger注解

常用的swagger注解 
Api 
ApiModel 
ApiModelProperty 
ApiOperation 
ApiParam 
ApiResponse 
ApiResponses 
ResponseHeader 
具体可以参考swagger官方注解文档:http://docs.swagger.io/swagger-core/apidocs/index.html


4.添加自定义UI界面

有两种方式 
1.可以在项目的基础上新增一个servlet ,指向对应的html文件 
html文件里再去解析json,并渲染UI

2.新建一个项目,用webjars将前端资源打成jar包,再供其他项目使用 


仅供个人学习参考/导航指引使用,具体请以第三方网站说明为准,本站不提供任何专业建议。如果地址失效或描述有误,请联系站长反馈~感谢您的理解与支持!

链接: https://web.fly63.com/nav/910

更多»
热门资源
bootstrap
最流行的HTML,CSS和JavaScript框架,用于开发响应式,移动端先行的web项目
官网
GitHub
Materialize
基于Material Design的现代响应式前端框架
官网
GitHub
Element UI
一套基于 Vue 2.0 的桌面端组件库
官网
GitHub
Material Design(MDB)
领先的Bootstrap UI套件之一
点击进入
Muse-UI
基于 Vue2.0 的 Material Design UI 库
官网
GitHub
sb-admin
基于Bootstrap简约美观的后台管理模板
官网
GitHub
Magic UI
为设计工程师打造的UI库
官网
GitHub
Vue-Access-Control
Vue权限管理解决方案
官网
GitHub
RmlUI
桌面端GUI开发框架
官网
GitHub
HeroUI
基于TailwindCSS构建的React 现代UI框架
官网
GitHub
tweakcn
shadcn/ui组件可视化无代码编辑器
官网
GitHub
kitty-ui
基于 Vue + Element 实现的权限管理系统
点击进入
GitHub
类似于Swagger UI的资源
react-select
基于react多选、自动完成、ajax 支持的下拉框
官网
GitHub
SUI
简单易用、功能强大的UI库
官网
sing-app
Bootstrap 4构建的免费和开源管理仪表板模板
官网
GitHub
TOAST UI
用于构建高质量网页的开源js库,提供丰富的UI组件
官网
layui
一款采用自身模块规范编写的情怀型前端UI框架
官网
GitHub
Foundation
一个易用、强大而且灵活的框架,用于构建基于任何设备上的 Web 应用。
官网
GitHub
ice 飞冰
让前端开发简单而友好
官网
GitHub
Laravel-admin
一个可以快速帮你构建后台管理的工具
官网
GitHub
目录

手机扫一扫预览

首页 技术导航 在线工具 技术文章 教程资源 前端标签 AI工具集 前端库/框架

Copyright © 2018 Web前端开发网 All Rights Reserved. 分享编程学习资源(教程/框架/库)、在线工具、技术教程、内容以学习参考为主,助您解决各类实际问题,快速提升专业能力。