Hello,
I like this devilbox a lot, I have used it to develop some symfony 4 web apps, and it works like a charm.
Now I would like to use it to develop Angular applications, but I can’t make it work. You will find below the methods I have tried to make it work without luck
Here are the steps I did on my first try :
-
Launch the httpd, php, and bind container with : host> docker-compose -d httpd php bind
-
Connect to the php container with shell.bat
-
Execute command : php-container /shared/httpd> ng new my-app
-
This creates my angular app in the folder my-app
-
I followed the steps to create a reversed-proxy vhost available the documentation (adapting to angular structure) :
-
Created a virtual htdocs directory in folder my-app
-
Added reverse proxy vhost-gen config files in my-app/.devilbox directory
-
I adjusted the ports for nginx and apache in the vhost-gen files :
For nginx :vhost: | server { ... location / { proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_pass http://php:4200; } ...
For Apache 2.4 :
vhost: |
<VirtualHost __DEFAULT_VHOST__:__PORT__>
ServerName __VHOST_NAME__
Protocols __HTTP_PROTO__
...
ProxyRequests On
ProxyPreserveHost On
ProxyPass / http://php:4200/
ProxyPassReverse / http://php:4200/
-
The I created a autostart script which is available here :
# devilbox/autostart/run_angular_projects.sh ANGULAR_PROJECTS=( "/shared/httpd/my-app/angular.json", ) # Check if any projects have been defined if [ ${#ANGULAR_PROJECTS[@]} -eq 0 ]; then echo "No projects defined. Exiting." exit 0 fi for item in ${ANGULAR_PROJECTS[*]}; do ANGULAR_APP_PATH="$( dirname "${item}" )" if [ ! -d "${ANGULAR_APP_PATH}" ]; then >&2 echo "[Warning], skipping startup, directory does not exist: ${ANGULAR_APP_PATH}" continue; fi echo "=================================================================" echo "===================== LAUNCHING ANGULAR APP =====================" echo "=================================================================" echo "su -c \"cd ${ANGULAR_APP_PATH}; ng serve\" -l devilbox" cd ${ANGULAR_APP_PATH} ng serve done
-
Added the dns record in hosts file (127.0.0.1 my-app.loc)
-
Relauched the containers with :
docker-compose stop docker-compose rm -f docker-compose up -d httpd php mysql
-
2 problems here occur. The first one is the httpd server launching before php is really ready, so httpd server doesn’t work well. The second problem is when I try to access http://my-app.loc, it doesn’t work and i get a forbidden error from nginx, or a service unavailable from apache.
-
Afterwards I deactivated the automatic launch script and lauched the ng serve inside the php container. Even with this, I can’t access to the site (it should be the default angular welcome page, but i still get a forbidden from nginx, and service unavailable from apache)
-
I tried to map the 4200 port to the 4200 local port from within the php service in docker-compose.yml, but this doesn’t work also.
-
I tried to use the docker-compose.override.yml file with no more success.
-
here is for example an error log from the file my-app-error.log :
2019/05/07 22:49:42 [error] 253#253: *70 connect() failed (111: Connection refused) while connecting to upstream, client: 172.16.238.1, server: my-app.loc, request: "GET / HTTP/1.1", upstream: "http://172.16.238.10:4200/", host: "my-app.loc"
The translation to the right port is occuring, but I can’t access the site.
The autostart script works also because at the end i have the line that says listening to http://localhost:4200/ within the container.
I am now out of ideas. It would be great if you would have some suggestions or some working example of angular over devilbox.
Thank you