Why is my dockerized install to localhost returning 403 on login

divSelector

I followed the steps up to step 4 in this guide
https://docs.funkwhale.audio/administrator/installation/docker.html#set-up-your-reverse-proxy

using localhost as the hostname.

The frontend app seems to work until I try to login with the super user I created. Actually, anything put into the form will result in this in browser console

Websocket status: CLOSED index-c87f42c7.js:27:237784
XHRPOST
http://localhost:5000/api/v1/users/login
[HTTP/1.1 403 Forbidden 38ms]

So moving over to /api/admin/login if I try to login I get


Forbidden (403)
CSRF verification failed. Request aborted.
More information is available with DEBUG=True.

I'm considering installing the version targeting debian systems so that I can tinker around with setting DEBUG=True... but I thought I would ask you guys, what is going on here, does it have to do with trying to run this locally, and if so, do you have any suggestions so that I can play with locally before I commit to finding somewhere to put it online?

It might also be of note on that login page, I get this in the console

Content Security Policy: The page’s settings blocked the loading of a resource at https://localhost/staticfiles/admin/js/nav_sidebar.js (“script-src”).

I suspect the problem might have to do innately with the fact that https://localhost is not http://localhost:5000 and https is not configured for localhost, there are no certs. I could self sign if you think doing this would help.

divSelector

I got it to this point by changing FUNKWALE_PROTOCOL to http and then I completed the steps under "Override default Nginx templates"

