Gatsby site hosted on Microsoft IIS server giving 404 errors for static assets and other files

Question

I am trying to host a Gatsby site on a remote Microsoft IIS server. I have copied the contents of the public folder of Gatsby to the folder of the IIS server. The site works but all my images in the static folder, web manifest file and some other files being referenced are not found. I have a lot of 404 errors in my console. How do I fix this?

Thank you.

Answer 1

I was finally able to solve it by add the MIME types of .webmanifest and .webp to the web.config file:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <location path="static">
        <system.webServer>
            <httpProtocol>
                <customHeaders>
                    <remove name="cache-control" />
                    <add name="cache-control" value="public, max-age=31536000, immutable" />
                </customHeaders>
            </httpProtocol>
        </system.webServer>
    </location>
    <location path="page-data">
        <system.webServer>
            <httpProtocol>
                <customHeaders>
                    <remove name="cache-control" />
                    <add name="cache-control" value="public, max-age=0, must-revalidate" />
                </customHeaders>
            </httpProtocol>
        </system.webServer>
    </location>

    <system.webServer>
        <staticContent>
            <mimeMap fileExtension=".webmanifest" mimeType="application/manifest+json" />
            <mimeMap fileExtension=".webp" mimeType="image/webp" />
        </staticContent>
        <rewrite>
            <outboundRules>
              <rule name="AdjustCacheForDontCacheFiles" preCondition="IsDontCacheFile" stopProcessing="true">
                <match serverVariable="RESPONSE_Cache-Control" pattern=".*" />
                <action type="Rewrite" value="public, max-age=0, must-revalidate" />
              </rule>
              <rule name="AdjustCacheForCachePermanentlyFiles" preCondition="IsCachePermanentlyFile" stopProcessing="true">
                <match serverVariable="RESPONSE_Cache-Control" pattern=".*" />
                <action type="Rewrite" value="public, max-age=31536000, immutable" />
              </rule>
              <preConditions>
                <preCondition name="IsDontCacheFile">
                  <add input="{REQUEST_FILENAME}" pattern="(.*\.html)|(sw\.js)|(app\-data\.json)|(page\-data\.json)" />
                </preCondition>
                <preCondition name="IsCachePermanentlyFile">
                  <add input="{REQUEST_FILENAME}" pattern="((.*\.js)|(.*\.css))$" />
                </preCondition>
              </preConditions>
            </outboundRules>
        </rewrite>
    </system.webServer>
</configuration>