HTML
video/audio が自動再生されない
ブラウザの自動再生ポリシーでブロックされている
こんな症状
autoplay 属性を付けたのに、動画や音声が自動再生されない。メディア要素を埋め込んだときに起きやすいよ。
まず試す
<video autoplay muted> のように muted を追加する（ミュートなら自動再生が許可される）。
html
<video autoplay muted src="v.mp4"></video>これで直らなければ、下の「自分のケース」を確認。
🔍 自分のケースはどれ？
- ✓音声付きで自動再生したい
→ ブラウザの方針で不可。muted で開始し、ユーザー操作後にミュート解除する。 - ✓とにかく自動で動かしたい
→ muted 属性を付ける。 - ✓モバイルで再生されない
→ playsinline 属性も追加すると互換性が上がる。
なぜ起きる？
モダンブラウザはユーザー体験を保護するため、音声付きメディアの自動再生をデフォルトでブロックするよ。ユーザーが意図しない音声が突然流れるのを防ぐためのブラウザのポリシーなんだ。muted（ミュート）状態なら自動再生が許可されるよ。
✕ エラーが起きるコード
<video autoplay src="v.mp4"></video>
<!-- 音声付きは自動再生不可 -->✓ 直したコード
<video autoplay muted src="v.mp4"></video>
<!-- muted を追加 -->✅ 直ったか確認
muted での自動再生、またはクリック後の play() で再生されればOK。
この解決法は役立ちましたか？
🔗 関連するエラー
- videoタグで動画が再生されない — ファイルパスまたはフォーマットの問題
- 音声が自動再生されない — autoplay がブラウザにブロックされている
- 画像が表示されない — 画像パスが間違っている
- ページのレイアウトが崩れる — タグの閉じ忘れ
- リンクをクリックしても何も起きない — href 属性の書き忘れ
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
✏️ 手を動かして練習
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- HTMLとは？初心者向けにわかりやすく解説 — タグの書き方・ページ構造の基本
- HTMLのパス（相対パス・絶対パス）の書き方 — パスの書き方を初心者向けに解説