Tengo una aplicación angular en mi propio dominio, que muestra imágenes del almacenamiento de Google como esta:

 <img src="googleUrl..."/>

El Cache-Control predeterminado está configurado en 3600 segundos , lo cual es demasiado bajo para mí, porque quiero almacenar en caché las imágenes durante 1 semana (las imágenes en el almacenamiento cambian muy raramente).

Intenté crear un HttpInterceptor pero no intercepta la solicitud que hace el src de la img.

También traté de crear una canalización y configurar un encabezado Cache-Control pero, como el servidor es Google, me da un error Cross-Origin . Así es como lo implementé:

 @Pipe({ name: 'cacheResource', }) export class CacheResourcePipe implements PipeTransform { constructor(private http: HttpClient, private sanitizer: DomSanitizer) {} transform(url): Observable<SafeUrl> { const headers = new HttpHeaders({ 'Cache-Control': 'public, max-age=2.592.000', }); return this.http .get(url, { headers, responseType: 'blob', }) .pipe(map((val) => URL.createObjectURL(val))); } }

Y luego llamado así:

 <img [src]="'googleUrl.com' | cacheResource | async" />

(El enfoque de tubería funciona con archivos almacenados en el mismo dominio, pero no tengo esta posibilidad)

¿Hay alguna forma de lograr el caché largo que necesito sin cambiar el servidor?