Azure WebAppsでJSONファイルを読み込もうとすると404になる問題の修正方法

はじめに

Three.jsを使用したアプリケーションを作成し、AzureのWebAppsで公開しました。
その際に、3DデータのJSONファイルを読み込む際に、404 Not Foundのエラーが発生しました。
このエラーは以下の方法で修正することができます。

修正方法

以下のサイトを参考にしました。
json - Error 404 on Angular 2 app when deployed to Azure - Stack Overflow

web.config にMIME Typeの設定を追記すればよいようです。

以下の項目を追記しました。

web.config

<?xml version="1.0" encoding="UTF-8" ?>
<configuration>
    <system.webServer>
        <staticContent>
            <remove fileExtension=".json" />
            <mimeMap fileExtension=".json" mimeType="application/json" />
        </staticContent>
    </system.webServer>
</configuration>

すでに <configuration> や <system.webServer> は記載されている場合があるので、適切な場所に記述するようにしてください。
最後にアプリケーションを再起動すれば、JSONファイルが適切に読み込まれるはずです。