it-swarm.com.de

Wie kann ich einen Berechtigungsheader mit einer Anforderung in der Swagger-Benutzeroberfläche senden?

Ich habe eine ASP.NET Web Api 2-Anwendung. Ich habe Swashbuckle hinzugefügt (Swagger for .NET). Es stellt für meine Endpunkte kein Problem dar, aber um eine Anfrage zu senden, muss ich einen Autorisierungsheader an diese Anfrage anhängen. Wenn ich dies richtig verstehe, muss ich die Datei index.html ändern ( https://github.com/swagger-api/swagger-ui#how-to-use-it ), damit ich git geklontes Swashbuckle-Projekt, um index.html zu ändern und einige Header hinzuzufügen.

Ist dies die einzige Möglichkeit, einen Berechtigungsheader mit der Anforderung in Swashbuckle zu senden?

17
Marta

Um den Autorisierungsheader mit einer Anfrage über die Swagger-Benutzeroberfläche zu senden, musste ich Folgendes tun:

  1. Der Name meiner Assembly lautet: My.Assembly und enthält einen Ordner: Swagger, In dem ich meine benutzerdefinierte index.html abgelegt habe, habe ich diese Zeile in SwaggerConfig.cs hinzugefügt:

     c.CustomAsset("index", thisAssembly, "My.Assembly.Swagger.index.html");
    

Beachten Sie, dass index.html Javascript- und CSS-Dateien lädt. Ich musste alle Punkte in den Dateipfaden in "gestrichelt" ändern, damit diese Dateien geladen werden können. Ich weiß nicht, warum es getan werden musste, aber das Problem beim Laden der Datei wurde gelöst ...

  1. In der Datei index.html habe ich das geändert

    addApiKeyAuthorization ()

funktion, um so auszusehen:

function addApiKeyAuthorization() {
        var key = encodeURIComponent($('#input_apiKey')[0].value);
        if (key && key.trim() != "") {
            var value = "auth-scheme api_key=123456,order_id=56789";
            var authKeyHeader = new SwaggerClient.ApiKeyAuthorization("Authorization", value, "header");
            window.swaggerUi.api.clientAuthorizations.add("Authorization", authKeyHeader);
        }
    }

Hinweis Ich habe "Abfrage" in "Header" geändert.

  1. Ich habe diesen Code auch unkommentiert:

    var apiKey = "this field represents header but can be anything as long as its not empty";
    $('#input_apiKey').val(apiKey);
    

der Text wird im zweiten Textfeld angezeigt, aber es scheint egal zu sein, was er enthält, solange er nicht leer ist.

Das funktionierte für mich und ermöglichte mir das Laden der benutzerdefinierten index.html-Datei. Jetzt möchte ich dem Benutzer der Swagger-Benutzeroberfläche ermöglichen, den Wert der Header-Parameter zu ändern.

11
Marta

Ich habe den folgenden Code in eine js-Datei eingefügt und als eingebettete Ressource meinem Web-API-Projekt hinzugefügt. Wenn Sie Swagger erstellen und ausführen, wird das api_key-Textfeld durch ein Autorisierungsschlüssel-Textfeld ersetzt, in das Sie Ihren AuthKey einfügen können. Mit jeder Anforderung fügt swagger es dem Request-Header hinzu.

(function () {

    $(function () {
        var basicAuthUI =
         '<div class="input"><input placeholder="Authorization Token" id="input_token" name="token" type="text"></div>';
            $(basicAuthUI).insertBefore('#api_selector div.input:last-child');
            $("#input_apiKey").hide();
            $('#input_token').change(addAuthorization);
    });

    function addAuthorization() {
        var token = $('#input_token').val();

        if (token && token.trim() !== "" ) {
            window.swaggerUi.api.clientAuthorizations.add("api_key", new window.SwaggerClient.ApiKeyAuthorization("Authorization", "Bearer " + token, "header"));
            console.log("authorization added: Bearer = " + token);
        }
    }

})();
4
Kumar Nitesh

ich habe es so gemacht: Ich habe Swashbuckle nur zum Erzeugen der Datei swagger.json verwendet und Swagger.Net zum Anzeigen der neuesten SwaggerUI-Version (3.xx) und zum Anpassen der Datei: 

In meinen Projektreferenzen habe ich (über Nuget) hinzugefügt:

 references

 swaggerui

in index.html:

<input id="bearer-code-input" type="text" placeholder="Enter Bearer Token here" style="width: auto" value="yourtoken" />

dann im SwaggerUIBundle-Konstruktor:

const ui = SwaggerUIBundle({
...,
requestInterceptor: function (req) {
req.headers = {
'Authorization': 'Bearer ' + document.getElementById('bearer-code-
input').value
, 'Accept': 'application/json',
'Content-Type': 'application/json'
};
return req;
},
... })

ergebnisanzeige:  result

Ich habe auch viele andere Funktionen angepasst (Json-Modellbinder, Abfragezeichenfolgenanalyse, benutzerdefinierter SwaggerGenerator, um das Standardverhalten für ConflictingActionsResolver zu überschreiben, um mehrere Routenpfade verarbeiten zu können, aber es liegt nicht im Umfang dieses Threads)

0
Xavave