2015-06-25 22 views
12

Mam obecnie wdrożony projekt typu "łobuz", ale mam problem z dodaniem do niego podstawowej autoryzacji. Aktualne po kliknięciu przycisku "Wypróbuj!" należy zalogować się do konta, aby uzyskać dostęp do wyników. Mam konto, które chcę automatycznie używać za każdym razem, gdy ktoś próbuje uzyskać dostęp do interfejsu API. Bellow jest mój index.html dla projektu:Dodawanie podstawowego zezwolenia dla Swagger-UI

<!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="http://swagger.io">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> 

Próbuję ustalić, gdzie informacja ma się udać, aby umożliwić Podstawowe zezwolenia. Wiem, że dotyczy to następujących linii kodu, ale czy ktoś może mi wyjaśnić nieco dokładniej, gdzie wszystko pójdzie dokładnie. I doszli do wniosku, że dokumentacja dla puszyć na GitHub nie jest bardzo jasne i pomocne

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

Odpowiedz

5

Prawidłowe ustawienie Basic Authentication Header jest:

Authorization: Basic username:password 

String Nazwa użytkownika: Hasło potrzeby do zakodowania przy użyciu RFC2045-MIME jako wariant Base64. Zobacz więcej szczegółów tutaj: https://en.wikipedia.org/wiki/Basic_access_authentication#Client_side

Następnie, aby skonfigurować ten nagłówek, należy zrobić:

Biorąc pod uwagę, że kodowanie Base64 dla nazwa użytkownika: hasło jest dXNlcm5hbWU6cGFzc3dvcmQ=

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

Czytaj więcej na ten temat tutaj: https://github.com/swagger-api/swagger-ui

+0

dodaj tę linię po linii z: 'swaggerUi.load()' – Sean

0

Możesz użyć Spring Security i dodać następujący wzór

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

Zapyta o uwierzytelnianie przed wyświetleniem komunikatu Swagger.

0

można dodać/zmienić tę funkcję w swojej dist/index.html złożyć

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); 
    } 
    } 

lub można przejść na nową wersję Swagger 2.0, jest to znany problem został rozwiązany.

0

miałem podobny problem, jak je odpowiedzi są poprawne w moim przypadku kończy się dodając coś w index.html jak:

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

dodałem to na każdym oznaczonym metodą addApiKeyAuthorization lub można utworzyć inna metoda, ale nazywają go po window.swaggerUi.load();

ale jeśli masz swój bieg swagger-ui jako „stand alone” z czymś łykiem lub grunt może wymagać, aby skonfigurować usługi przyjąć wszystkie OPCJE prośbę.

Trochę się z tym zmagam, mam nadzieję, że to komuś pomaga.

Pozdrowienia