I have a Flask (with Flask-restplus) app running locally on port 5000. When I launch the app locally and go below URL I can see the Swagger UI.
http://localhost:5000/api/#
But when I run it behind NGINX, gunicorn and go to
http://localhost:81/api/#
I get below error
Can't read from server. It may not have the appropriate access-control-origin settings.
When I look at the chrome error I see a request being made to http://localhost/api/swagger.json Colud this be the problem as the NGINX container is running on port 81?
$(function () {
window.swaggerUi = new SwaggerUi({
url: "http://localhost/api/swagger.json",
validatorUrl: "" || null,
dom_id: "swagger-ui-container",
supportedSubmitMethods: ['get', 'post', 'put', 'delete', 'patch'],
onComplete: function(swaggerApi, swaggerUi){
},
onFailure: function(data) {
log("Unable to Load SwaggerUI"); // <<<-- This is where it breaks
},
});
window.swaggerUi.load();
However I am able to make a postman request to my through http://localhost:81/api/centres/1 and I get expected data
After googling since last three days the options are:
- To send CORS headers on response. I dont prefer this as it is a security risk.
- To configure NGINX to redirect requests to correct url (http://flask.pocoo.org/snippets/35/)
This is what my server config looks like
server {
listen 81;
charset utf-8;
# Configure NGINX to reverse proxy HTTP requests to the upstream server
(Gunicorn (WSGI server))
location / {
# Define the location of the proxy server to send the request to
proxy_pass http://web:8000;
proxy_redirect http://localhost/api http://localhost:81/api;
# Redefine the header fields that NGINX sends to the upstream server
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Scheme $scheme;
}
}
It still doesnt show me the swagger UI. I'm a newbie to this world of Docker, Nginx and gunicorn. How can fix this issue?
