Solved
swaggerui Undocumented Error: OK
Dear All,
I have OpenAPI Specs 3.0 that has APIs doing the below:
Get presigned url --> response is 307 redirect to AWS S3 to get the image
Image is downloaded but not displayed and I get the below error:
swaggerui Undocumented Error: OK
When I click on the JS I found the beow but can't make sense out of it:
_context.prev = 14;_context.next = 17;return (request.userFetch || fetch)(request.url, request);case 17:res = _context.sent;_context.next = 20;return http_self.serializeRes(res, url, request);case 20:res = _context.sent;if (!request.responseInterceptor) {_context.next = 28;break;}_context.next = 24;return request.responseInterceptor(res);case 24:_context.t1 = _context.sent;if (_context.t1) {_context.next = 27;break;}_context.t1 = res;case 27:res = _context.t1;case 28:_context.next = 38;break;case 30:_context.prev = 30;_context.t2 = _context["catch"](14);if (res) {_context.next = 34;break;}throw _context.t2;case 34:error = new Error(res.statusText);error.statusCode = error.status = res.status;error.responseError = _context.t2;throw error;case 38:if (res.ok) {_context.next = 43;break;}_error = new Error(res.statusText);_error.statusCode = _error.status = res.status;_error.response = res;throw _error;case 43:return _context.abrupt("return", res);case 44:case "end":return _context.stop();}}}, _callee, null, [[14, 30]]);}));return _http.apply(this, arguments);}var shouldDownloadAsText = function shouldDownloadAsText() {var contentType = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';return /(json|xml|yaml|text)\b/.test(contentType);};function parseBody(body, contentType) {if (contentType && (contentType.indexOf('application/json') === 0 || contentType.indexOf('+json') > 0)) {return JSON.parse(body);}return external_js_yaml_default.a.safeLoad(body);} // Serialize the response, returns a promise with headers and the body part of the hash
Cheers,
adam
I have downloaded Redux DevTools for Developers and I did manage to find the issue with the code. After fixing the code, the problem got resolved and I was able to load the image into the swaggerui.
Error spotted using Redux DevTools:
oldCode:
<script> window.onload = function() { var appKey = ''; var idToken = ''; var accessToken = ''; var replaceAppKey = false; const ui = SwaggerUIBundle({ url: Drupal.settings.nsw_theme.swagger_url, dom_id: '#tryit', displayRequestDuration: true, withCredentials: true, filter: true, showExtensions: true, showCommonExtensions: true, validatorUrl: "https://validator.swagger.io/validator", presets: [ SwaggerUIBundle.presets.apis, SwaggerUIStandalonePreset ], parameterMacro: function (operation, parameter) { if((parameter.name == "X-API-Key" || parameter.name == "apikey" || parameter.name == "x-apikey") && replaceAppKey) { parameter.example = appKey; }else if(parameter.name == "X-Id-Token") { parameter.example = idToken; }else if(parameter.name == "X-Access-Token") { parameter.example = accessToken; } }, onComplete: function(swaggerApi, swaggerUi) { // "ApiKeyAuth" is the key name of the security scheme in securityDefinitions var result = getApiKey(); if(result.httpStatusCode == 200 && result.appKey != ""){ appKey = result.appKey; appName = result.appName; Swal.fire({ title: 'Replace App key?', text: 'We found that one of your Apps (' + appName + ') have access to this API Product. We can replace all App keys in the OpenAPI Specs with your App Key.', icon: 'question', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'Yes, replace it!' }).then((result) => { if (result.value) { ui.preauthorizeApiKey("ApiKeyAuth", appKey); replaceAppKey = true; Swal.fire( 'Replaced!', 'All App keys have been replaced in the current OpenAPI specs.', 'success' ) } }); }else{ if(result.httpStatusCode != 200){ Swal.fire({ icon: 'error', title: 'Oops...' + result.httpStatusCode, html: result.message, footer: '<a href="/help">Why do I have this issue?</a>' }); } } }, requestInterceptor: function (request) { var headers = request.headers || {}; if (headers["X-Id-Token"]) { headers["X-Id-Token"] = idToken; }else if(headers["client_id"]) { headers["client_id"] = accessToken; } return request; }, responseInterceptor: function (response) { var headers = response.headers || {}; if (response.obj.IdToken) { idToken = response.obj.IdToken; }else if(response.obj.id_token) { idToken = response.obj.id_token; } if (response.obj.AccessToken) { accessToken = response.obj.AccessToken; }else if(response.obj.access_token) { accessToken = response.obj.access_token; } return response; } }) window.ui = ui } function getApiKey() { "use strict"; var domainName = window.location.hostname; var apiPath = "/app/developer_apps/app.json"; var apiURI = "https://test:test@" + domainName + apiPath; var apiMethod = "GET"; var httpStatusCode = ""; var message = ""; var appName = ""; var appKey = ""; var appSecret = ""; jQuery.ajax({ async: false, type: apiMethod, url: apiURI, dataType: "json", statusCode: { 200: function(responseData) { httpStatusCode = "200"; message = "Retrieved LoggedIn user summary list of Apps successfully"; }, 204: function(responseData) { httpStatusCode = "204"; message = `Retrieved LoggedIn user summary list of Apps is empty Please create an App to be able to experience what this API product can offer`; }, 401: function(responseData) { httpStatusCode = "401"; message = `Unable to retrieved LoggedIn user summary list of Apps. If you want, you can <a href="https://developer-dev.testservicensw.net/user/login">login</a> so that you can experience what this API product can offer to your App; otherwise just click Ok`; }, 403: function(responseData) { httpStatusCode = "403"; message = "Received unauthorized while trying to retrieved LoggedIn user summary list of Apps"; }, 404: function(responseData) { httpStatusCode = "404"; message = "Received resource not found while trying to retrieved LoggedIn user summary list of Apps"; } }, error: function(responseData){ httpStatusCode = responseData.status; message = "Received unknown error"; }, }).done(function(responseData){ if(httpStatusCode == 200) { jQuery.each(responseData, function(index, value) { var dotIndex = Drupal.settings.nsw_theme.swagger_file_name.indexOf("."); var apiProductName = Drupal.settings.nsw_theme.swagger_file_name.substring(0, dotIndex); if(apiProductName.toLowerCase() === value.apiProducts[0].toLowerCase()){ appName = value.appName; appKey = value.consumerKey; appSecret = value.consumerSecret; }else{ message = "Couldn't find a product match in your list of apps"; } }); } }); return { "httpStatusCode": httpStatusCode, "message": message, "appName": appName, "appKey": appKey, "appSecret": appSecret }; } </script> <!-- * * End of Swagger UI Configuration * ------------------------------- * -->NEWCode:
The section that was changed was the responseInterceptor section<script> window.onload = function() { var appKey = ''; var idToken = ''; var accessToken = ''; var replaceAppKey = false; const ui = SwaggerUIBundle({ url: Drupal.settings.nsw_theme.swagger_url, dom_id: '#tryit', displayRequestDuration: true, withCredentials: true, filter: true, showExtensions: true, showCommonExtensions: true, validatorUrl: "https://validator.swagger.io/validator", presets: [ SwaggerUIBundle.presets.apis, SwaggerUIStandalonePreset ], parameterMacro: function (operation, parameter) { if((parameter.name == "X-API-Key" || parameter.name == "apikey" || parameter.name == "x-apikey") && replaceAppKey) { parameter.example = appKey; }else if(parameter.name == "X-Id-Token") { parameter.example = idToken; }else if(parameter.name == "X-Access-Token") { parameter.example = accessToken; } }, onComplete: function(swaggerApi, swaggerUi) { // "ApiKeyAuth" is the key name of the security scheme in securityDefinitions var result = getApiKey(); if(result.httpStatusCode == 200 && result.appKey != ""){ appKey = result.appKey; appName = result.appName; Swal.fire({ title: 'Replace App key?', text: 'We found that one of your Apps (' + appName + ') have access to this API Product. We can replace all App keys in the OpenAPI Specs with your App Key.', icon: 'question', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'Yes, replace it!' }).then((result) => { if (result.value) { ui.preauthorizeApiKey("ApiKeyAuth", appKey); replaceAppKey = true; Swal.fire( 'Replaced!', 'All App keys have been replaced in the current OpenAPI specs.', 'success' ) } }); }else{ if(result.httpStatusCode != 200){ Swal.fire({ icon: 'error', title: 'Oops...' + result.httpStatusCode, html: result.message, footer: '<a href="/help">Why do I have this issue?</a>' }); } } }, requestInterceptor: function (request) { var headers = request.headers || {}; if (headers["X-Id-Token"]) { headers["X-Id-Token"] = idToken; }else if(headers["client_id"]) { headers["client_id"] = accessToken; } if (headers["Use-Proxy"]) { if (headers["Use-Proxy"] != "") { request.url = headers["Use-Proxy"] + "?url=" + request.url; headers["Use-Proxy"] = ""; } } return request; }, responseInterceptor: function (response) { var headers = response.headers || {}; if (response.obj) { if ("IdToken" in response.obj) { idToken = response.obj.IdToken; }else if(response.obj.id_token) { idToken = response.obj.id_token; } if (response.obj.AccessToken) { accessToken = response.obj.AccessToken; }else if(response.obj.access_token) { accessToken = response.obj.access_token; } } return response; } }) window.ui = ui } function getApiKey() { "use strict"; var domainName = window.location.hostname; var apiPath = "/app/developer_apps/app.json"; var apiURI = "https://test:test@" + domainName + apiPath; var apiMethod = "GET"; var httpStatusCode = ""; var message = ""; var appName = ""; var appKey = ""; var appSecret = ""; jQuery.ajax({ async: false, type: apiMethod, url: apiURI, dataType: "json", statusCode: { 200: function(responseData) { httpStatusCode = "200"; message = "Retrieved LoggedIn user summary list of Apps successfully"; }, 204: function(responseData) { httpStatusCode = "204"; message = `Retrieved LoggedIn user summary list of Apps is empty Please create an App to be able to experience what this API product can offer`; }, 401: function(responseData) { httpStatusCode = "401"; message = `Unable to retrieved LoggedIn user summary list of Apps. If you want, you can <a href="https://developer-dev.testservicensw.net/user/login">login</a> so that you can experience what this API product can offer to your App; otherwise just click Ok`; }, 403: function(responseData) { httpStatusCode = "403"; message = "Received unauthorized while trying to retrieved LoggedIn user summary list of Apps"; }, 404: function(responseData) { httpStatusCode = "404"; message = "Received resource not found while trying to retrieved LoggedIn user summary list of Apps"; } }, error: function(responseData){ httpStatusCode = responseData.status; message = "Received unknown error"; }, }).done(function(responseData){ if(httpStatusCode == 200) { jQuery.each(responseData, function(index, value) { var dotIndex = Drupal.settings.nsw_theme.swagger_file_name.indexOf("."); var apiProductName = Drupal.settings.nsw_theme.swagger_file_name.substring(0, dotIndex); if(apiProductName.toLowerCase() === value.apiProducts[0].toLowerCase()){ appName = value.appName; appKey = value.consumerKey; appSecret = value.consumerSecret; }else{ message = "Couldn't find a product match in your list of apps"; } }); } }); return { "httpStatusCode": httpStatusCode, "message": message, "appName": appName, "appKey": appKey, "appSecret": appSecret }; } </script> <!-- * * End of Swagger UI Configuration * ------------------------------- * --> </div>Result after fixing the code:
