Customized Swagger template

2026-06-05 14:50:17 +00:00 · 2018-05-18 15:00:38 -03:00
parent 695ad587c1
commit 3964addb87
2 changed files with 208 additions and 0 deletions
@@ -0,0 +1,162 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>{{ title }}</title>
+  <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700|Source+Code+Pro:300,600|Titillium+Web:400,600,700" rel="stylesheet">
+  <link rel="stylesheet" type="text/css" href="{{url_for('flasgger.static', filename='swagger-ui.css')}}" >
+  <link rel="icon" type="image/png" href="{{url_for('flasgger.static', filename='favicon-32x32.png')}}" sizes="32x32" />
+  <link rel="icon" type="image/png" href="{{url_for('flasgger.static', filename='favicon-16x16.png')}}" sizes="16x16" />
+  <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>
+    <a href="http://github.com/kennethreitz/httpbin"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_darkblue_121621.png" alt="Fork me on GitHub"></a>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="position:absolute;width:0;height:0">
+  <defs>
+    <symbol viewBox="0 0 20 20" id="unlocked">
+          <path d="M15.8 8H14V5.6C14 2.703 12.665 1 10 1 7.334 1 6 2.703 6 5.6V6h2v-.801C8 3.754 8.797 3 10 3c1.203 0 2 .754 2 2.199V8H4c-.553 0-1 .646-1 1.199V17c0 .549.428 1.139.951 1.307l1.197.387C5.672 18.861 6.55 19 7.1 19h5.8c.549 0 1.428-.139 1.951-.307l1.196-.387c.524-.167.953-.757.953-1.306V9.199C17 8.646 16.352 8 15.8 8z"></path>
+    </symbol>
+
+    <symbol viewBox="0 0 20 20" id="locked">
+      <path d="M15.8 8H14V5.6C14 2.703 12.665 1 10 1 7.334 1 6 2.703 6 5.6V8H4c-.553 0-1 .646-1 1.199V17c0 .549.428 1.139.951 1.307l1.197.387C5.672 18.861 6.55 19 7.1 19h5.8c.549 0 1.428-.139 1.951-.307l1.196-.387c.524-.167.953-.757.953-1.306V9.199C17 8.646 16.352 8 15.8 8zM12 8H8V5.199C8 3.754 8.797 3 10 3c1.203 0 2 .754 2 2.199V8z"/>
+    </symbol>
+
+    <symbol viewBox="0 0 20 20" id="close">
+      <path d="M14.348 14.849c-.469.469-1.229.469-1.697 0L10 11.819l-2.651 3.029c-.469.469-1.229.469-1.697 0-.469-.469-.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-.469-.469-.469-1.228 0-1.697.469-.469 1.228-.469 1.697 0L10 8.183l2.651-3.031c.469-.469 1.228-.469 1.697 0 .469.469.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c.469.469.469 1.229 0 1.698z"/>
+    </symbol>
+
+    <symbol viewBox="0 0 20 20" id="large-arrow">
+      <path d="M13.25 10L6.109 2.58c-.268-.27-.268-.707 0-.979.268-.27.701-.27.969 0l7.83 7.908c.268.271.268.709 0 .979l-7.83 7.908c-.268.271-.701.27-.969 0-.268-.269-.268-.707 0-.979L13.25 10z"/>
+    </symbol>
+
+    <symbol viewBox="0 0 20 20" id="large-arrow-down">
+      <path d="M17.418 6.109c.272-.268.709-.268.979 0s.271.701 0 .969l-7.908 7.83c-.27.268-.707.268-.979 0l-7.908-7.83c-.27-.268-.27-.701 0-.969.271-.268.709-.268.979 0L10 13.25l7.418-7.141z"/>
+    </symbol>
+
+
+    <symbol viewBox="0 0 24 24" id="jump-to">
+      <path d="M19 7v4H5.83l3.58-3.59L8 6l-6 6 6 6 1.41-1.41L5.83 13H21V7z"/>
+    </symbol>
+
+    <symbol viewBox="0 0 24 24" id="expand">
+      <path d="M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z"/>
+    </symbol>
+
+  </defs>
+</svg>
+
+<div id="swagger-ui"></div>
+
+
+<div class='swagger-ui'>
+<div class="wrapper">
+    <section class="clear">
+        <span style="float: right;">
+            [Powered by <a target="_blank" href="https://github.com/rochacbruno/flasgger">Flasgger</a>]
+            <br>
+        </span>
+    </section>
+</div>
+</div>
+
+
+
+<script src="{{url_for('flasgger.static', filename='swagger-ui-bundle.js')}}"> </script>
+<script src="{{url_for('flasgger.static', filename='swagger-ui-standalone-preset.js')}}"> </script>
+<script src='{{url_for('flasgger.static', filename='')}}lib/jquery.min.js' type='text/javascript'></script>
+<script>
+
+window.onload = function() {
+    {% if config.JWT_AUTH_URL_RULE -%}
+    // JWT token holder
+    var jwt_token;
+    {%- endif %}
+
+    fetch("{{ specs[0]['url'] }}")
+    .then(function(response) {
+        response.json()
+        .then(function(json) {
+        var current_protocol = window.location.protocol.slice(0, -1);
+        if (json.schemes[0] != current_protocol){
+            // Switches scheme to the current in use
+            var other_protocol = json.schemes[0];
+            json.schemes[0] = current_protocol;
+            json.schemes[1] = other_protocol;
+
+        }
+        json.host = window.location.host;  // sets the current host
+    
+        const ui = SwaggerUIBundle({
+            spec: json,
+            validatorUrl: null,
+            dom_id: '#swagger-ui',
+            deepLinking: true,
+            jsonEditor: true,
+            docExpansion: "none",
+            apisSorter: "alpha",
+            //operationsSorter: "alpha",
+            presets: [
+                SwaggerUIBundle.presets.apis,
+                // yay ES6 modules ↘
+                Array.isArray(SwaggerUIStandalonePreset) ? SwaggerUIStandalonePreset : SwaggerUIStandalonePreset.default
+            ],
+            plugins: [
+                SwaggerUIBundle.plugins.DownloadUrl
+            ],
+            {% if config.JWT_AUTH_URL_RULE -%}
+            requestInterceptor: function(request) {
+            if (jwt_token) {
+                request.headers.Authorization = "Bearer " + jwt_token;
+            }
+
+            return request;
+            },
+            responseInterceptor: function(response) {
+            var tokenField = 'jwt-token';
+            var headers = response.headers;
+
+            if (headers.hasOwnProperty(tokenField)) {
+                jwt_token = headers[tokenField];
+            }
+
+            return response;
+            },
+            {%- endif %}
+            // layout: "StandaloneLayout"  // uncomment to enable the green top header
+        })
+    
+        window.ui = ui
+
+        // uncomment to rename the top brand if layout is enabled
+        // $(".topbar-wrapper .link span").replaceWith("<span>httpbin</span>");
+        })
+    })
+}
+</script>
+
+{% if tracking_enabled %}
+    {% include 'trackingscripts.html' %}
+{% endif %}
+
+{% include 'footer.html' %}
+</body> 
+</html>
@@ -0,0 +1,46 @@
+<div class='swagger-ui'>
+<div class="wrapper">
+<section class="block col-12 block-desktop col-12-desktop">
+<div>
+       
+<h2>Utilities</h2>
+
+<ul>
+    <li><a href="{{url_for('view_forms_post')}}">HTML form</a> that posts to /post /forms/post</li>
+    <li><a href='//now.httpbin.org'>now.httpbin.org</a> The current time, in a variety of formats."</li>
+</ul>
+
+    
+<p>Freely hosted in <a href="http://httpbin.org">HTTP</a>, <a href="https://httpbin.org">HTTPS</a>, &amp; <a href="http://eu.httpbin.org/">EU</a> flavors by <a href="http://kennethreitz.org/bitcoin">Kenneth Reitz</a> &amp; <a href="https://www.heroku.com/python">Heroku</a>.</p>
+
+<h2 id="Installing-and-running-from-PyPI">Installing and running from PyPI</h2>
+
+<p>You can install httpbin as a library from PyPI and run it as a WSGI app.  For example, using Gunicorn:</p>
+
+<pre><code class="bash">$ pip install httpbin
+$ gunicorn httpbin:app
+</code></pre>
+
+<h2>Running with docker</h2>
+<code>$ docker run -p 80:80 kennethreitz/httpbin</code>
+
+
+<h2 id="AUTHOR">AUTHOR</h2>
+
+<p>A <a href="http://kennethreitz.com/">Kenneth Reitz</a> project.</p>
+<p>BTC: <a href="https://www.kennethreitz.org/bitcoin"><code>1Me2iXTJ91FYZhrGvaGaRDCBtnZ4KdxCug</code></a></p>
+
+<h2 id="SEE-ALSO">SEE ALSO</h2>
+
+<p><a href="https://www.hurl.it">Hurl.it</a> - Make HTTP requests.</p>
+<p><a href="http://requestb.in">RequestBin</a> - Inspect HTTP requests.</p>
+<p><a href="http://python-requests.org" data-bare-link="true">http://python-requests.org</a></p>
+
+
+<h2>Legacy httpbin website</h2>
+To access the old layout <a href='{{url_for("view_landing_page")}}'>click here</a>
+<br /><br />
+</div>
+</section>
+</div>
+</div>