Добавление базовой авторизации для Swagger-UI

В настоящее время я развернул проект swagger, но у меня возникли проблемы с добавлением к нему некоторых базовых полномочий. Теперь, когда вы нажимаете "Попробуйте!" вам необходимо войти в учетную запись, чтобы получить доступ к результатам. У меня есть учетная запись, которую я хочу автоматически использовать каждый раз, когда кто-то пытается получить доступ к api. Bellow - мой index.html для проекта:

    <!DOCTYPE html>
<html>
<head>
  <title>Swagger UI</title>
  <link href='css/screen.css' media='screen' rel='stylesheet' type='text/css'/>
  <link href='css/screen.css' media='print' rel='stylesheet' type='text/css'/>
  <script src='lib/jquery-1.8.3.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-1.0.rc.1.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='lib/swagger.js' type='text/javascript'></script>
  <script src='lib/swagger-ui.js' type='text/javascript'></script>
  <script src='lib/highlight.7.3.pack.js' type='text/javascript'></script>

  <script type="text/javascript">
    $(function () {
        window.swaggerUi = new SwaggerUi({
                discoveryUrl:"https://localhost:8080/AssistAPI/api-docs.json",
                apiKey:"",
                dom_id:"swagger-ui-container",
                supportHeaderParams: true,
                supportedSubmitMethods: ['get', 'post', 'put'],
                onComplete: function(swaggerApi, swaggerUi){
                    if(console) {
                        console.log("Loaded SwaggerUI")
                        console.log(swaggerApi);
                        console.log(swaggerUi);
                    }
                  $('pre code').each(function(i, e) {hljs.highlightBlock(e)});
                },
                onFailure: function(data) {
                    if(console) {
                        console.log("Unable to Load SwaggerUI");
                        console.log(data);
                    }
                },
                docExpansion: "none"
            });
            window.authorizations.add("key", new ApiKeyAuthorization("Authorization", "XXXX"header"));
            //window.authorizations.add("key", new ApiKeyAuthorization("username", "rmanda", "header"));
            window.swaggerUi.load();
        });
  </script>
</head>

<body class="swagger-section">
<div id='header'>
  <div class="swagger-ui-wrap">
    <a id="logo" href="#" onclick="location.href='http://swagger.io'; return false;">swagger</a>
    <form id='api_selector'>
      <div class='input'><input placeholder="http://example.com/api" id="input_baseUrl" name="baseUrl" type="text"/></div>
      <div class='input'><input placeholder="api_key" id="input_apiKey" name="apiKey" type="text"/></div>
      <div class='input'><a id="explore" href="#">Explore</a></div>
    </form>
  </div>
</div>

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

Я пытаюсь определить, куда должна идти информация, чтобы разрешить базовую авторизацию. Я знаю, что это связано с следующими строками кода, но кто-то может объяснить мне более подробно, где все идет точно. Я пришел к пониманию того, что документация для чванства GitHub не очень ясна или полезна

window.authorizations.add("key", new ApiKeyAuthorization("Authorization", "XXXX"header"));
window.authorizations.add("key", new ApiKeyAuthorization("username", "password", "header"));

Ответ 1

Правильная настройка для основного заголовка проверки подлинности:

Authorization: Basic username:password

Имя пользователя String: пароль должен быть закодирован с использованием RFC2045-MIME варианта Base64. Подробнее здесь: https://en.wikipedia.org/wiki/Basic_access_authentication#Client_side

Затем, чтобы настроить этот заголовок, вы должны сделать:

Учитывая, что кодировка Base64 для имени пользователя: пароль dXNlcm5hbWU6cGFzc3dvcmQ=

swaggerUi.api.clientAuthorizations.add("key", new SwaggerClient.ApiKeyAuthorization("Authorization", "Basic dXNlcm5hbWU6cGFzc3dvcmQ=", "header"));

Подробнее об этом читайте здесь: https://github.com/swagger-api/swagger-ui

Ответ 2

Вы можете использовать Spring Безопасность и добавить следующий шаблон

<"sec:intercept-url pattern="/**"  access="hasAnyRole('ROLE_ADMIN','ROLE_USER')" /" >

Он попросит аутентификацию перед отображением Swagger.

Ответ 3

вы можете добавить/изменить эту функцию в файле dist/index.html

function addApiKeyAuthorization(){
    var key = encodeURIComponent($('#input_apiKey')[0].value);
    if(key && key.trim() != "") {
        key = 'Basic '+key;
        var apiKeyAuth = new SwaggerClient.ApiKeyAuthorization("Authorization", key, "header");
        window.swaggerUi.api.clientAuthorizations.add("Authorization", apiKeyAuth);
        log("added key " + key);
    }
  }

ИЛИ вы можете перейти к новой версии Swagger 2.0, это известная проблема была исправлена.

Ответ 4

У меня была аналогичная проблема, предлагаемые ответы верны в моем случае. Я в конечном итоге добавляю что-то в index.html, например:

var myAuth = "Basic " + btoa("user:password");
window.authorizations.add("key", neSwaggerClient.ApiKeyAuthorization("Authorization", myAuth, "header"));

Я добавил это либо по отмеченному методу addApiKeyAuthorization, либо вы можете создать другой метод, но вызвать его после window.swaggerUi.load();

Но если у вас есть ваш swagger-ui, работающий как "отдельный" с чем-то вроде gulp или хрюканьем, вам может потребоваться настроить службы для принятия всех OPTIONS.

Я немного борюсь с этим, надеюсь, это кому-то поможет.

Привет