По сути, мы генерируем файл через API, который хранится на s3, и когда я использую js, в vuejs с Laravel, если я обновляю src изображения или URL-адрес фонового изображения ИЛИ даже просто перезагружаю страницу с помощью js, location.reload (правда), я получаю блокировку CORB и 4xx ошибок и нет изображения. Но если я вручную обновляю страницу, она всегда работает.
Я пробовал несколько вещей, найденных на SO и других, но ничего не работает надежно.
Например, в моем компоненте vue это делается:
if (notification.type == '<my file ready notification>') {
setTimeout(function(){location.reload(true);}, 10000);
}
По моему мнению, это:
@if($item->file)
<div style="background-image: url('{{$item->file_url}}');">
</div>
@endif
Что работает справедливо, но должен быть лучший способ. Если я уменьшу или уменьшу тайм-аут, он будет меньше, чем меньше времени, и почти никогда не показывает изображение, если нет тайм-аута.
Я пытался получить уведомление, чтобы динамически устанавливать URL-адрес с помощью jquery или просто как: style для фона, как даже тег img: src, но снова получаю ошибки в консоли js:
Блокировка перекрестного чтения (CORB) заблокировала ответ перекрестного происхождения https://s3.us -west-2.amazonaws.com / с приложением MIME-типа / xml.
Например, у меня всегда возникает проблема с CORB, если я пытаюсь что-то вроде:
if (notification.type == 'file created notification') {
$('#fileDiv').css("background-image", "url(" + self.item.file_url + ")");
}