Remote access to CVAT, unable to connect remotely via LAN or internet domain (via <HOST-IP>:port or <FQDN>:port). Blocked by CORS policy: No 'Access-Control-Allow-Origin, Network Error and net::ERR CONNECTION REFUSED errors.

[pvalls]

I deployed CVAT on an AWS instance and I struggled to access it remotely.

The errors I encountered along the way were:

Could not check authorization on the server. Error: Network Error.

blocked by CORS policy: No 'Access-Control-Allow-Origin'

net::ERR_CONNECTION_REFUSED

Nevertheless, finally I managed to get it working. Following I report the solutions to this errors so it can help others and to prepare a PR to contribute.

Gathering of related issues:

• Issue 930: Unable to remote connect Unable to remote connect  #930

• Issue 907: Remote access issue Remote access issue #907

• Issue 165: How can I connect from other computers which are NOT on the LAN? How can I connect from other computers which are NOT on the LAN? #165

• Issue 102:Connection from another computer gives Bad Request(400) Connection from another computer gives Bad Request(400) #102

• Issue 4: Running on AWS EC2 Running on AWS EC2 #4

• Issue 128: Access CVAT remotely via <HOST_IP>:port or <FQDN>:port? Access CVAT remotely via <HOST_IP>:port or <FQDN>:port?  #128

Solution:

The following changes did the trick for me:

1. Add following line to react_nginx.conf:
   add_header Access-Control-Allow-Origin "*";

A react_nginx.conf example would be:

server {
    root /usr/share/nginx/html;
    # Any route that doesn't have a file extension (e.g. /devices)
    
    location / {
        try_files $uri $uri/ /index.html;
        add_header Access-Control-Allow-Origin "*";
    }
}

2. To docker-compose.override.yml, add:
   
   ALLOWED_HOSTS: '*'

UI_HOST: mysite.com

REACT_APP_API_HOST: mysite.com

A docker-compose.override.yml example would be:

version: "2.3"

services:
  cvat:
    environment:
      ALLOWED_HOSTS: '*'
      UI_HOST: mysite.com
    ports:
      - "80:8080"

  cvat_ui:
    build:
          args:
            REACT_APP_API_HOST: mysite.com
            REACT_APP_API_PORT: 8080

Don't forget to run the docker build again, using -f to include the file docker-compose.override.yml file. An example of this would be:

$ docker-compose -f docker-compose.yml  -f docker-compose.override.yml build

$ docker-compose -f docker-compose.yml  -f docker-compose.override.yml up -d

3. To the cvat/settings/base.py file. In lines 188 to 200, add a version of the UI_URL without the port number to CORS_ORIGIN_WHITELIST. I believe the reason for this is that sometimes if the port number is :80 and the URL is not in the LAN (<HOST-IP>:port), but instead it is a Fully Qualified Domain Name (<FQDN>:port), the port 80 is redundant (mydomain.com:80) and the errors arise.

My modified base.py is:

# Cross-Origin Resource Sharing settings for CVAT UI
UI_SCHEME = os.environ.get('UI_SCHEME', 'http')
UI_HOST = os.environ.get('UI_HOST', 'localhost')
UI_PORT = os.environ.get('UI_PORT', '3000')
CORS_ALLOW_CREDENTIALS = True
CSRF_TRUSTED_ORIGINS = [UI_HOST]
UI_URL = '{}://{}'.format(UI_SCHEME, UI_HOST)

# UI_WITHOUT_PORT must be added to CORS_ORIGIN_WHITELIST 
UI_WITHOUT_PORT = UI_URL

if len(UI_URL):
    UI_URL += ':{}'.format(UI_PORT)

CORS_ORIGIN_WHITELIST = [UI_URL, UI_WITHOUT_PORT]
CORS_REPLACE_HTTPS_REFERER = True

[PavneshYadav123]

i am getting this error while executing this command:
docker-compose -f docker-compose.yml -f docker-compose.override.yml up -d

[pvalls]

@PavneshYadav123 the error comes from incorrect indentation of your docker-compose.override.yml

Fix the indentation of cvat_ui or copy my docker-compose.override.yml example

[PavneshYadav123]

@pvalls
i want to execute CVAT on my website
i have done following changes on

1)changes in base.py

**line no 28:**
              ALLOWED_HOSTS = os.environ.get('ALLOWED_HOSTS', 
                                    'localhost,127.0.0.1,labelytics.trantorglobal.com').split(',')
