zoukankan      html  css  js  c++  java
  • swaggerui自定义页面,兼容不同项目的接口文档地址

    <!-- HTML for static distribution bundle build -->
    <!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <title>Swagger UI</title>
      <link rel="stylesheet" type="text/css" href="./swagger-ui.css">
      <link rel="icon" type="image/png" href="./favicon-32x32.png" sizes="32x32" />
      <link rel="icon" type="image/png" href="./favicon-16x16.png" sizes="16x16" />
      <script src="jquery-2.1.1.min.js"></script>
    
      <style>
        html {
          box-sizing: border-box;
          overflow: -moz-scrollbars-vertical;
          overflow-y: scroll;
        }
    
        *,
        *:before,
        *:after {
          box-sizing: inherit;
        }
    
        body {
          margin: 0;
          background: #fafafa;
        }
        
      </style>
    </head>
    
    <body onload="loadData()">
    
    
      <div id="select-json-src"
        style=" 100%; max- 87.5rem; margin: 0 auto; padding: 0 1.25rem; line-height: 3.75rem;">
        <label><b>请选择项目</b>:
          <select id="selector" onChange="loadData($('#selector option').filter(':selected').val())" style="150px;height:45px;font-size:20px;">
            <option value="http://127.0.0.1/basic/data/v2/api-docs">basic</option>
            <option value="http://127.0.0.1/dms/swagger.json">dms</option>
            <option value="http://127.0.0.1/ddm/swagger.json">ddm</option>
            <option value="http://127.0.0.1/worklist/v2/api-docs">worklist</option>
            
          </select>
        </label>
      </div>
    
    
    
      <div id="swagger-ui"></div>
      <script src="./swagger-ui-bundle.js"> </script>
      <script src="./swagger-ui-standalone-preset.js"> </script>
      <script>
        function loadData(url) {
          if (url == null) {
              url = "http://127.0.0.1/basic/data/v2/api-docs";
           }
    
          const ui = SwaggerUIBundle({
            url: url,
            dom_id: '#swagger-ui',
            deepLinking: true,
            presets: [
              SwaggerUIBundle.presets.apis,
              SwaggerUIStandalonePreset
            ],
            plugins: [
              SwaggerUIBundle.plugins.DownloadUrl
            ],
            layout: "StandaloneLayout"
          })
          // End Swagger UI call region
    
          window.ui = ui
        }
      </script>
    </body>
    
    </html>
  • 相关阅读:
    移动端的爬坑路
    判断设备ios或android以及判断是否是微信内置浏览器
    使用vue directive 写好的滑动删除功能
    不用ajax,使用json数据渲染商品的方法
    vue中使用swiper的一些坑
    vue的自定义指令的坑
    better-score获取滑动距离的坑
    linux命令
    关于打印
    数据可视化
  • 原文地址:https://www.cnblogs.com/shihaiming/p/13085148.html
Copyright © 2011-2022 走看看