spotDL / web-ui

wip
MIT License
20 stars 15 forks source link

Port 8800 getting hardcoded #13

Open snydergd opened 1 month ago

snydergd commented 1 month ago

Related to https://github.com/spotDL/spotify-downloader/issues/2035

It seems that port 8800 is ending up being hard-coded in the javascript somehow. You can see this if you search for "8800" in https://github.com/spotDL/web-ui/blob/master/dist/assets/index-CGxZV3ZT.js

This results in the UI not being able to contact the API if they are served on a port beisdes 8800 (e.g., docker setups or behind a reverse proxy like in my case).

It seems like that chunk of code matches with this config, but I'm not sure how that's turning into 8800 -- maybe vite is doing some smarts to transform this?: https://github.com/spotDL/web-ui/blob/master/src/config.js

I tried to look a little at why vite might do this, but didn't find much.

snydergd commented 1 month ago

I did find this in the vite documentation -- so it seems like maybe that define for process.env might be what's causing the values to be statically replaced. It's kind of interesting that it finds the values, though. Evidently it just strips out the whole expression and replaces it statically?

In library mode, all import.meta.env.* usage are statically replaced when building for production. However, process.env.* usage are not, so that consumers of your library can dynamically change it. If this is undesirable, you can use define: { 'process.env.NODE_ENV': '"production"' } for example to statically replace them, or use esm-env for better compatibility with bundlers and runtimes.

FaNt4zMa commented 3 weeks ago

Thanks for you research! Hopefully they can fix/revert this in the next update as I also use it behind a reverse proxy...

jspiers commented 3 weeks ago

It looks like maybe this has been fixed in the dev branch? https://github.com/spotDL/spotify-downloader/issues/2035#issuecomment-2166849913

snydergd commented 3 weeks ago

@jspiers you could be right, but it looks like master was updated to use vite version 5.x about 4 months ago (package.json) but dev has only been updated to a 4.x version, which makes me think maybe the issue has only ever existed in master. I'm no expert with vite, though, and still don't understand exactly how the value gets hardcoded, so it's hard to say for sure without playing with the project a bit.

jspiers commented 3 weeks ago

Ah ok. I never actually looked into the differences between dev and master... all I know is that my docker/traefik spotdl setup only works when I use the dev version of the web-ui (i.e. v4.2.0 docker image). I was hopeful dev was ahead of master in this respect, but if it's using an older version of vite then I guess not. I know nothing about vite myself.

snydergd commented 1 day ago

I brought down the project and built it and the resulting minified javascript is almost identical to the one checked in, except that a few identifiers are different (just that minification decided on names differently for some reason, I think) and that the port is hard-coded.

@phcreery - seems like something was different for the build that produced the file in dist/ (just tagging you because your user is on the commit). Am wondering if just cleaning the project and rebuilding would produce the same results for you, or if maybe there is a certain way the project should be built that I'm not doing (I'm just running npm run build). What do you think?