У меня есть веб-страница, на которой есть несколько небольших видео (размером менее 1 МБ) ниже сгиба, который я загружаю. Он отлично работает в Firefox и Chrome. Но в Safari это не получается.
В консоли Safari я не вижу сообщений об ошибках. На стороне сервера (node.js) я вижу, что видеофайлы были успешно переданы.
------- HTML-код. ------
<video controls preload="none" width="230" poster="../assets/placeholder.jpg" class="videoCenteredInSection lazy">
<source data-src="../assets/All-In-One.mp4" type="video/mp4">
</video>
У Safari также были проблемы с LazyLoading с использованием IntersectionObserver, так что в качестве запасного варианта я просто назначаю video.src в качестве значения из data-src, и я вижу, что он работает, потому что получен запрос на правильные видеофайлы сервером узлов, и файлы передаются в Safari.
------ код node.js ---
res.writeHead(200, {'Content-Type': 'video/mp4' });
let fileContents = fs.readFileSync(fileToSend);
res.end(fileContents, 'utf-8');
Я пробовал с и без 'utf-8', без разницы. Работает в других браузерах, но не в Safari.
Я вижу некоторые сообщения, в которых говорится, что мне нужна поддержка заголовков диапазонов, но я не понимаю, как это могло бы помочь, потому что файлы очень маленькие, а также, когда я нажимаю кнопку воспроизведения на видео, я не вижу ни одного запроса на мой сервер. Я также не вижу никаких журналов / ошибок в консоли браузера.
Пожалуйста, совет, как решить эту проблему.