iOSとmacOSのSafariで動画が再生されない問題

バグ
,
1

皆さん、こんにちは。

3.6.0.beta3-latest で、iPhone および macOS の Safari ユーザーがアップロードされた .mp4 (H.264) 動画を再生しようとすると、無限スピナーが表示される問題が発生しています。これらの動画は最近まで正常に再生されていました（Discourse のどのバージョンまで正常だったかは定かではありません）。

Safari は動画の最初のバイト (Range: bytes=0-1) を取得するために GET リクエスト（例: /uploads/default/original/1X/44395933ccadf546b1b1ce65b742e24f900b33fa.mp4）を行っているようです。これは 200 を返しますが、JS コンソールやネットワークインスペクタには表示されない理由で失敗します（単に赤でハイライトされるだけで、エラーメッセージはありません）。同じ URL をブラウザに直接貼り付けると、フル動画を正常にダウンロードして再生できます。

macOS の Firefox および Chrome では動画再生に問題はありません。Android のブラウザでも問題はないようです。

動画は小さい（10MB 程度）です。S3 はアップロードには使用していません。

他に同様の問題を経験した方はいらっしゃいますか？または、iPhone/Safari での動画再生に問題がないことを確認していただけますか？また、この問題の原因を特定するために他にどのような診断が可能でしょうか？

「いいね！」 1
3

私のフォーラムでも同様の問題が発生していますが、ここで同じファイルをテストすると問題なく動作します。iOS/Safari ユーザーのみが影響を受けています。WEBM コンテナの一部の動画は再生されますが、ほとんどの mp4、mov などは再生されません。

「いいね！」 2
4

こんにちは、最近問題が発生しており、@tskさんが開始したスレッドにコメントしましたが、それは削除されてしまいました。webm/vp9エンコードされた動画はフォーラムで再生されていたため、問題はmp4/av1エンコードされた動画にあると仮定していましたが、Safariユーザーにとってはそれ以上の問題になりつつあるようです。

5

ちょっとした遊び心で最新版であることを確認しましたが、コミット内容にはAppleユーザーに影響を与えるようなものは何も見当たりませんでした。

image

私の設定では、アップロードにローカルストレージを使用しています。ほとんどのスレッドは信頼レベルによってロックされていますが、ここでは公開カテゴリでテストしています。

6

その動画へのリンクを共有していただけますか、またはここにアップロードしていただけますか？

「いいね！」 1
7

@Les79 テストとして、このビデオを両方のフォーラムにアップロードしました。

pixelspace safari 再生スレッドのビデオは機能せず、ここのビデオは機能することを確認していただけますか？

「いいね！」 1
8

はい、ここに投稿された動画は、iPhone 13とMacBook Pro M3の両方のSafariで動作します。PixelSpaceフォーラムでは動作しません。

「いいね！」 2
9

この動画はH.264形式のMP4で、Discourseが動作するすべてのブラウザで再生できるはずです。ここで再生できて、あなたのインスタンスで再生できないということは、そちらの設定に何か問題があると思われます。

Discourseの上に、追加のリバースプロキシを実行していますか？標準的なインストールには存在しないヘッダーがこのインスタンスにはいくつか見られるので、どのような設定になっているのか興味があります。

「いいね！」 1
10

私も同じです。

11

リバースプロキシとしてこのコンテナを使用しています。

これが原因の一部である可能性も検討しましたが、設定は変更されておらず、私の知る限りではこれは3.6.0-beta2からの新しい問題です。再構築後にAppleユーザーから苦情を受け始めました。@mandykと同様に、以前は何を使用していたか覚えていません。

image

評価すべきDiscourseの特定のセッティングはありますか？

「いいね！」 1
12

Discourse ではなく、プロキシです。

残念ながら、人々が Discourse の上に何かを追加した場合の無限の可能性のある構成をすべて現実的にカバーすることはできません。そのため、標準インストールでは、Discourse 用に構成されたリバースプロキシを備えた既知の良い構成で出荷しています。

単一の nginx 設定ステートメントが欠けている可能性がありますが、それについては調査する必要があります。

「いいね！」 1
13

また、このスレッドに投稿された動画はSafariで問題なく再生されることも確認しました。

関連があるかどうかわかりませんが、気づいた違いの1つは、このスレッドの動画はS3から提供されていることです。Safariが最初のレンジリクエストを行うと、S3はHTTP 206で応答しており、これは正しいようです。Pixelspaceインスタンスと私のインスタンスの両方でS3は使用されておらず、DiscourseはHTTP 200で応答しているようです（リクエストにはRange: bytes=0-1ヘッダーが含まれているため、正しくないようです）。

14

テストインスタンスに同じ動画をアップロードしました。

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

15

discourse-on-a-pi5.falco.dev の動画が Safari で動作しないことを確認しました。動画のリクエストが 206 ではなく 200 を返していることがわかります。

編集: さらに、Range: bytes=0-1 が指定されているにもかかわらず、レスポンス全体を返そうとしているようです。レンジリクエストが無視されており、Safari がそれに敏感になっている可能性があります。

さらに編集: これは、ブラウザが動画全体をダウンロードしてからシークする必要があるため、Safari 以外のブラウザでも大きな動画の効率的なシークが壊れていることを意味する可能性があります。

「いいね！」 3
16

Safariで再生が機能しません

17

そして、Test Safari Bug - Discourse では動作しますよね？

18

はい、それは機能します！HTTP 206も表示されています。

「いいね！」 1
19

デフォルトのnginx設定でのリグレッションのようですね。レポートありがとうございます @mandyk

「いいね！」 1
20

@Adubs、比較用のカウンターレプロを投稿してくれてありがとう！そして、素晴らしいツールを提供してくれたDiscourseチームにも感謝します。

「いいね！」 5
22

追加の面白さのために、app.ymlをapp2.ymlにコピーし、URLといくつかのディレクトリを変更したところ、testfor.pixelspace.xyzで安定ブランチが実行されるようになりました。

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

ユーザーは、同じプロキシを通じてここでも機能すると確認しています。

編集：問題の確認ができました。もっと早くこれを試すべきでした。洞察をありがとうございます @mandyk

自分でこれを見つけることはできなかったでしょう。

「いいね！」 3