**line no 188 to 200:**
              UI_WITHOUT_PORT = UI_URL
              CORS_ORIGIN_WHITELIST = [UI_URL, UI_WITHOUT_PORT]

2)Changes in Docker-compose.yml

**added new code line no 56**
        ALLOWED_HOSTS: '*'
**line no 58** 
        UI_HOST: labelytics.trantorglobal.com
**line no 81** 
        REACT_APP_API_HOST: labelytics.trantorglobal.com

3)Changes in react_nginx.conf

added new code line no 6
add_header Access-Control-Allow-Origin "*";

if i am giving UI_HOST and REACT_APP_API_HOST as IP address insted of URL it is workig fine but it is not working on URL what should i do
I have attach all file along with server and URL
Please suggest me

[pvalls]

@PavneshYadav123 you might need to change the cvat UI port to 80 and configure services to have

ports:
      - "80:80"

You might also need to open connections to port 8080 on your server provider configuration (e.g. on AWS security group add rule to allow incoming connections to port 8080).

Finally, I suggest you ask for help on your issues in the Gitter CVAT chat

[nmanovic]

@PavneshYadav123 , did you resolve the issue?

[PavneshYadav123]

@nmanovic yes

[nmanovic]

@PavneshYadav123 , we will close the issue. Thank you.

[yxftju]

I still cannot remote access ，got an authentic error on webpage，even though I do this follow the method you metion. Any solutions?

[LukeAI]

