title: upload application which backend is django and frontend is Vue using Docker
body: <p>I'm working on an application which uses these technologies:</p>
  <ul>
  <li>Django Backend</li>
  <li>Vue JS front end</li>
  <li>PostgreSQL database</li>
  <li>Docker as a container</li>
  <li>Traefik as a reverse proxy version 1.7</li>
  <li>redis.</li>
  <li>awscli</li>
  </ul>
  <p>Here is my <strong>production.yml</strong> file which i use to the docker-compose to run all applications:</p>
  <pre><code>version: '3'
  
  volumes:
    production_postgres_data: {}
    production_postgres_data_backups: {}
    production_traefik: {}
  
  services:
    django:
      build:
        context: .
        dockerfile: ./compose/production/django/Dockerfile
      image: goplus_backend_production_django
      depends_on:
        - postgres
        - redis
      env_file:
        - ./.envs/.production/.django
        - ./.envs/.production/.postgres
      command: /start
      volumes:
        - ./static:/static # adding static &amp; media file for django
        - ./media:/media
    
    vue:
      build:
        context: /root/goplus_front/new_dashboard_v2
      container_name: new_dashboard_v2
      environment:
        - HOST=localhost
        - PORT=8080 
      ports:
        - &quot;8080:8080&quot;
      depends_on:
        - django
  
    postgres:
      build:
        context: .
        dockerfile: ./compose/production/postgres/Dockerfile
      image: goplus_backend_production_postgres
      volumes:
        - production_postgres_data:/var/lib/postgresql/data
        - production_postgres_data_backups:/backups
      env_file:
        - ./.envs/.production/.postgres
      ports:
        - &quot;5432:5432&quot;
    
    traefik:
      build:
        context: .
        dockerfile: ./compose/production/traefik/Dockerfile
      image: goplus_backend_production_traefik
      depends_on:
        - django
  #    volumes:
       # - production_traefik:/etc/traefik/acme
      ports:
        - &quot;0.0.0.0:80:80&quot;
        - &quot;0.0.0.0:443:443&quot;
  
    redis:
      image: redis:5.0
    awscli:
      build:
        context: .
        dockerfile: ./compose/production/aws/Dockerfile
      env_file:
        - ./.envs/.production/.django
      volumes:
        - production_postgres_data_backups:/backups
  </code></pre>
  <p>Till now everything is fine and if I use <strong>IP:80</strong> I got redirected to Django app (admin panel), and if I use <strong>IP:8080</strong> I got redirection to Vue app.<br />
  The problem is now I want to use <strong>Domain Name</strong> not IP address, I bought a domain name and add SSL to it and it is working fine if I try to access Django app but not working if I try to access Vue app.
  Here is the configuration file for <strong>traefik.toml</strong> which responsible of redirect requests to Django or Vue:</p>
  <pre><code>logLevel = &quot;INFO&quot;
  defaultEntryPoints = [&quot;http&quot;, &quot;https&quot;]
  
  # Entrypoints, http and https
  [entryPoints]
    # http should be redirected to https
    [entryPoints.http]
    address = &quot;:80&quot;
    # https is the default
    [entryPoints.https]
    address = &quot;:443&quot;
      [entryPoints.https.tls]
        [[entryPoints.https.tls.certificates]]
        certFile = &quot;/etc/certs/&lt;crt_file_name&gt;.crt&quot;
        keyFile  = &quot;/etc/certs/&lt;crt_key_file_name&gt;.key&quot;
  
  [file]
  [backends]
    [backends.django]
      [backends.django.servers.server1]
        url = &quot;http://django:5000&quot;
  
    [backends.vue]
      [backends.vue.servers.server1]
        url = &quot;http://vue:8080&quot;
  
  [frontends]
    [frontends.django]
      backend = &quot;django&quot;
      passHostHeader = true
      [frontends.django.headers]
        HostsProxyHeaders = ['X-CSRFToken']
      [frontends.django.routes.dr1]
        rule = &quot;Host:&lt;domain name&gt;, &lt;IP name&gt;&quot;
  
    [frontends.vue]
      backend = &quot;vue&quot;
      [frontends.vue.routes.dr1]
         rule = &quot;Host:&lt;domain name&gt;;PathPrefixStrip:/dashboard&quot;
      
  </code></pre>
  <p>So from that configuration i want if someone tries to access Django app he must just use <strong>the Full domain name</strong>, and if he wants to use Vue app he must use <strong>DomainName/dashboard</strong>, it is working fine with Django app but with Vue app i got these Errors.
  <a href="https://i.stack.imgur.com/wKpjq.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wKpjq.png" alt="enter image description here" /></a>
  so any help or recommendation to solve this problem?</p>