Diferencias

Muestra las diferencias entre dos versiones de la página.

--- ada:howto:sicoferp:factory:new-migracion-sicoferp:front:limpieza-cache-condicionado [2025/02/03 14:42]
192.168.175.156
+++ ada:howto:sicoferp:factory:new-migracion-sicoferp:front:limpieza-cache-condicionado [2025/04/22 17:02] (actual)
192.168.175.227
@@ Línea 1: / Línea 1: @@
-====== Configuración del Proyecto Angular con Despliegue Continuo y Docker ======
+====== Configuración del Proyecto Angular: evitar caché en el cliente en cada despliegue ======
 === Requerimientos de Configuración del Proyecto ===
-El proyecto de Angular debe tener configurado el despliegue continuo con Docker.
+El proyecto de Angular debe tener configurado el despliegue continuo con  jenkins y Docker.
-Primeros Pasos ===
+Primeros Pasos
-. Modificación del Dockerfile para la Construcción del Proyecto Ubicar el archivo Dockerfile y agregar la opción --output-hashing=all en la misma línea donde se ejecuta la construcción del build del proyecto.
+. Modificación del Dockerfile de la construcción del Proyecto: Ubicar el archivo Dockerfile y agregar la opción --output-hashing=all en la misma línea donde se ejecuta la construcción del proyecto. este tag lo que hace es que en el compilado del proyecto sus archivos cambian de nombre, por un hash único.
 Nuestra línea de código debería quedar así:
+<code>
- ''RUN npm run build:${TYPE} --output-hashing=all ''
+ RUN npm run build:${TYPE} --output-hashing=all
+</code>
 . Creación del Script para Renombrar index.html: Crear un archivo de Node.js llamado `rename_index_html.js`, que se encargue de renombrar el index.html con un nombre basado en un timestamp.
@@ Línea 19: / Línea 19: @@
 Código del archivo rename_index_html.js (guardar en la raíz del proyecto):
+<code>
-''const fs = require('fs');
+const fs = require('fs');
 const path = require('path');
-// Ruta del archivo generado en `dist/`
+const distPath = path.join(__dirname, 'dist', 'nombreProyectoAngular', 'browser');
-const distPath = path.join(__dirname, 'dist', 'nombreProyectoAngular', 'browser'); // Cambia 'nombreProyectoAngular'
 const indexPath = path.join(distPath, 'index.html');
-// Generar un timestamp único para el nombre
 const timestamp = Date.now();
 const newIndexName = `index.${timestamp}.html`;
 const newIndexPath = path.join(distPath, newIndexName);
-// Renombrar el archivo
 fs.renameSync(indexPath, newIndexPath);
-console.log(`Renamed index.html to ${newIndexName}`);''
+</code>
+**Importante: asignar en el path.join el nombre de proyecto de angular**
-. Agregar la Ejecución del Script en el Dockerfile ====Después de la línea que construye el proyecto en el archivo Dockerfile, agregar la ejecución del script para renombrar el index.html:
+. Agregar la Ejecución del Script en el Dockerfile después de la línea que construye el proyecto en el archivo Dockerfile, agregar la ejecución del script para renombrar el index.html:
-''RUN node rename_index_html.js''
+<code>
+RUN node rename_index_html.js
+</code>
+. Como cuarto paso se deberá confirgurar eliminar el index.html por defecto de nginx, después de la linea
+<code>
+FROM nginx:alpine
+</code>
+Se agrega la siguiente linea
+<code>
+RUN rm -rf usr/share/nginx/html/*
+</code>
 . Ajuste de Nginx en el Dockerfile En el mismo archivo Dockerfile, después de la línea:
-''COPY default.conf /etc/nginx/conf.d/default.conf''
+<code>
+COPY default.conf /etc/nginx/conf.d/default.conf
+</code>
 Agregar el siguiente código para que Nginx sirva el archivo index.html sin importar su nombre:
-''RUN HTML_FILE=$(find /usr/share/nginx/html -type f -name "index*.html" | head -n 1 | xargs -I {} basename {}) &&\
+<code>
+RUN HTML_FILE=$(find /usr/share/nginx/html -type f -name "index*.html" | head -n 1 | xargs -I {} basename {}) &&\
     echo "Encontrado: $HTML_FILE" && \
-    sed -i "s/index\.html/$HTML_FILE/g" /etc/nginx/conf.d/default.conf''
+    sed -i "s/index\.html/$HTML_FILE/g" /etc/nginx/conf.d/default.conf
+</code>
 Este comando encuentra el archivo index.html generado por Angular, captura su nombre dinámico y lo reemplaza en la configuración de Nginx.
-Estos son los cuatro pasos necesarios para evitar que el navegador del cliente almacene en caché el index.html y garantizar que siempre tome la versión más reciente del servidor en cada despliegue.
+Estos son los quintos pasos necesarios para evitar que el navegador del cliente almacene en caché el index.html y garantizar que siempre tome la versión más reciente del servidor en cada despliegue.
 Por último, el archivo Dockerfile debería verse similar a la siguiente imagen:
 {{:ada:howto:sicoferp:factory:new-migracion-sicoferp:front:captura_de_pantalla_2025-02-03_093019.png?400|}}
+[[ada:howto:sicoferp:factory:new-migracion-sicoferp:front|←Regresar]]

Wiki

Herramientas de usuario

Herramientas del sitio

Diferencias

Herramientas de la página