①videoタグの使い方が間違っていないかを確認
<video playsinline muted autoplay loop poster="poster.jpg">
<source src="movie.webm" type="video/webm">
<source src="movie.mp4" type="video/mp4">
</video>
videoタグの中は
playsinline="" muted="" autoplay="" loop=""
のような書き方もあるみたいですが、
playsinline muted autoplay loop
と記述します。
②WordPressブログの場合、.htaccessの記述を確認
WP Fastest Cacheのようなキャッシュプラグインを使い、
よくわからないまま設定をONにしていると、
サーバーの.htaccessの記述が上書きされます。
WP Fastest Cacheを外しても良いですが、
.htaccessファイルの以下の記述を除去することで、
正常に再生される場合があります。
<FilesMatch "\.(webm|ogg|mp4|ico|pdf|flv|avif|jpg|jpeg|png|gif|webp|js|css|swf|x-html|css|xml|js|woff|woff2|otf|ttf|svg|eot)(\.gz)?$">
<IfModule mod_expires.c>
AddType application/font-woff2 .woff2
AddType application/x-font-opentype .otf
ExpiresActive On
ExpiresDefault A0
ExpiresByType video/webm A10368000
ExpiresByType video/ogg A10368000
ExpiresByType video/mp4 A10368000
ExpiresByType image/avif A10368000
ExpiresByType image/webp A10368000
ExpiresByType image/gif A10368000
ExpiresByType image/png A10368000
ExpiresByType image/jpg A10368000
ExpiresByType image/jpeg A10368000
ExpiresByType image/ico A10368000
ExpiresByType image/svg+xml A10368000
ExpiresByType text/css A10368000
ExpiresByType text/javascript A10368000
ExpiresByType application/javascript A10368000
ExpiresByType application/x-javascript A10368000
ExpiresByType application/font-woff2 A10368000
ExpiresByType application/x-font-opentype A10368000
ExpiresByType application/x-font-truetype A10368000
</IfModule>
<IfModule mod_headers.c>
Header set Expires "max-age=A10368000, public"
Header unset ETag
Header set Connection keep-alive
FileETag None
</IfModule>
</FilesMatch>
コメント