Is using CVAT on remote machines/servers not a very common use-case? Might it be possible to patch CVAT to be able to do this without having to make so many complicated config changes? Or at least Add these instructions to the Wiki? (I'd be happy to do the latter if it would be welcome?)

[nmanovic]

@yxftju , @LukeAI , now it became more difficult just because we use different ports for UI and server. The question was answered many times in Gitter. If you still cannot access your instance remotely please create an issue and submit your config files. Otherwise it is impossible to investigate.

In the nearest future we will simplify configuration of CVAT.

[LukeAI]

@pvalls something based on your suggested modification to base.py has been merged. I think the other bits are still necessary.

[ghost]

@yxftju , @LukeAI , now it became more difficult just because we use different ports for UI and server. The question was answered many times in Gitter. If you still cannot access your instance remotely please create an issue and submit your config files. Otherwise it is impossible to investigate.

In the nearest future we will simplify configuration of CVAT.

I have seen many labelling tools and it seems to be nerds that make them incapable of making anything sensible.
Why even have an open source tool when no one can install them
I have now spent days on this tool, days on dataturks and most other tools seems to be made for coders.
If you cannot make simple tools stay away from it and keep coding in your corners.
It is not supposed to be rocket science and we should for sure not change servers, PCs and everything because you cannot make simple configuration.
This pisses me off completely and it is not even worth using any open source if you have the attitude of "we have answerred this question so many times"
Well guys, there is reason why people ask. Because you obviously cannot make it understandable for most people.
So either ditch the CVAT or make it work for normal people and not coders.

I do not know if this is because of the millenial attitude or if it is because I did hard hacking when I was younger (that is now 30 years ago) where you had to make sure things worked into the bare bones of the processor. But the annotation tool area is a complete mess. Why even use react. Rubbish and crap that only generates errors. MAde for the ones that wear the baseball cap backwards...
Or is it because it is cool... Well...

[nmanovic]

@MimirRnD , to make the life a little bit easy we created https://cvat.org/. You can use it. You don't need to install anything. Just register and upload your data.

Installation procedures were changed many times. You wrote a lot of words but nothing exactly about your problem. Be polite. The tool is free and helps a lot of people. My team spends a lot of time to delivery new features and make the product better. The best way to make the world better just help.

[ghost]

Let's just put this into a real life perspective...
I have spent almost 2 weeks of valuable time I could have spent on marketing and getting the business going.
What is the "free" worth?
Absolutely nothing!
I have burned familiy relations, spent time on fixing dysfunctional code by hiring 5 developers who none of them could understand how you had put it together.
I have spent days and nights in fixing, correcting and I still do not understand anything.

Then when we get into the tool that is then next problem.
How does it work?
Then there are formats of exporting and importing stuff. The labels we have been able to set up in a simple Labelimg software can not be imported.
Another 2 days spent on this to just import labels and to understand formats.
And that format I had was extremely advanced....
It was a list from top to bottom in a normal text file that I wanted to import. It was absolutely impossible. Also none of the "format" you are referring to does have anyn generation tools or any references. Not even in Wikipedia.
Sorry, but I do not care about if the boxes are puke green or ugly brown. I just need the bounding boxes so the ML can learn.
So a simple import list is more than enough.

If you ever are going to get off the ground. Think about the person who is going to install it. Make it workable as

1. Normal webinstallation, plug and play
2. If you do it in a docker, then make it work from both servers and PCs. Me as a data set owner I do not want to give away images I have purchased for my money.

So in essence., get out of the nerd's box, look into the user's needs. Free in your case and in many other cases is hellish expensive and the learning I have done now is to actually use a software that cost money as I can get it to work right away.

The functionality you have made are fantastic, but they are not worth anything if it is not possible to spend 10 minutes on the installation and be up and running in 1 hour.

And bear in mind, I have double master degrees, I have been doing this for soon 42 years (yes I am an old fart) and I have seen a lot and have hacked a lot of stuff, but the way the annotation industry works seems to be made for kids and people who do believe users can spend endless time, whilst they actually do not have much time for this at all. I did it because I see it as a challenge.

On the other hand I do like your software and it is very good, but do that little extra push and do not get mad on my comment. I just want you to understand how a user works.

Have a sunny day.

[nmanovic]

@MimirRnD , please send me a mail (you can find my mail address in my github profile). Let's spend sometime with me or someone from my team and see how we can improve the whole process and solve of remaining issues which affect your business.

[FrancescoSaverioZuppichini]

Agreed, impossibile to serve and connect from an host machine. Wasted tons of time.

[azhavoro]

Agreed, impossibile to serve and connect from an host machine. Wasted tons of time.

@FrancescoSaverioZuppichini Hi, please create a new issue (or start a new topic in the Discussions tab, or use gitter) and describe your problem: how do you want to configure CVAT. Any error messages, container logs will be helpful.

[smerkousdavid]

Agreed, impossibile to serve and connect from an host machine. Wasted tons of time.

@FrancescoSaverioZuppichini I have no idea what your setup it like, but I'm assuming you have access to your local machine that you're serving it on.
For the access you could try adding your WAN IP/external hostname to your /etc/hosts file like so
127.0.0.1 CVAT.example.com

Have you checked out issue #1095 to see how to change API host/port and UI host/port?

[u2ros]

I stumbled upon this today. My goal is to run cvat on local network with my colleagues with my workstation serving as the server host. After inspecting the compose file, I see it now uses django and traefik, which is actually cool. there is also a CVAT_HOST env variable which you can set when starting the compose setup, for example:

CVAT_HOST=192.168.1.55 docker-compose up -d

This made cvat available to my colleagues immediately

[nasheedyasin]

I stumbled upon this today. My goal is to run cvat on local network with my colleagues with my workstation serving as the server host. After inspecting the compose file, I see it now uses django and traefik, which is actually cool. there is also a CVAT_HOST env variable which you can set when starting the compose setup, for example:

CVAT_HOST=192.168.1.55 docker-compose up -d

This made cvat available to my colleagues immediately

This worked for me

[bkbilly]

If anyone is interested, I found a way to access CVAT from any hostname. It is very useful for me because I can now access it with the machine IP, as localhost or even as a tunnel using ngrok.

I've modified the traefik rules on the official docker-compose.yml file.
You can find the file here.

[wvalcke]

CVAT_HOST=
Is very confusing. I was struggling for one hour to get this working.
The whole problem is that anything given as (example)
CVAT_HOST=172.31.1
Will work ONLY if you instruct your browser to this IP adress. Using the hostname resolving to 172.31.1.1 will NOT work.
The same story when using a hostname like CVAT=HOST=myserver.mydomain.com
Anything given to the browser not being exactly myserver.mydomain.com DOES NOT work.
Also giving the IP adress in the browser will NOT work.

[zhanghanduo]

If anyone is interested, I found a way to access CVAT from any hostname. It is very useful for me because I can now access it with the machine IP, as localhost or even as a tunnel using ngrok.

I've modified the traefik rules on the official docker-compose.yml file. You can find the file here.

This solution works for me. Line 46 and 64 are critical.

[akamlah]

If anyone is interested, I found a way to access CVAT from any hostname. It is very useful for me because I can now access it with the machine IP, as localhost or even as a tunnel using ngrok.

I've modified the traefik rules on the official docker-compose.yml file. You can find the file here.

This worked for me as well, for self-hosting cvat behind a company proxy and making it accessible in local network.
For me export CVAT_HOST=myIP and replacing the traefik service with the configuration in the proposed solution did the trick.
This is not working yet for selverless deploy though.