Split directus url to server and client urls.
Closed this issue · 4 comments
Is your feature request related to a problem? Please describe.
Currently I'm working on creating separate dev enviroment fully runing in docker (nginx, node app, directus). When nitro server is calling directus for the initial page load it is unable to access it via domain ex. "localcms.example.com". It must use different docker container name ex. "directus". Changing it via runtimeConfig to "directus" causes redirecting to different page on client side to not work.
Unfortunatully I'm unable to set different url's for server and browser, this does not allow me to proceed with my app.
Describe the solution you'd like
In useDirectusUrl.ts I would like to add condition to check if process is running on server and based on this use either server url or client url. If server url is not provided then it uses previous url that can be setup in runtime config, so it won't be breaking change.
Describe alternatives you've considered
I've tried to setup docker and nginx to allow me to always use domain not container name. But I found it impossible to do. Same for setting different addresses in nuxt directly.
Additional context
Cannot think of anything more.
Currently I'm working on creating separate dev enviroment fully runing in docker (nginx, node app, directus).
Could you describe a bit more your current and desired deployment? How are you configuring your direcuts url? Do you have any reproduction to share?
The other nuxt-directus maintainer's could correct me and probably provide a better opinion than mine, but in the meantime I could reply in regard of Nuxt and Docker/Kubernetes:
In useDirectusUrl.ts I would like to add condition to check if process is running on server and based on this use either server url or client url. If server url is not provided then it uses previous url that can be setup in runtime config, so it won't be breaking change.
Unfortunately the process of separating server/client execution is not simple as "black" and "white". IIRC, for example, there are a number of calls during server hydration and initial state management that are made server side but passed as-is to client side, potentially breaking SSR for things like image/file urls that require authentication. Not to mention a number of deployment specific optimization that Nitro/Nuxt do for each type of environment, potentially requiring further edge cases.
I've tried to setup docker and nginx to allow me to always use domain not container name. But I found it impossible to do. Same for setting different addresses in nuxt directly.
Docker/Kubernetes on the other hand, when configured properly with reverse proxies (I imagine nginx in your case), will assign localcms.example.com as a domain for that container too (effectively acting like the container name itself). So unless the Nitro call is proxied outside your Docker stack, or worst the Docker Stack itself isn't aware of that external domain (for example using only port binding), everything should work correctly so there must be something else.
Could you describe a bit more your current and desired deployment? How are you configuring your direcuts url? Do you have any reproduction to share?
Currently I have node app running on my local machine, and every request is made via localhost and port. Also every dev that would like to start working on this project will have to setup correct node version etc. I don't like it and I would like to move whole dev enviroment to docker. I've runed into the problem where either reloading page is not working or redirecting to different page is not working.
My configuration is via .env:
NUXT_PUBLIC_DIRECTUS_URL = http://localcms.example.com (This works when I'm redirecting to different page)
NUXT_PUBLIC_DIRECTUS_URL = http://directus:8055 (This works when reloading page (Directus is container name))
I don't have any reproduction repo but I will create one. After I fail to implement it via docker config.
Not to mention a number of deployment specific optimization that Nitro/Nuxt do for each type of environment, potentially requiring further edge cases.
You are right. I didn't think of that. I will try to test it with change that is currently working for me:
Docker/Kubernetes on the other hand, when configured properly with reverse proxies (I imagine nginx in your case), will assign localcms.example.com as a domain for that container too (effectively acting like the container name itself).
I will try this.
So we are talking about a full local stack deployment for dev only right? What is nginx for then?
Since we are talking about a local Docker deployment if you are using Docker Desktop you might use the internal resolver that comes with it (you could look at it as a localhost replacement):
NUXT_PUBLIC_DIRECTUS_URL = 'http://host.docker.internal:8055'Yes, I wanted to create full local dev stack. Nignx was needed so that I don't have to install nginx on my local machine and still use domains on windows without creating some workarounds/extended config. I've tried creating container network which didn't work and assigning static ip to container to then alter hosts file in one of them is just not ideal solution, so I droped both.
This worked like a charm:
NUXT_PUBLIC_DIRECTUS_URL = 'http://host.docker.internal:8055'But I had to expose port 8055 which I didn't want to do initially but It looks like it is needed in this case. There wasn't any reason for me to not want to expose it other that just exposing less to omit feature problems.
Thanks for help! I think we can close this feature request as it is no longer needed I think.