Nginx reverse proxy Homebox to a subfolder

[gaellecoz]

Hello everyone,

First of all thank you for maintaining this app, I just started to use it and it really fits my needs.

However in hosting it myself I want to host it in a subfolder of my domain, e.g. mydomain.com/homebox. I host all my apps this way so I can use the same TLS certificate for all of them.

To test it I setup homebox and docker this way.

docker-compose.yml

    services:
        homebox:
            image: homebox
            build:
                context: .
                dockerfile: ./Dockerfile
                args:
                  - COMMIT=head
                  - BUILD_TIME=0001-01-01T00:00:00Z
            ports:
              - 3100:7745
            networks:
              - proxy
    
    nginx:
        image: nginx:latest
        container_name: nginx
        volumes:
          - ./nginx.conf:/etc/nginx/conf.d/default.conf
        ports:
          - 80:80
        links:
          - homebox
        networks:
          - proxy
      
     networks:
       proxy:

nginx.conf

    server { 
      listen 80 default_server;
      listen [::]:80 default_server;
      server_name _;
      
      # Configuration for Homebox
     location ^~ /homebox {
        proxy_redirect off;
        proxy_buffering off;
        
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header Host $http_host;
        proxy_set_header X-NginX-Proxy true;
        proxy_http_version 1.1;
        proxy_set_header Connection "";
          
        sub_filter 'src="'  'src="/homebox/';
        sub_filter 'href="'  'href="/homebox/';
        sub_filter_once off;
        sub_filter_types *;
        proxy_pass         http://homebox-homebox-1:7745/;
    }
    } 

It starts to load but I end up with a 404 screen

I also tried to edit frontend/nuxt.config.ts and add this entry at the beginning:

    app: {
        baseURL: '/homebox/'
      },

But it did not yield much result.

Does anyone have an idea how to do it?

Kind regards

[hay-kot]

This isn't possible to do with just a runtime change, you'd have to build and compile the program itself.

I also tried to edit frontend/nuxt.config.ts and add this entry at the beginning:

app: {
baseURL: '/homebox/'
},
But it did not yield much result.

Is the right idea, I think you'd need to compile build the frontend with that change and then build the binary.

[anakinsleftleg]

@gaellecoz were you able to get it proxied over nginx? I'm trying to do the same. Have no idea what to do. This app is the hardest of all i've worked with so far to try to accomplish this.

[buffaloexpatbill]

For what it's worth, though this probably won't help with your current certs, a wildcard domain cert (*.domain.com) does let you use the same cert for any subdomain.
I haven't tried reverse proxy with the subfolder method, I am reverse proxying through apache with subdomain.

[ivangrimaldi]

I was able to run it inside the /homebox/ subpath of my server.
I had to place additional subfilters to replace nuxt baseURL as well as /api/v1 and /api/v1/ws

If someone is interested, here is my config. Not future-proof probably and not perfect, I know, but it works with the latest docker I have (v0.19.0):

location /homebox/ {
                proxy_pass              http://127.0.0.1:3100/;
                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;
                proxy_set_header        Accept-Encoding gzip;
                proxy_set_header        Upgrade $http_upgrade;
                proxy_set_header        Connection upgrade;
                sub_filter 'src="/'  'src="/homebox/';
                sub_filter 'href="/'  'href="/homebox/';

                #Replaced in homepage
                sub_filter 'baseURL:"/"'  'baseURL:"/homebox/"';
                #replaced in Javascript
                sub_filter 'prefix:"/api/v1"'  'prefix:"/homebox/api/v1"';
                sub_filter '/api/v1/ws/events'  '/homebox/api/v1/ws/events';
                sub_filter '/no-image.jpg'  '/homebox/no-image.jpg';
                sub_filter 'href:"/favicon.svg"'  'href:"/homebox/favicon.svg"';

                sub_filter_once off;
                sub_filter_types *;
        }

[gaellecoz]

Thanks a lot,

That is exactly what I needed, I did not had the opportunity to go back at it for a while.
I just added one line to your config for it to work on my installation with v0.22.3.

location /homebox/ {
                proxy_pass              http://127.0.0.1:3100/;
                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;
                proxy_set_header        Accept-Encoding gzip;
                proxy_set_header        Upgrade $http_upgrade;
                proxy_set_header        Connection upgrade;
                sub_filter 'src="/'  'src="/homebox/';
                sub_filter 'href="/'  'href="/homebox/';

                #Replaced in homepage
                sub_filter 'baseURL:"/"'  'baseURL:"/homebox/"';
                #replaced in Javascript
                sub_filter 'prefix:"/api/v1"'  'prefix:"/homebox/api/v1"';
                sub_filter '/api/v1/ws/events'  '/homebox/api/v1/ws/events';
                sub_filter '/no-image.jpg'  '/homebox/no-image.jpg';
                sub_filter 'href:"/favicon.svg"'  'href:"/homebox/favicon.svg"';
+               sub_filter 'entry":"/_nuxt'  'entry":"/homebox/_nuxt';

                sub_filter_once off;
                sub_filter_types *;
        }

[ololoshka2871]

I added two more sub_filters - no errors in browser console, but F5 still fail.

location /homebox/ {
                 proxy_pass              http://127.0.0.1:3100/;
                 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;
                 proxy_set_header        Accept-Encoding gzip;
                 proxy_set_header        Upgrade $http_upgrade;
                 proxy_set_header        Connection upgrade;
                 sub_filter 'src="/'  'src="/homebox/';
                 sub_filter 'href="/'  'href="/homebox/';
 
                 #Replaced in homepage
                 sub_filter 'baseURL:"/"'  'baseURL:"/homebox/"';
                 #replaced in Javascript
                 sub_filter 'prefix:"/api/v1"'  'prefix:"/homebox/api/v1"';
                 sub_filter '/api/v1/ws/events'  '/homebox/api/v1/ws/events';
                 sub_filter '/no-image.jpg'  '/homebox/no-image.jpg';
                 sub_filter 'href:"/favicon.svg"'  'href:"/homebox/favicon.svg"';
                 sub_filter 'entry":"/_nuxt'  'entry":"/homebox/_nuxt';
+                sub_filter '/api/'  '/homebox/api';
+                sub_filter '/sw.js'  '/homebox/sw.js';
 
                 sub_filter_once off;
                 sub_filter_types *;
         }

[mm-mbs]

I opened #1600 for this. It adds sub-path support via HBOX_WEB_APP_BASE=/homebox at runtime, same image works for any path without rebuild. Would be great to get some testing/feedback.

[gaellecoz]

Hi,
I will wait that it's part of the nightly image to try it out. For now it still works fine with the filters.
Cheers