Flask Restplus Swagger Not Loading Behind Nginx

Question

I have a Flask API and a Swagger UI generated with Flask Restplus. The API runs in a Docker container behind an Nginx container which serves it over HTTP.

Here is a health check endpoint which confirms the API is running:https://mobydq.net/mobydq/api/v1/health

{"message":"MobyDQ API running in production mode"}

However, the Swagger which is supposed to load at the following URL does not load at all: https://mobydq.net/mobydq/api/doc

Here is the Nginx configuration:

http {
    upstream api  {
      server api:5434;
    }

    upstream app {
      server app:3000;
    }

    # Server for https
    server {
      listen       443 ssl http2;
      server_name  mobydq.net;

      ssl_certificate      /etc/letsencrypt/live/mobydq.net/fullchain.pem;
      ssl_certificate_key  /etc/letsencrypt/live/mobydq.net/privkey.pem;

      # Location for MobyDQ Flask API
      location /mobydq {
        limit_req zone=default burst=20;
        proxy_pass http://api;
        proxy_redirect   off;
        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-Forwarded-Proto $scheme;
      }

      # Location for MobyDQ Web App
      location / {
        limit_req zone=default burst=20;
        proxy_pass http://app;
        proxy_redirect   off;
        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-Forwarded-Proto $scheme;
      }
    }

    # Default server to redirect http requests to https
    server {
      listen 80 default_server;
      server_name mobydq.net;
      listen [::]:80 default_server;

        location ~ /.well-known {
            root /var/www/letsencrypt;
        }
        location / {
            return 301 https://$host$request_uri;
        }
    }
}

Any idea why the Swagger is not loading? I looked into the http requests sent when loading the page but it did not help much. I can only see the favicon loading:

I also looked at the console and saw an error but I'm not able to tell what it means:

@Ciastopiekarz it is generated automatically from the Flask code thanks to a python package called Flask Restplus https://flask-restplus.readthedocs.io — Alexis.Rolland, Dec 27 '18 at 08:49
it is not getting generated for me see my post : https://stackoverflow.com/q/53934180/3311276 — Ciasto piekarz, Dec 27 '18 at 10:04

score 1 · Accepted Answer · answered Dec 27 '18 at 08:53

The problem was that Nginx did not properly redirect the http requests when trying to get the resources from Swagger (the JSON configuration file in particular).

The issue has been fixed by changing the Nginx configuration as follow:

[...]
  # Location for MobyDQ Flask API
  location ~ ^/(mobydq|swaggerui) {
    limit_req zone=default burst=20;
    proxy_pass http://api;
    proxy_redirect   off;
    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-Forwarded-Proto $scheme;
  }
[...]

This has been a tremendous help, thank you so much – njoye Jun 30 '22 at 15:23 — njoye, Jun 30 '22 at 15:23

Flask Restplus Swagger Not Loading Behind Nginx

1 Answers1