Frontend displays a blank page after setting up with Docker #1732
Labels
No Label
dependencies
duplicate
help wanted
invalid
kind/bug
kind/feature
needs reproduction
question
security
wontfix
No Milestone
No Assignees
2 Participants
Notifications
Due Date
No due date set.
Dependencies
No dependencies set.
Reference: vikunja/vikunja#1732
Loading…
Reference in New Issue
Block a user
No description provided.
Delete Branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
I attempted to set up Vikunja based off of the Full Docker Example in your documentation, adapting it for my needs. Logs indicate the database migrations were applied successfully, and I can access the api docs at
tasks.mydomain.tld/api/v1/docs
. I can navigate to the frontend and based on the source inspector and network tabs in Firefox devtools it appears to receive the front page (I can see the blank div that should be containing the Vue stuff), but it doesn't seem to be communicating with the api properly, resulting in a blank page.Docker Compose file
Caddyfile
There seems to be an issue with your reverse proxy configuration since it does not seem to be able to load the assets (look at the size):
curl
indicates there's always an empty response from caddy:Even for nonexisting paths:
API paths seem to work though:
Your docker-compose file seems to be correct though, so I guess the caddy configuration is to blame here. Unfortunately I don't know much about caddy to be much helpful here.
Since we're getting the html from the index page of the frontend, caddy is able to reach the container at all (That would've been something I'd look for). But other than that, I'm afraid I can't help you with the caddy part.
Ah OK, the whole "not loading assets" thing gave me a better hint of what could actually be happening. If I change the handle directives in Caddy to the following:
Basically the /css wasn't getting handled by anything, just /, changing the match string to /* allowed that handle tag to match anything (other than /api/*, which gets grabbed by the first handle directive). When I change it to that I get to a login screen. However, when I try to register, I just get a blank red box, which looks like there should be an error but no text. The javascript console then just says "uncaught exception: undefined" I'll investigate more on my end in the meantime, but do you have any potential clues?
EDIT: Just thought to check the Network tab in dev tools, attempting to register gets me a 502, so I guess its definitely Caddy again... As a side note, is your documentation in a repo somewhere? If I ever get this figured out it might be useful to add a Caddy v2 section.
Huh if its caddy again...
The docs are in the api repo.
Okay so it seems like there's a bug in the api regarding registration which causes the api to crash when attemting to register - hence the 502.
I've pushed a fix for that in
5283f006f5
, please update and try again. It was a frontend bug after all.Deleted my earlier message, forgot to run
docker-compose pull
first...It works! I'm going to see about a pull request for the docs to append a Caddy configuration to the Full Docker example, in case anyone sees this before then, my Caddy configuration ended up being even simpler, didn't actually need the
handle
directives at all.A PR would be awesome!
Glad it works for you now.
I'll look into it as soon as I have time. Thanks for being the rubber ducky for my Caddy config and fixing the frontend bug we found! I'll go ahead and close this since its resolved.