How to make it accesssable behind nginx, on a cloud server?

[Eroyi]

Version

5.2

Details & Steps to reproduce

I deployed 2FAuth with docker-compose on an EC2, and I would like to access it with the URL https://foo.bar/2fa.

But I keep getting a blank page with 200 responses in logs, and the Chrome console indicated that there is an error at app-BsP-5XS6.js:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

And no error is shown in /storage/logs

I scrolled through all GitHub issues related to reverse proxy / nginx and tried several configs but still no luck.

---

Here is the docker-compose.yaml:

version: "3"
services:
  2fauth:
    image: 2fauth/2fauth
    container_name: 2fauth
    volumes:
      - /mnt/data/2fauth:/2fauth
    ports:
      - 8000:8000/tcp
    environment:
      ......
      - APP_URL=https://foo.bar/2fa
      - ASSET_URL=https://foo.bar/2fa
      - APP_SUBDIRECTORY=2fa
      ......
      - AUTHENTICATION_GUARD=web-guard
       ......
      - TRUSTED_PROXIES=*
      ......

And here is the Nginx config:

server {
    listen 80;
    server_name foo.bar;
    return 301 https://foo.bar$request_uri;
    access_log /var/log/nginx/main/access main;
    error_log /var/log/nginx/main/error error;
}

server {
    listen 443 ssl;
    server_name foo.bar;
    server_name_in_redirect off;
    ssl_certificate /etc/nginx/conf.d/cert/foo.bar/foo.bar.crt;
    ssl_certificate_key /etc/nginx/conf.d/cert/foo.bar/foo.bar.key;
    ssl_session_timeout 5m;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP;
    ssl_prefer_server_ciphers on;
    proxy_intercept_errors on;
    proxy_set_header HOST $host;
    proxy_set_header X-real-IP $remote_addr;
    proxy_set_header X-Forwarded-FOR $proxy_add_x_forwarded_for;
    error_page 404 403 502 /error;

    location /nginx_status {
      stub_status on;
      access_log   off;
    }

    ......

    location /2fa {
      proxy_pass http://127.0.0.1:8000;
      access_log /var/log/nginx/2fa/access main;
      error_log /var/log/nginx/2fa/error error;
    }
}

It looks like a network / reverse proxy issue to me, but I can't find the problem. Any help would be grateful.

Expectation

Can be access with https://foo.bar/2fabe accessed

Error & Logs

No response

Execution environment

No response

Containerization

• [X] Docker

Additional information

No response

[Bubka]

Hi,

I was able to reproduce the problem on my test vm. I fixed it by proxying the assets directory, here is my working configuration.

NGINX config :

server {
    ...

    location /2fa/ {
        proxy_set_header Host $host;
        proxy_set_header X-Forwarded-Proto https;
        proxy_set_header X-Real-IP $remote_addr;

        proxy_pass http://127.0.0.1:8000/;
    }

    # We reverse proxy the assets directory explicitly.
    location /2fa/build/assets/ {
       proxy_pass http://127.0.0.1:8000/build/assets/; 
    }

    ...
}

docker-compose:

version: "3"
services:
  2fauth:
    image: 2fauth/2fauth
    container_name: 2fauth
    volumes:
      - /mnt/data/2fauth:/2fauth
    ports:
      - 8000:8000/tcp
    environment:
    ...
    - APP_URL=https://foo.bar/2fa
    # - ASSET_URL=https://foo.bar/2fa  There is no need to set ASSET_URL when the url is the same as APP_URL
    - APP_SUBDIRECTORY=2fa
    ...

Does it work for you?

[Eroyi]

Yes it works! Appreciate! It would be helpful if you could put these configurations in the docs.

Also I've noticed that the Docker image is already built with MySQL support (https://github.com/Bubka/2FAuth/issues/193), yet not mentioned in the docker-compose file or the docs, it would be great if you could make an update, there might be people like me who would like to centralise all self-hosted services data in one omni database for better management and backup.

Here is the snippet that I used to bring up the 2Fauth via docker-compose, with MariaDB as the database:

version: "3"
services:
  2fauth:
    image: 2fauth/2fauth
    container_name: 2fauth
    ......
      - DB_CONNECTION=mysql
      - DB_HOST=citadel.internal
      - DB_PORT=3306
      - DB_DATABASE=2fauth
      - DB_USERNAME=username
      - DB_PASSWORD=password
    ......

[Eroyi]

Also I found several l18n issues, and I would like to apply for a proofreader in Chinese Translate. I'm a proofreader for the VRChat Localisation Team and a primary translator for reWASD Application.

Crowdin Profile: Aroyi

[Bubka]

Proofreader role granted. Thx for your contribution 👍🏻