OSM Map not loading with reverse proxy

[Elu43]

Hello,

I am using this frontend with the Owntracks Recorder, running in a LXC container with Proxmox. The path is /var/spool/owntracks/recorder.
The MQTT broker is also running in the same container. The address of this container is 192.168.2.155.

When I access to the frontend with http://192.168.2.155:8083 it's working very well, I can see my device.

I need to access to the frontend via https, so I created a proxy with Nginx. Here is the configuration (I will set https later) :

server {
    listen       80;
    server_name  192.168.2.155;
    location / {
        root   html;
        index  index.html index.htm;
    }

    # Proxy and upgrade WebSocket connection
    location /owntracks/ws {
        rewrite ^/owntracks/(.*)    /$1 break;
        proxy_pass      http://192.168.2.155:8083;
        proxy_http_version  1.1;
        proxy_set_header    Upgrade $http_upgrade;
        proxy_set_header    Connection "upgrade";
        proxy_set_header    Host $host;
        proxy_set_header    X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location /owntracks/ {
        proxy_pass      http://192.168.2.155:8083/;
        proxy_http_version  1.1;
        proxy_set_header    Host $host;
        proxy_set_header    X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header    X-Real-IP $remote_addr;
    }

    # OwnTracks Recorder Views                                                             
    location /owntracks/view/ {
         proxy_buffering         off;            # Chrome
         proxy_pass              http://192.168.2.155:8083/view;
         proxy_http_version      1.1;
         proxy_set_header        Host $host;
         proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header        X-Real-IP $remote_addr;
    }
    location /owntracks/static/ {
         proxy_pass              http://192.168.2.155:8083/static;
         proxy_http_version      1.1;
         proxy_set_header        Host $host;
         proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header        X-Real-IP $remote_addr;
    }

    # HTTP Mode
    location /owntracks/pub/ {
        auth_basic              "OwnTracks pub";
        auth_basic_user_file    /usr/local/etc/nginx/owntracks.htpasswd;
        proxy_pass              http://192.168.2.155:8083/pub;
        proxy_http_version      1.1;
        proxy_set_header        Host $host;
        proxy_set_header        X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header        X-Real-IP $remote_addr;

        # Optionally force Recorder to use username from Basic
        # authentication user. Whether or not client sets
        # X-Limit-U and/or uses ?u= parameter, the user will
        # be set to $remote_user.
        proxy_set_header        X-Limit-U $remote_user;
    }
}

I also changed the baseUrl in the config file in /var/spool/owntracks/recorder/config/config.js :

const startDateTime = new Date();
startDateTime.setHours(0, 0, 0, 0);

// Here you can overwite the default configuration values
window.owntracks = window.owntracks || {};
window.owntracks.config = {
  locale: "fr-FR",
  startDateTime,
  api: {
   baseUrl: "http://192.168.2.155/owntracks/",
  },
};

But then, when I access the frontend via http://192.168.2.155/owntracks , the frontend is loading with the blue upside bar, the data is loading as well because I can select my device, but the rest of the page stays blank without the OSM map.

As you can see on the attached screenshots, with address/owntracks, the browser console is loading nothing from OSM, but with address/8083 it does.

Any idea what could cause my problem ? I have the same problem with Apache2. The map is working well in a view I created at address/owntracks/view/xyz though.

Thank you very much !

[jpmens]

There was a reverse-proxy question recently. Before we study this, have you checked whether the issues are related?

[Elu43]

I don't think this is related. He had a mistake in his ports configuration while I think mine are okay. And the results are different, I don't have any map at all. Also, I'm not using Docker.

[Elu43]

I solved the problem by removing /owntracks/ from the nginx config and using directly "/". I don't really understand how it changes anything but at least it's working now.

I have one last question : how can I customize the device's name and icon like the screenshot on your homepage ? I don't see anything about this in the documentation.

Thank you

[linusg]

Glad you got it working!

I have one last question : how can I customize the device's name and icon like the screenshot on your homepage ? I don't see anything about this in the documentation.

That's called a card and is documented here: https://owntracks.org/booklet/features/card/

You can find tools to create the string representation of the card's face image here: https://github.com/owntracks/recorder/tree/master/contrib/faces