Проблема с воспроизведением видео в Safari на iOS и macOS

Всем привет,

Мы столкнулись с проблемой в версии 3.6.0.beta3-latest: у пользователей iPhone и Safari на macOS при попытке воспроизвести загруженное видео в формате .mp4 (H.264) бесконечно крутится индикатор загрузки. Эти же видео воспроизводились без проблем до недавнего времени (я не уверен, какая была последняя версия Discourse, когда они работали).

Похоже, что Safari отправляет GET-запрос для получения первых байтов (Range: bytes=0-1) видео (например, /uploads/default/original/1X/44395933ccadf546b1b1ce65b742e24f900b33fa.mp4). Ответ приходит со статусом 200, но запрос завершается неудачей по причинам, которые не отображаются в консоли JavaScript или инспекторе сети (просто подсвечивается красным, без сообщений об ошибках). Если открыть тот же URL напрямую в браузере, видео успешно загружается целиком и воспроизводится.

В Firefox и Chrome на macOS проблем с воспроизведением видео нет. Браузеры на Android также, похоже, не испытывают трудностей.

Видео небольшие (около 10 МБ). Мы не используем S3 для загрузки файлов.

Может ли кто-то подтвердить эту проблему или, наоборот, сказать, что у них всё работает нормально на iPhone/Safari? Есть ли какие-то дополнительные диагностические шаги, которые я могу выполнить, чтобы пролить свет на эту ситуацию?

4 лайка

У меня возникла аналогичная проблема с моим форумом, но тестирование тех же файлов здесь работает нормально. Затронуты только пользователи iOS/Safari. Некоторые видео в контейнере WEBM воспроизводятся, но большинство файлов mp4, mov и т. д. — нет.

2 лайка

Привет, я недавно столкнулся с проблемами и оставил комментарий в теме, созданной @tsk, которая была удалена из списка. Я исходил из предположения, что проблема связана с видео, закодированными в форматах mp4/av1, так как видео webm/vp9 воспроизводились на нашем форуме, но теперь начинает казаться, что проблема у пользователей Safari гораздо шире.

Просто ради интереса я проверил, что у меня установлена последняя версия, хотя в коммитах я не увидел ничего, что указывало бы на то, что это затрагивает пользователей Apple.

Моя конфигурация использует локальное хранилище для загрузки файлов. Большинство тем закрыты для пользователей с определенным уровнем доверия, но мы проводим тестирование в публичной категории здесь:

https://forum.pixelspace.xyz/t/safari-playback/1516

Можете ли вы предоставить ссылку на это видео или загрузить его сюда?

1 лайк

@Les79 Я загрузил это видео в оба форума в качестве теста.

Можете ли вы подтвердить, что видео из темы о воспроизведении в Safari в pixelspace не работает у вас, а это здесь работает?

1 лайк

Да, видео, опубликованное здесь, работает в Safari как на моём iPhone 13, так и на MacBook Pro M3. Оно не работает на форуме PixelSpace.

2 лайка

Это видео в формате H.264 в контейнере MP4, оно должно воспроизводиться во всех браузерах, поддерживающих Discourse. Поскольку оно работает здесь, но не на вашем экземпляре, я подозреваю, что там что-то настроено неправильно.

Вы используете дополнительный обратный прокси поверх Discourse? Я заметил некоторые заголовки на этом экземпляре, которых нет в стандартных установках, поэтому мне интересно, что именно было сделано.

1 лайк

Я вижу то же самое.

Я использую этот контейнер как обратный прокси: https://nginxproxymanager.com/

Я предполагал, что это может быть частично причиной, но конфигурация не менялась, и это новая проблема в версии 3.6.0-beta2, насколько я мог определить. После пересборки я начал получать жалобы от пользователей Apple. Подобно @mandyk, я не помню, на какой версии мы работали ранее.

Есть ли в Discourse какая-то конкретная настройка, которую мне стоит проверить?

1 лайк

Проблема не в самом Discourse, а в прокси-сервере.

К сожалению, невозможно охватить все бесконечные варианты конфигураций, когда пользователи добавляют что-то поверх Discourse. Именно поэтому мы поставляем продукт с проверенной конфигурацией по умолчанию для стандартной установки, включающей настроенный обратный прокси-сервер для Discourse.

Возможно, не хватает одного блока конфигурации nginx, но вам придётся самостоятельно разобраться в этом.

2 лайка

Также подтверждаю, что видео, размещённое в этой теме, нормально воспроизводится в Safari.

Не уверен, что это имеет отношение к делу, но я заметил одно отличие: видео в этой теме раздается через S3. Когда Safari делает первый запрос диапазона, S3 отвечает кодом HTTP 206, что кажется правильным. И экземпляр Pixelspace, и мой экземпляр не используют S3, и, похоже, Discourse отвечает кодом HTTP 200 (что кажется неправильным, поскольку запрос включает заголовок Range: bytes=0-1).

Я загрузил то же видео на свой тестовый экземпляр по адресу

https://discourse-on-a-pi5.falco.dev/t/test-safari-bug/25?u=falco

Подтверждено, что видео на discourse-on-a-pi5.falco.dev у меня в Safari не работает. Опять же, я вижу, что запрос видео возвращает 200 вместо 206.

Редактирование: Кроме того, кажется, что ответ пытается вернуть всё видео, хотя было указано Range: bytes=0-1. Я подозреваю, что запросы по диапазону игнорируются, и Safari чувствителен к этому.

Дополнительное редактирование: Это, вероятно, означает, что эффективный поиск по большим видео не работает и для других браузеров, не только Safari, так как им нужно загрузить всё видео перед тем, как можно будет осуществлять поиск.

3 лайка

Воспроизведение не работает в Safari у меня

А на Test Safari Bug - Discourse оно работает, верно?

Да, этот работает! И я вижу там HTTP 206.

1 лайк

Похоже, это регрессия в нашей конфигурации nginx по умолчанию. Спасибо за отчет, @mandyk

1 лайк

Спасибо @Adubs за публикацию контр-примера для сравнения! И команде Discourse за этот блестящий инструмент.

5 лайков

Итак, просто ради интереса, я скопировал свой app.yml в app2.yml, изменил URL и несколько директорий, и теперь стабильная ветка работает на testfor.pixelspace.xyz.

https://testfor.pixelspace.xyz/t/safari-playback-test/8

Мои пользователи подтверждают, что у них это работает через тот же прокси.

edit: Теперь я вижу, что проблема подтверждена. Извините, что не подумал попробовать это раньше. Спасибо за вашу подсказку, @mandyk.

Я бы сам не догадался до этого.

3 лайка