【videoで動画を設定し、オートスタートしたが動作しない、その原因】ホームページを動画を再生したいので、 video タグを用い動画ファイル(mp4)を設定したのですがなぜか再生されない。原因と対策。

クライアントからの要望で、 ホームページに動画を設定することになった。

提供された動画をサーバーにアップして、昔よくやったビデオタグを使ってサーバーにアップしたのですがなぜか再生してくれないんです。

確認したのが Google Chrome なのですが、 Microsoft Edge で確認してみると問題なく再生できていました。

どうも原因は、しばらく前から仕様が変わったようで、オーディオをストップしておかないと再生されないようです。

多分ホームページを開いた時に突然音が出るのを防止するためでしょう。

そのために mutedタグを追加して確認をしましたら、  Google Chrome では問題なく再生ができるようになりました。また Android スマホで確認しても問題なく再生できました。

<video src=”videfile.m4v” autoplay  muted loop></video>

上がサンプルです。

ところが iPhone で見てる方から駄目だという連絡いただきました。

確かに確認をしてみるとダメなんです。

ブラウザの問題だと思い調べてみましたが、 iPhone で使っている Google Chrome でも駄目なようです。

ということはブラウザの問題ではなく iPhone の問題なんですね。

そこまで行くと詳しいことは私には専門家でないので全く分かりません。

とりあえず次のようにタグを書いてサーバーにアップしたところ iPhone 関係でも動作するようになりました。

その追加したタグとは playsinlineです。

下がサンプル例です。

<video src=”video.m4v” autoplay playsinline muted loop></video>