Implement subdomain with port 8080

Question

I have a VPS, on that VPS there is an existing application that is live with Docker port 80. There are two applications that I want to deploy on that VPS, the first application is a Laravel backend using port 8080, the second application is a NextJS frontend port 8081. Two This application can be accessed via public IP (193.203.x.x:8080 and 193.203.x.x:8081).

but I want to use a subdomain for the first application and second application.

• laravel backend: be.example.com
• nextjs frontend: fe.example.com

I have configured A records and added the values be and fe with points to server 193.203.x.x.

I have configured nginx so that the first application points to be.example.com and the second application points to fe.example.com, but when in the browser, for example, I type be.example.com, what appears is the existing application with port 80.

I want that when I type be.example.com, the Laravel backend application page appear, likewise when I check fe.example.com, the NextJS frontend application page appear.

what i have done:

I have checked the domain configuration, there are no A records with *. I also checked Nginx for backend and fronted applications, for example it was turned off, and the be.example.com page still displays the existing application with port 80, that means my Nginx doesn't reach the be.example.com URL

This is my nginx config:

sites-available

server {
        listen 8080;
        listen [::]:8080;

        server_name be.example.com; #change with your domain
        root /home/cabin/web-app-backend/public;

        add_header X-Frame-Options "SAMEORIGIN";
        add_header X-Content-Type-Options "nosniff";

        index index.php;

        charset utf-8;

        location / {
                #try_files $uri $uri/ /index.php?query_string;

                proxy_pass http://127.0.0.1:8080;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header Host $host;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_set_header X-Forwarded-Proto $scheme;

                proxy_redirect off;

                client_max_body_size 10m;
                client_body_buffer_size 128k;
                proxy_connect_timeout 90;
                proxy_send_timeout 90;
                proxy_read_timeout 90;

                proxy_buffer_size 4k;
                proxy_buffers 4 32k;
                proxy_busy_buffers_size 64k;
                proxy_temp_file_write_size 64k;

        }

        location = /favicon.ico { access_log off; log_not_found off; }
        location = /robots.txt  { access_log off; log_not_found off; }
        error_page 404 /index.php;

        location ~ \.php$ {
                include snippets/fastcgi-php.conf;
                fastcgi_pass unix:/var/run/php/php8.2-fpm.sock;
                fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
                include fastcgi_params;
        }}

ufw status

To                         Action      From
--                         ------      ----
OpenSSH                    ALLOW       Anywhere
443                        ALLOW       Anywhere
80/tcp                     ALLOW       Anywhere
85                         DENY        Anywhere
8080                       ALLOW       Anywhere
8080/tcp                   ALLOW       Anywhere
8081                       ALLOW       Anywhere
8081/tcp                   ALLOW       Anywhere
OpenSSH (v6)               ALLOW       Anywhere (v6)
443 (v6)                   ALLOW       Anywhere (v6)
80/tcp (v6)                ALLOW       Anywhere (v6)
85 (v6)                    DENY        Anywhere (v6)
8080 (v6)                  ALLOW       Anywhere (v6)
8080/tcp (v6)              ALLOW       Anywhere (v6)
8081 (v6)                  ALLOW       Anywhere (v6)
8081/tcp (v6)              ALLOW       Anywhere (v6)

Answer 1

If you want your users to type be.example.com and get your application you need to use the default ports, 80 for HTTP and 443 for HTTPS. With every other port your users need to type the port as well, like be.example.com:8080.

That being said, you need to bind your server blocks to the default ports.

Example:

server {
        listen 80;
        listen [::]:80;

        server_name be.example.com; 
        location / {
                proxy_pass http://127.0.0.1:8080;
        }

}

server {
        listen 80;
        listen [::]:80;

        server_name fe.example.com; 
        location / {
                proxy_pass http://127.0.0.1:8081;
        }

}

You should however consider to use HTTPS per default and redirect all HTTP traffic to HTTPS, as SSL certificates don't cost anything nowadays.

Afterwards, you should bind your backend servers to the loopback interface 127.0.0.1 so they are only reachable over the reverse proxy. And you can and should remove the ports 8081 and 8080 from your firewall. They are not needed with the reverse proxy.

Answer 2

Did you unbind the existing application port 80 from docker container. Run the following command to unbind the port 80.

docker run -p <desired_host_port>:<container_port> -d --name <container_name> <image_name>