swagger-ui:添加授权标题不起作用

时间:2015-09-22 09:02:19

标签: swagger-ui

我想在swagger-ui中添加基本授权,用&#34测试我的WS;试试看"按钮。我尝试了swagger documentation和本主题Adding Basic Authorization for Swagger-UI,但没有人工作。请求中未添加任何标头,但在curl命令中,存在基本授权标头。如果我复制粘贴这个curl命令,一切正常。

我的swagger-ui版本是2.1.2。我从github下载,ant直接将dist文件夹放在我服务器的静态文件夹中。

这是我的index.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Sensor API documentation</title>
<link rel="icon" type="image/png" href="images/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="images/favicon-16x16.png" sizes="16x16" />
<link href='css/typography.css' media='screen' rel='stylesheet' type='text/css' />
<link href='css/reset.css' media='screen' rel='stylesheet' type='text/css' />
<link href='css/screen.css' media='screen' rel='stylesheet' type='text/css' />
<link href='css/reset.css' media='print' rel='stylesheet' type='text/css' />
<link href='css/print.css' media='print' rel='stylesheet' type='text/css' />
<script src='lib/jquery-1.8.0.min.js' type='text/javascript'></script>
<script src='lib/jquery.slideto.min.js' type='text/javascript'></script>
<script src='lib/jquery.wiggle.min.js' type='text/javascript'></script>
<script src='lib/jquery.ba-bbq.min.js' type='text/javascript'></script>
<script src='lib/handlebars-2.0.0.js' type='text/javascript'></script>
<script src='lib/underscore-min.js' type='text/javascript'></script>
<script src='lib/backbone-min.js' type='text/javascript'></script>
<script src='swagger-ui.js' type='text/javascript'></script>
<script src='lib/highlight.7.3.pack.js' type='text/javascript'></script>
<script src='lib/marked.js' type='text/javascript'></script>
<script src='lib/swagger-oauth.js' type='text/javascript'></script>

<!-- Some basic translations -->
<!-- <script src='lang/translator.js' type='text/javascript'></script> -->
<!-- <script src='lang/ru.js' type='text/javascript'></script> -->
<!-- <script src='lang/en.js' type='text/javascript'></script> -->

<script type="text/javascript">
    $(function() {

        // Pre load translate...
        if (window.SwaggerTranslator) {
            window.SwaggerTranslator.translate();
        }
        window.swaggerUi = new SwaggerUi({
            url : "/swagger/json/SensorAPI.json",
            validatorUrl : "",
            dom_id : "swagger-ui-container",
            supportedSubmitMethods : [ 'get', 'post', 'put', 'delete', 'patch' ],
            onComplete : function(swaggerApi, swaggerUi) {

                if (window.SwaggerTranslator) {
                    window.SwaggerTranslator.translate();
                }

                $('pre code').each(function(i, e) {
                    hljs.highlightBlock(e)
                });
                addAuthorization();

            },
            onFailure : function(data) {
                log("Unable to Load SwaggerUI");
            },
            docExpansion : "none",
            apisSorter : "alpha",
            showRequestHeaders : false
        });

        function addAuthorization() {
            var username = $('#input_username').val();
            var password = $('#input_password').val();
            if (username && username.trim() != "" && password && password.trim() != "") {
                var basicAuth = new SwaggerClient.PasswordAuthorization(username, password);
                window.swaggerUi.api.clientAuthorizations.add('Basic', basicAuth);
                log("authorization added: username = " + username + ", password = " + password);
            } else {
                window.authorizations.remove();
            }
        }
        $('#input_username').change(addAuthorization);
        $('#input_password').change(addAuthorization);
        // pre-populate on the page using demo account
        $('#input_username').val("demo");
        $('#input_password').val("demo");

        window.swaggerUi.load();

        function log() {
            if ('console' in window) {
                console.log.apply(console, arguments);
            }
        }
    });
</script>
</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'>
                    Username: <input placeholder="username" id="input_username" name="username" type="text" size="10" />
                </div>
                <div class='input'>
                    Password: <input placeholder="password" id="input_password" name="password" type="password" size="10" />
                </div>
            </form>
        </div>
    </div>

    <div id="message-bar" class="swagger-ui-wrap" data-sw-translate>&nbsp;</div>
    <div id="swagger-ui-container" class="swagger-ui-wrap"></div>
</body>
</html>

请告诉我有什么问题。感谢

1 个答案:

答案 0 :(得分:3)

我发现:问题来自我的json文件。我定义了许多“securityDefinitions”,每个用户角色一个

...,
"securityDefinitions":{
    "administrator":{
        "type":"basic",
        "description":"The administrator."
    },
    "supervisor":{
        "type":"basic",
        "description":"A supervisor."
    },
    "customer":{
        "type":"basic",
        "description":"A customer."
    }
},
...

并且对于每个WS,我指出哪些角色被授权。例如:

...,
"get":{
    "security":[
        {
            "administrator":[

            ]
        },
        {
            "supervisor":[

            ]
        }
    ],
    ...
},
...

通过删除WS中的安全部分,一切正常。

在swagger编辑器中,我们需要安全部分来测试WS,但是在swagger ui中,这部分会产生错误: - (