はじめに
Angularで作成したWebアプリをAzure Web Appsにあげた際に、動画だけ404エラーがでて表示できない現象が起きたので、その解決方法をメモ( ..)φ
発生したエラー
GET https://hogehoge/(省略)/movie.mp4 404(Not Found)
でも動画はちゃんとassetsのなかにいる…。
解決方法
Azure Web Appsでビデオファイルを操作できるように、 web.configにMINEタイプを追加する必要があったらしいです。
逆に言うと、画像とかはデフォルトで見れるようになっている。
web.configを追加して、以下の内容をかきました。
見たいファイルはmp4だから、本当はmimeType="video/mp4"だけでいいと思われる。
web.config
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<staticContent>
<mimeMap fileExtension=".mp4" mimeType="video/mp4"/>
<mimeMap fileExtension=".ogv" mimeType="video/ogg"/>
<mimeMap fileExtension=".webm" mimeType="video/webm"/>
</staticContent>
</system.webServer>
</configuration>
無事に404エラーは解消されて動画が再生できるようになりました。
おわりに
angular.jsonにweb.configのパスをかき忘れる凡ミスをして、一瞬？？？となったので気を付けよう！