Deployment behind reverse proxy with custom path

[jacqueslorentz]

Hi all!

I try to deploy livebook (with docker) behind a reverse proxy to be accessible at an url like https://subdomain.domain.com/livebook.

Nginx configuration:

http {
    ...

    server {
        ...

        proxy_set_header        Host $host;
        proxy_http_version      1.1;
        proxy_set_header        Upgrade $http_upgrade;
        proxy_set_header        Connection $connection_upgrade;
        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_hide_header       X-Frame-Options;
        proxy_set_header        X-Frame-Options "SAMEORIGIN";

        ...

        location /livebook/ {
                proxy_pass http://localhost:8080/;
                proxy_redirect default;
        }
    }
}

I know this will not work for iframe using the port 8081. I would like to make first the application work.

The issue is that the path /livebook is not considered, I did not find any configuration or variable to configure the application base url.

When I try to access https://subdomain.domain.com/livebook, I am redirect to https://subdomain.domain.com/authenticate instead of https://subdomain.domain.com/livebook/authenticate. When I go on https://subdomain.domain.com/livebook/authenticate, the /livebook path misses in all assets urls.

Is it currently possible to do a deployment like this?

May I propose a PR implementing a base url configuration variable?

Thanks for your work!

[josevalim]

Yes, a PR to make this supported is welcome. I believe all you need is to change this line:

https://github.com/livebook-dev/livebook/blob/main/config/config.exs#L5

To be:

[host: "localhost", path: System.get_env(...)]

You should do this inside this function:

https://github.com/livebook-dev/livebook/blob/main/lib/livebook.ex#L85

And then follow the implementation of other env vars. :)

[jacqueslorentz]

I have succeed to have the application working with a env variable!

But I faced one issue, the frontend javascript assets must be redeployed and the env var must be configured in webpack for the scripts/css to be import with the url path. Socket endpoint must also be updated.

I suggest to make a PR with code and config changes and create an alternate Dockerfile to be able to build with url path.

When someone wants to use this feature, he have to clone the repo and rebuild the docker image with the url path. Like this with docker compose:

version: "3"
services:
  test-livebook:
    build:
      context: ./livebook
      dockerfile: ./livebook/Dockerfile.redeployAssets
      args:
        - LIVEBOOK_BASE_URL=/livebook
    container_name: test-livebook
    environment:
      - LIVEBOOK_PORT=8080
      - LIVEBOOK_BASE_URL=/livebook
    volumes:
      - ./data:/data
    ports:
      - 8080:8080
    restart: unless-stopped

What do you think about it? Do you consider it as relevant?

[josevalim]

You can define a meta tag with the URL to connect to. It will be set according to the base path configuration. Then the JavaScript loads the info from the meta tag and connects accordingly without a need for reconfiguration. WDYT?

[jacqueslorentz]

Unfortunatly this tag does work only on html, it does not work for resources included from css/js.
Anyway I found another way no too ugly to do it.

[jacqueslorentz]

I have open a PR to implement this feature 😃
#1549