Al igual que otros 502 Bad Gateway durante la implementación en GAE , también tengo el mismo problema 502 Bad Gateway, pero esta vez implementando una aplicación angular a través de Dockerfile en GAE.
Aquí está mi aplicación.yaml
service: app-name runtime: custom env: flex automatic_scaling: min_num_instances: 1Este es el DockerFile
FROM node:10-alpine as buildContainer WORKDIR /app COPY ./package.json ./package-lock.json /app/ RUN npm install RUN npm install -g @angular/cli@7.3.9 COPY . /app # Expose the port the app runs in EXPOSE 8080 # Serve the app CMD ng serve --host 0.0.0.0 --port 8080 --disable-host-check COPY nginx.conf /etc/nginx/nginx.confIntenté lo anterior, con y sin --disable-host-check. Aunque realmente no entiendo lo que debería ser
Todas las búsquedas anteriores en SO señalaron que el archivo nginx.conf era el culpable, así que copié exactamente el archivo nginx de los documentos de GAE para tiempos de ejecución personalizados
entonces nginx.conf es
events { worker_connections 768; } http { sendfile on; tcp_nopush on; tcp_nodelay on; keepalive_timeout 65; types_hash_max_size 2048; include /etc/nginx/mime.types; default_type application/octet-stream; # Logs will appear on the Google Developer's Console when logged to this # directory. access_log /var/log/app_engine/app.log; error_log /var/log/app_engine/app.log; gzip on; gzip_disable "msie6"; server { # Google App Engine expects the runtime to serve HTTP traffic from # port 8080. listen 8080; root /usr/share/nginx/www; index index.html index.htm; }}
Por supuesto, la compilación y la aplicación de Docker funcionan bien cuando se implementan desde localhost.
¿Cómo se supone que se implementa una aplicación web angular con Docker?
Okey, tienes varios problemas:
1- Nunca debes usar "ng-serve" para producción
2- Primero debe compilar su aplicación y obtener el dist forlder
3- Inicie nginx después de configurar la configuración
Primero debe compilar su aplicación usando ng build --prod y configurar la configuración de su ventana acoplable para la compilación.
Ejemplo de Dockerfile para una aplicación angular:
FROM nginx:1.15.12-alpine # Removing nginx default page. RUN rm -rf /usr/share/nginx/html/* # Copying nginx configuration. COPY /nginx/nginx.conf /etc/nginx/conf.d/default.conf # Copying source into web server root. COPY /dist /usr/share/nginx/html # Exposing ports. EXPOSE 80 # Starting server. CMD ["nginx", "-g", "daemon off;"]Ejemplo de configuración de nginx:
server { listen 80; location / { root /usr/share/nginx/html; index index.html index.htm; try_files $uri $uri/ /index.html =404; } }Debe comprender que la creación de la aplicación Angular nos proporciona una carpeta llamada "dist" que contiene el archivo .html y varios archivos .js. Es ese archivo .html el que recibe nginx.
El ng serve se usa solo para desarrollo.
Espero eso ayude. Buena suerte !