Can't access Vue3 app on server using domain name, but works with IP

user_4048657 0
Viewed 57

I have a Digital Ocean droplet running two Docker containers, one that is a Vue3 app which I'm having issues with, and a Django server that I'm not having issues with.

vue-cli-service serve --mode production --host 0.0.0.0 --public http://XXX.YYY.ZZZ.XXX:8080

If I go in Chrome and type www.websitename.com

This site can’t be reached websitename.com refused to connect.

If I go in Chrome and directly type the IP and the port I can see the website load. Is this a DNS resolution issue? I really don't think so, here's why:

If I go in Chrome and type http://websitename.com:8000/admin

I see a Django administration site. This means that I have no problem with Django, only with Vue3.

I tried setting --host 0.0.0.0, I tried adding --public with the website name and with the IP directly.

Also nmap seems to show everything working fine

nmap -F websitename.com <---- No issue with DNS resolution
Starting Nmap 7.80 ( https://nmap.org ) at 2022-07-26 20:14 PDT
Nmap scan report for XXX.YYYY.ZZZ.XXX  <---- Correct IP
Host is up (0.090s latency).
Not shown: 92 closed ports
PORT     STATE    SERVICE
22/tcp   open     ssh
25/tcp   filtered smtp
111/tcp  filtered rpcbind
135/tcp  filtered msrpc
139/tcp  filtered netbios-ssn
445/tcp  filtered microsoft-ds
8000/tcp open     http-alt    <---- Django
8080/tcp open     http-proxy  <---- Vue3
vuejs3 vue.js server
1 Answers

If you do not provide a port in Chrome - it will default to port 80. But your Vue3 Docker is running on port 8080. Therefore you have to either provide this port when you type the URL in Chrome - or you must run your Docker on port 80.

You are providing port 8000 for the Django administration site - do the same (with port 8080) for your Vue3 application.

user_59628020
Related