Docker setup behind Nginx Proxy Manager and player/embed not showing

[Michel Hageman]

Hello!

I have Mistserver set up in a Linux Box with NPM installed as a reverse proxy. I use the advanced settings as such: 

location /mistserver/ {
  proxy_pass http://172.30.0.1:8080/;  # Changed from 172.24.0.1
  proxy_set_header X-Real-IP $remote_addr;
  proxy_buffering off;                      
  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "Upgrade";
  proxy_read_timeout 600s;
  proxy_set_header Host $host;
  proxy_set_header X-Mst-Path "$scheme://$host/mistserver";
}

I use the gateway that I set as a static in the NPM docker compose. 

All is well. Content loads from an external website that uses the embed code. 

But when I visit the Mistserver URL on port 4242, and I want to see a preview of the video, or look at the embed codes, that's not working. 

I really don't understand how to set this up properly, so I can use mistserver.url.example to get to the UI on 4242, as it does now, and use mistserver.url.example/mistserver to serve the content, receive streams and show previews/embed codes. 

I have this as a docker-compose.yml: 

services:

    mistserver:

        container_name: mistserver

        volumes:

            - type: bind

              source: ./mistserver.conf

              target: /config.json

            - type: bind

              source: /mnt/data/Downstairs/LG_Backup

              target: /video

            - type: bind

              source: ./logfile

              target: /logfile/logfile

            - type: bind

              source: /mnt/data/Downstairs/torrents/Download/

              target: /video2

        shm_size: 20G

        network_mode: 'host'

        restart: unless-stopped

#        networks:

#          - npm-network

#        ports:

#          - 8080:8080

#          - 4242:4242

#          - 8889:8889/udp

#          - 5554:5554

#          - 4200:4200

        image: ddvtech/mistserver_alpine_minimal

networks:

  npm-network:

    external: true

and have set the trusted proxies, and set the http and https domain under HTTP protocols. 

Of course I checked with the domain without a SSL cert and use plain HTTP, then everything is working. But, as you understand, I can't do this. 

I really would like to figure this out. I know I had it working once in the past, but can not figure out anymore how I did it exactly. 

Thanks in advance!

Warmest regards, 

MIchel

[Michel Hageman]

I said I set the gateway address as static in the compose file, but I did that from the CLI. Just FYI. 

[Balder Vietor]

Hey Michel,

HTTP proxies are always the "fun" kind of confusing, so I'm not surprised you're running into some issues here.

I'll try and give you some pointers, but I'll be honest in that I usually mess this up until I get it right again as well. 

Before I start, you might want to take a look at the MistServer bootstrap project we put live recently: https://github.com/DDVTECH/mistserver-bootstrap

This is a Docker compose booting MistServer, Prometheus, Grafana and settings for Caddy are available as well. If you're just interested in a working SSL connection chances are copying this will be easy as it's made to do exactly that. In order to use Caddy with this docker compose file you do need to edit the env.example Fill in the domain & remove the # in front of caddy. You'll want to edit the docker compose file as well. 

We've got some documentation on this topic available here: https://docs.mistserver.org/howto/https/httpproxy#api-over-https

So a few things to keep in mind:

- HTTPS pages should only ever attempt to open HTTPS video links

- HTTP pages should only ever attempt to open HTTP video links

