How to run ui and api on same port once?

[loongmxbt]

Great framework, really user friendly! Have some suggestions during usage.
Now ui and api need to run with different ports,

opyrator launch-ui conversion:convert
opyrator launch-api conversion:convert

Is there a way to run them together

opyrator launch conversion:convert

So that I can access GET / for ui, GET /docs for docs, POST /call for apis.

[raethlein]

Hey @loongmxbt, thanks for your question! At the moment, this is not a built-in functionality of opyrator, so currently a proxy has to be used to achieve this. We have written down an example how this would look like as soon as we provide a Docker container in this Section of the Docs; however, it is not implemented yet. Nevertheless, you can use the following exemplary nginx proxy configuration to achieve the goal manually for now:

Show the nginx.conf

worker_processes  auto;

events {}

http {
    resolver 127.0.0.11 ipv6=off;

    upstream ui {
        server host.docker.internal:8051;
    }

   upstream api {
       server host.docker.internal:8080;
   }


    client_max_body_size 10G;
    client_body_timeout 300s;
    client_header_timeout 120s;

    proxy_connect_timeout 600;
    proxy_send_timeout 600;
    proxy_read_timeout 600;
    send_timeout 600;

    map $http_upgrade $connection_upgrade {
        default upgrade;
        ''      close;
    }

    server {
        listen 80;

        # only do relative redirects
        absolute_redirect off;

        access_log  /var/log/nginx/http_access.log  combined;
        error_log   /var/log/nginx/http_error.log;

        location ~* "^/(?<endpoint>[a-zA-Z_]+)(?<remaining_part>.*)$" {
            proxy_redirect off;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-Host $host;
            proxy_set_header X-Forwarded-Server $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_pass_request_headers on;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;
            proxy_store off;

            gzip on;
            gzip_proxied any;
            gzip_types *;

            if ($remaining_part !~ ^/(.*)$) {
                # add slash to remaining part if it wasn't already added
                # required since base path always starts with slash
                set $remaining_part /$remaining_part;
            }


           proxy_pass http://$endpoint$remaining_part$is_args$args;
        }
    }
 }

So, you would start the UI and the API the way to have indicated:

opyrator launch-ui conversion:convert
opyrator launch-api conversion:convert

and then the nginx proxy for example via Docker:

docker run -d --name nginx -p 8090:80 -v $(pwd)/nginx.conf:/etc/nginx/nginx.conf nginx

whereas $(pwd) points to the current directory, so you have to either modify the command or execute it from the directory in which the nginx.conf is located. If you don't have Docker, you could install nginx directly on your machine (however, I have just tested it with Docker on Mac).
The example nginx.conf expects the UI to run on port 8051 and the OpenAPI docs on 8080; if they are started on different ports, you can modify the ports in the nginx conf in the upstream sections accordingly.

You can then access the UI and API via http://localhost:8090/ui/ and http://localhost:8090/api/docs, respectively.
That example still requires 3 ports to be blocked on the machine, but you could put the conversion:convert app together with the nginx conf in its own Docker container so that only one port would be used. This is actually the idea of the planned Docker export functionality to handle all of that more conveniently 🙂

[github-actions]

This issue is stale because it has been open 90 days with no activity. Remove stale label or comment or this will be closed in 14 days