javascript - tutorial - Cómo hacer que Swagger envíe la clave API como http en lugar de en la URL

google maps api tutorial

Question

Estoy usando swagger con servicestack pero recibo un error no autorizado 401 de mi URL / resources porque requiere una clave API.

A menos que me equivoque, de acuerdo con la documentación , debería establecer supportHeaderParams en true, así como el apiKeyName y el valor de apiKey en los parámetros JSON al inicializar Swagger desde mi página html.

Esperaba ver mi clave de API en los encabezados de solicitud http, pero aún se está agregando a la URL y no en la colección de encabezados.

Aquí está el código que inicializa Swagger en mi página HTML:

 window.swaggerUi = new SwaggerUi({
discoveryUrl: "http://pathtomyservice.com/resources",
headers: { "testheader" : "123" },
apiKey: "123",
apiKeyName: "Api-Key",
dom_id:"swagger-ui-container",
supportHeaderParams: true,
supportedSubmitMethods: [''get'', ''post'', ''put'', ''delete''],
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"
});

Desafortunadamente no obtengo encabezados, ni ''Api-Key'' o ''testheader''.

Answer 1

Creo que podría ser un error en la interfaz de usuario swagger.

Como solución alternativa, agregué lo siguiente en el archivo swagger index.html.

$(function () {
$.ajaxSetup({
beforeSend: function (jqXHR, settings) {
jqXHR.setRequestHeader("YourApiKeyHeader", $("#input_apiKey").val());
}
});
});

Espero que esto ayude,

Answer 2

En swagger-ui 2.0 o superior, esto es trivial:

https://github.com/wordnik/swagger-ui#header-parameters

// add a new ApiKeyAuthorization when the api-key changes in the ui.
$(''#input_apiKey'').change(function() {
var key = $(''#input_apiKey'')[0].value;
if(key && key.trim() != "") {
window.authorizations.add("key", new ApiKeyAuthorization("api_key", key, "header"));
}
})

Esto también es mucho más extensible y admite mecanismos de autenticación personalizados.

Answer 3

puedes probar esto

(function () {
$(function () {
var basicAuthUI =
''<div class="input"><input placeholder="username" id="input_username" name="username" type="text" size="10"/></div>'' +
''<div class="input"><input placeholder="password" id="input_password" name="password" type="password" size="10"/></div>'';
$(basicAuthUI).insertBefore(''#api_selector div.input:last-child'');
$("#input_apiKey").hide();
$(''#input_username'').change(addAuthorization);
$(''#input_password'').change(addAuthorization);
});
function addAuthorization() {
SwaggerApi.supportHeaderParams = true;
SwaggerApi.headers = {"authentication": "test"};
var username = $(''#input_username'').val();
var password = $(''#input_password'').val();
if (username && username.trim() != "" && password && password.trim() != "") {
var basicAuth = new SwaggerClient.PasswordAuthorization(''basic'', username, password);
window.swaggerUi.api.clientAuthorizations.add("basicAuth", basicAuth);
console.log("authorization added: username = " + username + ", password = " + password);
}
}
})();