- If you notice MistServer can serve embed pages, or .html links, but not in the configuration there's 1 of 2 things going on:

  1. Your MistServer configuration file saved the httpUrl as something invalid. This can be checked by editing the config and looking for a `"ui_settings": {"HTTPUrl":"ADDRESSHERE:4242",} field. Then correct/delete this. It saves the first time you access MistServer over the interface and it can very well be locked into an address only available for one specific device.

 2. Your MistServer configuration is not aware of its HTTP endpoints apart from the port it's got open. This could mean the X-Mst-Path header isn't passed on correctly, the easiest fix is to set a Public Address telling MistServer where all its HTTP(S) addresses are.

- If your Docker container address changes, these need changing as well

If MistServer is the main purpose of the machine, I would recommend binding to --network=host, this way you can just use the address of the machine and not the Docker container. Though this very much depends on what else you're running.

Either way I think the easiest fix for you would be doing the exact same thing you do for the reverse proxy, but add the interface. This enables HTTPS for the interface and would allow the working embed links to be used in the interface instead of generating CORS errors.

If I'm looking at your settings the following will probably be correct:

location /mistui/ {
  proxy_pass http://172.30.0.1:4242/; 

  proxy_set_header X-Real-IP $remote_addr;
  proxy_buffering off;                      
  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "Upgrade";
  proxy_read_timeout 600s;
  proxy_set_header Host $host;
  proxy_set_header X-Mst-Path "$scheme://$host/mistserver";
}

Now a thing to keep in mind is that this should mean your docker running MistServer can be reached as `172.30.0.1`. 

If the setting is correct you should be able to visit https://mistserveraddress/mistui/ and receive the interface over HTTPS. This one should be able to preview the streams using the HTTPS reverse proxy you've got working already.

Note that we don't necessarily recommend opening the interface for untrusted connections or to the public internet. MistServer runs pretty deep on a server and it would provide people root access to your server if they manage to log in. 

The X-Mst-Path "should" auto fill the Public address fields in the HTTP protocol whenever someone connects, meaning you don't have to set the Public address page. If you notice the HTTP is working, but the SSL version of the interface is not, you'll want to add both the HTTP and the HTTPS address to the public address. 

Filling in https://mistserveraddress/mistserver/ for the https redirect you've set up in your previous message

http://mistserveraddress/mistserver/ in the case you've set up nginx to also handle http 

lastly http://mistserveraddress:8080 for where it's actually running. 

The Public address setting is basically telling MistServer where its HTTP addresses are, if you'd only fill in the HTTPS one it will only work for that address, so HTTP will no longer work. 

You know you've got the right address if you get an unsupported media type page:

Unsupported Media Type

The server isn't quite sure what you wanted to receive from it.

Just try and open it in the browser, if you see a page displaying this you have reached a MistServer HTTP endpoint. 

[jammin radio]

I’m using this same setup 

Login in needs to be a separate URLs so got to ur dns and add subdomain for 4242 

NPM -- add new proxy host --- 

settings 

http schema and websockets

Allocate SSL

then you need to add in the advanced tab

location /mistinterface/ {
      proxy_pass http://-----ADD IP-------:4242/;

      proxy_set_header X-Real-IP $remote_addr;
      proxy_buffering off;                      
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "Upgrade";
      proxy_read_timeout 600s;

      proxy_set_header Host $-----ADD IP--------;
    }

Login.wesite.com (example)

 now login is HTTPS

now if you have seprate stations or users you need to  use separate http protocols for them

So in one HTTP protcal on mist il use example 

play.client1.com 

Then id open another http for a new client / station 

Play.client.com 

Then in NPM 

add proxy host 

url is play.client1.com 

add your ip in address

tick websockets 

http schema 

ssl tab add or create ssl

advanced tab 

location /play/ {
      proxy_pass http://----ADD IP-----:3001/;   I USED this port number

      proxy_set_header X-Real-IP $remote_addr;
      proxy_buffering off;                      
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "Upgrade";
      proxy_read_timeout 600s;

      proxy_set_header Host $ ----ADD IP-----  ;
      proxy_set_header X-Mst-Path "$scheme://$host/play";
    }

--
You received this message because you are subscribed to the Google Groups "Mistserver.org" group.
To unsubscribe from this group and stop receiving emails from it, send an email to mistserver+...@googlegroups.com.
To view this discussion visit https://groups.google.com/d/msgid/mistserver/ffece58b-960e-4ce2-85d2-ced97d8386d3n%40googlegroups.com.

[Michel Hageman]

Thanks everyone! I'll give it all a try and see what works best...! 

I'm thinking to use Tailscale to access the UI then and prevent unauthorized access this way, and set up the http part through the reverse proxy. 

I'll also give the new docker setup you guys made a spin Balder! Sounds really good!

Again thanks a lot! 

Warmest regards, 

Michel

To view this discussion visit https://groups.google.com/d/msgid/mistserver/CAD%3DndbnQWKHAKWpFpnLLzs9aDXpzwUkES0h4h_7%3D4_oULA5b6w%40mail.gmail.com.