Uploads over SSL stuck at 0% using nginx reverse proxy, works fine with HTTP

Community Support
1

I’ve installed the latest RocketChat on an Ubuntu 19.04 server and am using filesystem storage for uploads. Everything works fine when connecting to the site in the clear (i.e. via port 3000). I have Nginx set up as a reverse proxy per the instructions at https://rocket.chat/docs/installation/manual-installation/configuring-ssl-reverse-proxy/ . When accessing the site via SSL, everything seems to work except file uploads, which stick at 0%.

Oddly, I can upload from the mobile app, but not see any of the images uploaded. By contrast, uploads from the web browser (Firefox) are stuck at 0%, but I can see previously uploads in the channel.

I’ve found some forum postings suggesting I need to add the following to my Nginx configuration, which otherwise matches the Rocketchat documentation exactly (other than replacing your_hostname.com with my domain name):

location /file-upload/ {
proxy_pass http://127.0.0.1:3000/file-upload/;
}

This does not fix the upload problem, however.

I also note the documentation states:

Note: You must use the outside https address for the value at ROOT_URL in [[Section 3 Deploy-Rocket.Chat-without-docker#3-download-rocketchat]] above. This includes the https:// and leave off the port number. So instead of ROOT_URL=http://localhost:3000 use something like https://your_hostname.com

However, when I make this change to the Rocketchat server, Nginx gives an error that the site cannot be found. ROOT_URL=http://mysite.com/ PORT=3000 works fine; ROOT_URL=https://mysite.com gives an Nginx error.

Any suggestions for how to troubleshoot? This seems to be a common problem based on other forum postings.

2

I think I see the problem now. When uploading from browser, I get this error in the console:

Blocked loading mixed active content “http://[mysite.com]:3000/ufs/FileSystem:Uploads/BYtfMH4Z6G7GykNkN?token=D87b5AE8CA&progress=0.22678699961242457” 5 ba77dee8bac2314ed1cb402c93013d2f89668bba.js:187:31849

So it appears the browser is blocking the upload because the page itself is a secure page but the upload link is insecure.

If I set ROOT_URL=https://mysite.com/, however, RocketChat no longer listens on port 3000 and thus Ngnix is unable to reverse proxy to it.

If I set ROOT_URL=http://mysite.com PORT=3000, RocketChat listens on port 3000 and the reverse proxy works, but it appears that RocketChat then gives an insecure URL for file uploads, which is then blocked by most browsers (but apparently not the RocketChat mobile app).

Can anyone suggest a fix/workaround?

3

Solved!

Setting ROOT_URL=https://mysite.com/ failed, because RocketChat would no longer listen on Port 3000.

Setting ROOT_URL=http://mysite.com:3000, and then setting “Site URL” in Administration–>Settings—>General to https://mysite.com fixed the problem. RocketChat still listens on Port 3000 locally, but the file upload URL is now https:// and thus the browser does not reject it as mixed active content.

Various forms of this problem seem to be common, based on other forum posts. Should this be better documented somewhere? Perhaps in the standard instructions for how to configure Nginx as a reverse proxy?