2015-06-25 13 views
12

Tôi hiện đã triển khai một dự án vênh vang nhưng tôi gặp sự cố khi thêm một số ủy quyền cơ bản cho nó. Hiện tại khi bạn nhấp vào "Dùng thử!" , bạn được yêu cầu đăng nhập vào một tài khoản để truy cập kết quả. Tôi có một tài khoản mà tôi muốn tự động được sử dụng mỗi khi ai đó cố gắng truy cập vào api. Dưới đây là index.html của tôi cho dự án:Thêm quyền cấp phép cơ bản cho 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> 

Tôi đang cố gắng xác định nơi thông tin được cho là để cho phép cấp phép cơ bản. Tôi biết nó liên quan đến các dòng mã sau đây, nhưng ai đó có thể vui lòng giải thích cho tôi chi tiết hơn một chút khi mọi thứ diễn ra chính xác. Tôi đã đi đến nhận thức rằng các tài liệu cho vênh vang trên GitHub không phải là rất rõ ràng hoặc hữu ích

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

Trả lời

5

Các thiết lập chính xác để xác thực Tiêu đề cơ bản là:

Authorization: Basic username:password 

Các Chuỗi username: password nhu cầu được mã hóa bằng cách sử dụng RFC2045-MIME một biến thể của Base64. Xem thêm chi tiết tại đây: https://en.wikipedia.org/wiki/Basic_access_authentication#Client_side

Sau đó, để cấu hình tiêu đề này, bạn nên làm:

Xét rằng mã hóa Base64 cho username: passworddXNlcm5hbWU6cGFzc3dvcmQ=

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

Đọc thêm về vấn đề này tại đây: https://github.com/swagger-api/swagger-ui

+0

hãy chắc chắn để thêm dòng này sau khi phù hợp với: 'swaggerUi.load()' – Sean

0

Bạn có thể sử dụng Bảo mật mùa xuân và thêm mẫu sau

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

Nó sẽ yêu cầu xác thực trước khi hiển thị Swagger.

0

bạn có thể thêm/thay đổi chức năng này trong quận của bạn/index.html nộp

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

HOẶC bạn có thể chuyển sang phiên bản mới của Swagger 2.0, vấn đề được biết đến này đã được cố định.

0

Tôi đã có một vấn đề tương tự, câu trả lời gợi ý là chính xác trong trường hợp của tôi, tôi kết thúc thêm một cái gì đó trong index.html như:

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

tôi thêm này trên một trong hai phương pháp đánh dấu addApiKeyAuthorization hoặc bạn có thể tạo phương pháp khác nhưng gọi nó là sau khi window.swaggerUi.load();

nhưng nếu bạn có vênh vang-ui của bạn chạy như "đứng một mình" với một cái gì đó giống như ngụm hoặc grunt bạn có thể yêu cầu để cấu hình các dịch vụ để chấp nhận tất cả OPTIONS yêu cầu.

Tôi đấu tranh một chút với điều đó, tôi hy vọng nó sẽ giúp ai đó.

Trân

Các vấn đề liên quan