0
150
Viewscloudfront apunta a la versión anterior de React alojada en s3
Implementé mi aplicación React en s3 . Estoy usando Cloudfront para usar un certificado y llegar a mi s3 bucket a través de HTTPS . Después de luchar para configurarlo todo, logré configurarlo todo, ahora funciona bien.
Ahora actualicé mi proyecto, creé una nueva versión de bundle.js , lo subí a s3 .
Mi problema ahora es que mydomain.com apunta a la V1 de bundle.js
Entonces, traté de desenterrar un poco más, y esto es lo que encontré:
-
mydomain.comapunta a V1 -
xxxxx.cloudfront.netapunta a V1 -
mydomain.com.s3-website-eu-west-1.amazonaws.comapunta a V2
Entonces, supongo que, por alguna razón, el frente de la cloudfront apunta al V1, pero ¿por qué? ¿Hay algún caché en algún lugar allí?
Aquí está la configuración, en caso de que ayude:
-
Route53Type Aapunta axxxxxx.cloudfront.net - el dominio de
cloudfrontesxxxxxx.cloudfront.net - Los CNAME
www.mydomain.coma laCNAMESsonmydomain.comycloudfront - el nombre de dominio de origen
cloudfrontorigin domain name and pathesmydomain.com.s3-website-eu-west-1.amazonaws.com -
s3 bucketesmydomain.com
PD: solo para verificar que el problema no solo provenía de bundle.js , eliminé la imagen de fondo del depósito, pero de alguna manera, todavía se encuentra y se usa al acceder a mydomain.com (así que muestra el V1)
3 answers
Answer question0
Como confirmó @Joe Clay, Cloudfront estaba almacenando todo en caché.
Para forzar el borrado del caché usando la AWS console (en algunos documentos encontré que se puede hacer usando su API ), estos son los pasos que seguí:
- iniciar sesión en la
AWS console - vaya a
Cloudfronty vea los detalles de su distribución - vaya a la pestaña de
invalidationsy haga clic enCreate invalidation - poner en la ruta del objeto
*y guardar - (Tomó alrededor de 5 buenos minutos para completar)
- Actualice el sitio web
mydomain.com(es posible que deba limpiar el caché del navegador) - y voilá !
¡Espero que esta respuesta pueda ayudar a cualquiera que tenga el mismo problema!
0
Sé que esta es una vieja pregunta. Pero encontré una manera de automatizar este proceso usando mi secuencia de comandos de implementación. Aquí hay una entrada de mi archivo package.json
"deploy": "npm run build && aws s3 sync --delete build/ s3://bucket-name && npm run invalidateCache", "invalidateCache": "aws cloudfront create-invalidation --distribution-id E23232323 --paths '/*'", Después de esto, todo lo que tiene que hacer es ejecutar npm run deploy .
Explicación de los comandos.
- deployment : Esto crea una nueva compilación para mi aplicación de reacción. Luego, elimina todos los archivos antiguos de mi depósito s3 y carga archivos nuevos. Después de eso, ejecuta mi comando invalidateCache
- invalidateCache : esto crea una nueva invalidación en mi distribución frente a la nube. Debe proporcionar la identificación de distribución que puede encontrar en la imagen a continuación. Lo último es el camino. Ingresé
/*para que borre el caché de todas las rutas.
Espero que esto ayude :)
0
Sé que esta es una vieja pregunta. Esto también se puede lograr con lambda fn, que invalidará la memoria caché de la nube para cualquier actualización en el depósito s3 de origen de origen.
- Cree una función lambda que se activa para cualquier actualización en los archivos de depósito source s3.
- En la parte del código lambda, escriba un código para invalidar la caché frente a la nube.
El fragmento de código está aquí para lo mismo.
from __future__ import print_function import boto3 import time def lambda_handler(event, context): path = [] for items in event["Records"]: if items["s3"]["object"]["key"] == "index.html": path.append("/") else: path.append("/" + items["s3"]["object"]["key"]) print(path) client = boto3.client('cloudfront') invalidation = client.create_invalidation(DistributionId='cloudfrontdistribution id', InvalidationBatch={ 'Paths': { 'Quantity': 1, 'Items': path }, 'CallerReference': str(time.time()) })