Web app selection in Traccar 5.3

Hi All, First of all, thanks to Anton for his job, and please correct this text as you like.

I was trying to achieve this (to have both web apps running in parallel) for some time ago, and I needed to spend some time during last week, and finally I found a solution that works for me. Probably I needed so much time because my unknowledge in some topics (APIs, etc.), and probably that’s obvious for others, but … So, let me explain what I finally did, just in case someone is in the same situation as me, and this could help them. (Please, substitute “mydomain” by your real domain name)

Objective:
I wanted to have access to modern web and to legacy web in the same traccar server. The option to have one url for modern and other url for legacy was fine for me. E.g., modern.mydomain.com for modern, and legacy.mydomain.com for legacy.

Starting point: (please, adapt it to your situation)
Traccar server is deployed in a virtual host in ubuntu, using docker. I have also a reverse proxy server in a second docker container to get secured https ssl connections to the web page.
Traccar docker is: traccar/traccar:latest (currently v.5.8)
Reverse proxy docker is: jwilder/nginx-proxy:latest (currently v.1.25.1)

From my understanding, the key to get the objective is to understand the following:

• Traccar server has a web server in port 8082 that serves two things:
  • Legacy or Modern static web pages (depending on traccar configuration)
  • /API commands/responses, that are common for both, legacy or modern.

So, what we need is the following; when we visit legacy.mydomain.com, to get the static legacy folder content (from traccar server or other web server), and the content of /API served by traccar server.

The same situation when we want to visit modern.mydomain.com. We need to get the static modern folder content (from traccar server or other web server), and the content of /API served by traccar server.

The problem was traccar is only serving one of the folders, modern or legacy, and if we move legacy folder in modern folder, or vice, in an attempt to get the other web from the subfolder, traccar is always searching one of the following files from the root, “release.html” first, and if no file, then “index.html”. Release.html points to legacy, and index.html to modern. To have both files doesn't work.

One option was to put legacy into modern folder, and then use the following url to get the legacy web: https://modern.mydomain.com/release.html, and it works with a browser, but this url seems to be not allowed in traccar manager android app.

Solution:
I configure the following:

• Traccar server to serve legacy web page (as usual), inserting the following line in traccar.xml file:

  • <entry key='web.path'>./legacy</entry>
  • Note that I have configured traccar container with ip 172.20.0.20 (see below)

• Copy static modern web folder from traccar to docker host, with the following command:

  • docker cp traccar:/opt/traccar/modern /srv/docker/proxy/www/.
  • Note that I use /srv/docker/proxy/www as the folder that contains the local copied modern folder, mapped to nginx docker container server (in the proxy container, the folder is /var/www. You have to map it when you create the proxy container. (See Below)

• NGINX to serve requests at legacy.mydomain.com:443 doing proxy to port 8082 of the traccar server, with the following configuration at nginx config file (extra-config.conf):

server {
server_name legacy.mydomain.com;
listen 443 ssl ;
access_log /var/log/nginx/access.log vhost;
ssl_session_timeout 5m;
ssl_session_cache shared:SSL:50m;
ssl_session_tickets off;
ssl_certificate /etc/nginx/certs/mydomain.com.crt;
ssl_certificate_key /etc/nginx/certs/mydomain.com.key;
location / {
    proxy_pass http://172.20.0.20:8082/;
    }
}

• NGINX to serve requests at modern.mydomain.com:443, doing proxy of /API to port 8082/API of the traccar server, and to serve static pages of the copied modern folder in nginx container, with the following configuration at nginx config file (extra-config.conf):

server {
server_name modern.mydomain.com;
listen 443 ssl ;
access_log /var/log/nginx/access.log vhost;
ssl_session_timeout 5m;
ssl_session_cache shared:SSL:50m;
ssl_session_tickets off;
ssl_certificate /etc/nginx/certs/mydomain.com.crt;
ssl_certificate_key /etc/nginx/certs/mydomain.com.key;
root /var/www/modern;
index release.html index.html;
location /api {
    proxy_pass http://172.20.0.20:8082/api;
    }
}

Docker:
Regarding docker, here you have how I created traccar and proxy container.

Network: I create a new network group, to use the following subnet in both containers:

docker network create --subnet=172.20.0.0/16 group

Traccar:

docker run \
-d --restart always \
--name traccar \
--hostname traccar \
--network group \
--ip 172.20.0.20 \
--expose 8082 \
-p 8082:8082 \
-p 5000-5150:5000-5150 \
-p 5000-5150:5000-5150/udp \
-v /opt/traccar/logs:/opt/traccar/logs:rw \
-v /opt/traccar/traccar.xml:/opt/traccar/conf/traccar.xml:ro \
-v /opt/traccar/data:/opt/traccar/data:rw \
traccar/traccar:latest

Proxy:

docker run \
-d --restart always \
--name proxy \
--network group \
-p 443:443 \
-v /var/run/docker.sock:/tmp/docker.sock:ro \
-v /srv/cloudflare:/etc/nginx/certs:ro \
-v /srv/docker/proxy/extra-config.conf:/etc/nginx/conf.d/extra-config.conf \
-v /srv/docker/proxy/www:/var/www:ro \
jwilder/nginx-proxy:latest

I expect this could clarify doubts to others in the same situation.

Hi Anton,
I see the Apache settings to run parallel legacy and modern on two separate domain names. My server is a dedicated Windows 2019 standard edition server. How can I set the same instance legacy and current modern version on two different domain names?
Thank you

Any idea if this also applies to the project that uses vite?

https://github.com/traccar/traccar-web/commit/24e927d6a51fd2bbbe1c307b169653d0ba041d70#diff-87567b27150a2ec0adb636bd39f791d76bf906d705de6109794323fc44f96354

I need the modern interface to run in a subfolder like it did before and to be able to make the change from a button in each login