[upl-image-preview url=https://forum.funkwhale.audio/assets/files/2023-06-06/1686090079-919047-image.png]

So I guess my new question is...

It's still not loading the style/js because

Content Security Policy: The page’s settings blocked the loading of a resource at http://localhost/staticfiles/admin/js/nav_sidebar.js (“script-src”).

If I load it with 5000 port, the js will load. If things are supposed to be redirecting to or from port 80, they are not. If I ender any localhost:80 url, it will redirect to https and fail to load.

While I am here...

I thought I would point some other things out about the docs that are not related to my question.

the urls given in the instructions are wrong

curl -L -o /srv/funkwhale/nginx/funkwhale.template "https://dev.funkwhale.audio/funkwhale/funkwhale/raw/${FUNKWHALE_VERSION}/deploy/docker.nginx.template"
curl -L -o /srv/funkwhale/nginx/funkwhale_proxy.conf "https://dev.funkwhale.audio/funkwhale/funkwhale/raw/${FUNKWHALE_VERSION}/deploy/docker.funkwhale_proxy.conf"

In this case, https://dev.funkwhale.audio/funkwhale/funkwhale/raw/1.3.0/deploy/docker.nginx.template leads to a file with this as the content: ../front/docker/funkwhale.conf.template

If you change it up to https://dev.funkwhale.audio/funkwhale/funkwhale/raw/1.3.0/front/docker/funkwhale.conf.template you can get a file that seems to make sense so I used that one.

As for https://dev.funkwhale.audio/funkwhale/funkwhale/raw/1.3.0/deploy/docker.funkwhale_proxy.conf. ... Well that is a 404, so I just went into the source code and looked for something with a name that seemed right, and ended up using https://dev.funkwhale.audio/funkwhale/funkwhale/-/raw/develop/deploy/funkwhale_proxy.conf

the filename referenced here is wrong

set -a && source /srv/funkwhale/config/.env && set +a
envsubst "`env | awk -F = '{printf \" $%s\", $$1}'`" \
   < /etc/nginx/sites-available/funkwhale.template \
   > /etc/nginx/sites-available/funkwhale.conf

Here the file in question does not exist. The correct file is /srv/funkwhale/.env. In any case, I undid everything in this step because it doesn't seem to be needed if I just use the overrides.

AMoonRabbit

Hello,
I think you're stumbling where I was stumbling. Those curl commands are for 1.2.10 if I remember correctly, or even 1.3.0-rc1. Can you try using the curl commands form the following link
https://docs.funkwhale.audio/administrator/installation/docker.html
These should be correct and provide the correct files.

Please also note the following issue re: django css issues, this is either misconfigured volume mounts or nginx
https://dev.funkwhale.audio/funkwhale/funkwhale/-/issues/2146

And yes, the last command you mentioned, you need to be aware of where you are running it and update the path /srv/funkwhale/config/ to whatever the path is for you .env file. In my setup, because I was running the above command in the funkwhale directory, I removed the path up to .env and that worked because the file was in the directory I was running the command from.

Hope this makes sense.

Edit: you may also need to check the template file that was already downloaded to the /etc/nginx/ location. If this is full of html code instead of the actual template, you will need to delete it and download it again as I found running the curl commands again didn't seem to overwrite it.

divSelector

AMoonRabbit

Thanks for the response!

The link you gave me is the page with instructions I've been following.

The curl commands pull the version from an environment variable which in this case is 1.3.0 so they just don't work (at least not at that version number) without digging a little in the source for a path that does work.

In any event,
The link to the issue may be something; that does look like it could be a similar problem...

But let me reiterate that the staticfiles files are being served. For example

http://localhost:5000/staticfiles/admin/js/admin/RelatedObjectLookups.js

The javascript loads.

But as you can see, the page is looking for the static files at http://localhost (without a port number)

[upl-image-preview url=https://forum.funkwhale.audio/assets/files/2023-06-06/1686093984-933466-image.png]

I'm thinking that 80 is supposed to direct to 5000 and its not. I'm not sure why.

AMoonRabbit

divSelector do I assume correctly that as you are trying to access this via hostname instead of a domain/subdomain that you do not have reverse proxy setup?

The nginx container (funkwhale-front-1) will listen on port 5000 and forward to api (I think). Assuming you have also left the protocol as http in the .env file, what you might need to do is configure the following in the docker-compose.yml file, towards the bottom there is a section ports:
Change the line - "${FUNKWHALE_API_IP}:${FUNKWHALE_API_PORT]:80 to just :${FUNKWHALE_API_PORT}:80

Down your instance and bring it back up. I'm not 100% but it's worth a try.

Will you be using a domain in the future though?

divSelector

At this time I don't really know what my intentions are. I'm not an experienced admin, I don't know a lot about hosting services, I'm not sure how much it will cost, and so I'm wanting to see how it goes running it locally and if I want to invest in putting in online.

I do have some experience with python, Django, and web development but not professionally. The gap in my knowledge is the part where you run it on a production server, so I believe I most likely do not have the reverse proxy set up correctly.

$ curl http://localhost
curl: (7) Failed to connect to localhost port 80 after 0 ms: Connection refused

The app is working on port 5000 though. I think I'm going to go back over the instructions for setting up nginx and make sure i've done everything correctly.

divSelector

Alright so I would like to say thank you for your direction. While you didn't give me the answer you did clue me in on to what part I had not done correctly.

I went back and set up the /etc/nginx conf files. Then I generated a self signed localhost cert and inserted those certs into the places where it expects certs from letsenscrypt. Problem solved 🙂

AMoonRabbit

The following was typed out before seeing the latest update 🥴 :
you might fair better using the hostname of the server hosting Funkwhale. And maybe setting up your reverse proxy server blocks to use that instead of the domain. Or, you can setup funkwhale with the intended url you want to use for it, and setup local DNS records/modify the host records to return the host server's IP when going to that url?

In the .env I see you have used localhost for FUNKWHALE_HOST variable. I would think it might be safer to set something else here like the actual url you want to use and set as per above, or the hostname with domain (hostname.domain) of the server it's on. May help.

Edit: Seen your update, glad you got it sorted.

divSelector

AMoonRabbit yeah, I think when there is a url to use, I will completely redo this without doing hacks to run it locally... but right now there is no host, there is no domain, there's no staticfile hosting, the only url is 127.0.0.1 haha. I would like to think that once I'm confident I can get it to work that I will be able to figure out how and if I can afford to pay for those things. But for now, yeah.

So, the reverse proxy is working now but the admin CSS thing is still an issue. I assumed they were related problems but they're not. The issue you posted probably has a solution somewhere in there.

AMoonRabbit

divSelector Cool, I will say that as you have set it up as it is at the moment, you may have to do a migration when it comes to deploying it with a url. Funkwhale doesn't like URL changes afaik, and I am not sure that has changed. It usually means setting up another server with the desired URL, and migrating data across via database export/import. Something to look forward to.

divSelector

AMoonRabbit haha most likely I will just start from scratch. It won't be too much of a problem because I won't have generated any important user data yet. It would be much easier to just start over, considering this a test run.

divSelector

BTW, if you were curious, I got the CSS and JS to load by adding a couple http://localhosts in the add_header directive of the 443 server block of funkwhale.conf

add_header Content-Security-Policy "default-src 'self'; script-src 'self' http://localhost; style-src 'self' http://localhost  'unsafe-inline'; img-src 'self' data:; font-src 'self' data:; object-src 'none'; media-src 'self' data:"