iosシステムでhtml5のvideoタグが再生できない問題を解決する。
2022-01-12 22:47:28
1. まず、フロントエンドの観点から、safariブラウザを動画に対応させ、再生に対応させる方法(解決策は見つからず)。
2. 何度もウェブで検索した結果、バックエンドを使うことで解決できることがわかり、その解決ポイントはHTTPプロトコルのレスポンスヘッダ(Accept-Ranges)にあることがわかりました。
3.サファリブラウザは、動画を開くときに、まずファイルのサイズを検出するリクエストを送信し、その後、データストリームのデータをセクションごとに取得するリクエストを複数送信する(個人的な理解では、おそらくダウンロードのセクション、Accept-Rangesです)。
4. この問題を解決するには、2つの側面から検討する必要があります。
a. リクエストの内容によって異なる応答をする必要がある、最初のプローブリクエストは200を返す必要がある、後のリクエストは206と具体的なデータを返す必要がある
b.contentTypeはvideoに設定する必要があります。
5. 具体的なコード
すでにここでラップされているので、それをそのまま使ってください。
{{コード
概要
今回紹介するのはhtml5のvideoタグがios系で再生できない問題の解決に関する記事で、もっと関連するhtml5のvideoタグがios系で再生できない内容はスクリプトハウスの過去記事を検索するか、以下の関連記事を引き続き閲覧してください、今後ともスクリプトハウスをもっと応援よろしくお願いします
関連
-
Html5+CSS3+EL表現問題まとめ
-
rtmpストリーミングライブのHTML5再生
-
localStorageの最大記憶容量を取得する方法を説明する
-
4種類のプログラムの画面適応に応じたモバイルh5ページを説明する。
-
HTML5でオプションのスタイルシートを使ってWebサイトやアプリケーションにダークモードを追加する方法を解説
-
モバイルやWeChatでHTML5の音声が自動再生されない問題を解決。
-
キャンバス画像分割効果の実装
-
キャンバスを使った線形・放射状グラデーションの使用例
-
Canvasユーティリティライブラリ Fabric.jsマニュアル
-
Html5 Canvasアニメーションの基本的な衝突検出の実装
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン