Как кэшировать изображения хранилища Firebase для PWA на хостинге Firebase

Question

Идея состоит в том, чтобы разрешить зарегистрированным пользователям загружать свои собственные изображения профиля и использовать эффективное кэширование для изображений профиля, действительных для всех посетителей (не только зарегистрированных).

У меня есть PWA, который размещен вне облака Googleно управляет своими пользователями через firebase и хранит изображения с помощью firebase-storage.Кажется хорошей идеей также использовать firebase-хостинг на настраиваемом поддомене, который должен использоваться как менеджер прокси / доступа и т. Д. Для доступа к firebase-хранилищу (которое, в свою очередь, может быть дополнительно кэшировано через Cloudflare - необязательно).

По сути, мы оказались (частный хостинг: на основном домене) и (хостинг firebase: на поддомене).Как мы можем управлять тем, кто вошел в главное приложение на поддомен, не передавая метаданные, которые могли бы повлиять на кэширование, которое мы стремимся получить от поддомен?

На этом этапе Я едва знаю, как firebase управляет своими сессиями .Будем очень благодарны за любые идеи!

PWA информируется о входе / выходе пользователя через события JS:

firebase.auth().onAuthStateChanged((user) => {
    if (user) {
        //user is logged in
    } else {
        //user is logged out
    }
}

Я проверил несколько вопросов здесь, таких как: Кэшизображения, полученные из Firebase Storage в приложении PWA Установка кэша для файлов в Firebase Storage Хранение Firebase downloadURL структура файла Как кэшировать загруженные изображения из хранилища Firebase

Чтобы загрузить изображение (с частного хостинга) в firebase-хранилище с помощью JS, мы можем использовать:

<progress value="0" max="100" id="uploader">0%</progress><br />
<input type="file" id="photo" />
<script>
var uploader = document.getElementById('uploader');
var fileButton = document.getElementById('photo');
fileButton.addEventListener('change', function(e) {
    var user = firebase.auth().currentUser;
    var ref = firebase.storage().ref();
    var file = e.target.files[0];
    var name = (user.uid+'/1');
    var metadata = {
        'contentType': file.type,
        'cacheControl': 'private, max-age=15552000'
    };
    var task = ref.child(name).put(file, metadata);
    task.on('state_changed', 
        function progress(snapshot) {
            var percentage = (snapshot.bytesTransferred / snapshot.totalBytes) * 100;
            uploader.value = percentage;
        },
        function error(err) {
            console.log(err);
        },
        function complete() {
            console.log('all done');
        }
    );
    task
    .then(snapshot => snapshot.ref.getDownloadURL())
    .then((url) => {
        console.log(url); //this "url" is to be saved on the profile for the authenticated user and used from within the firebase hosting
    })
    .catch(console.error);
});
</script>

В основном, когда изображение сохраняется в firebase-хранилище, мы можем сохранить URL-адрес"для профиля пользователя.Мы хотим использовать Firebase-хостинг для обработки сохранения в FireBase-хранилище (так как было бы здорово добавить обрезку и другие манипуляции с изображениями перед сохранением в FireBase-хранилище, поэтому я считаю, что мы должны иметь возможность обмениваться данными сеанса).Как только изображение будет сохранено в firebase-storage, я бы хотел реализовать кэширование через firebase-hosting.