angular2 app, http request for file json file, 404 on azure

Question

I'm using angular2 and I am doing a http get to retrieve a configuration file that is located at http://MYSITE.azurewebsites.net/config/UIVisuals.json

The file does exist at wwwroot/config/UIVisuals.json when looking at the site with filezilla.

When I run locally everything works fine. When I deploy to azure I get a 404 on the file.

If i put the url into the browser The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

Updated: I've enabled directory browsing on my website and I can now browse to the directory, see the file. If I double click it, I get the The resource you are looking for has been removed, had its name changed, or is temporarily unavailable.

So this effectively takes my app out of the picture and makes it more of an azure thing.

What's the azure thing to do here?

Answer 1

Update: I missed that you were trying to serve a JSON file, To make that work, you need to add the following mimeMap to your web.config file:

<?xml version="1.0"?>

<configuration>
    <system.webServer>
        <staticContent>
            <mimeMap fileExtension=".json" mimeType="application/json" />
        </staticContent>
    </system.webServer>
</configuration> 

See this page for details.

Original answer:

There is nothing by default that should block such file from being served. My guess is that you have some custom configuration that causes this. To help isolate what, try the following things:

• Is it servable if you put the same file under a different folder, e.g. config2/UIVisuals.json?
• Is it servable if you create a brand new web app with nothing else in it, and then simply add your config/UIVisuals.json?

You should use Kudu Console to try things as it's more convenient than FTP.

Answer 2

I faced the similar issue with woff, woff2 and otf font files missing. It is working fine in local. But not working in azure deployment. To fix this: created a web.config file in src folder ([your project location]/src/web.config).

Added these contents:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
 <staticContent>
      <!-- In case IIS already has this mime type -->
      <remove fileExtension=".woff" />
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
      <remove fileExtension=".woff2" />
      <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
      <remove fileExtension=".otf" />
      <mimeMap fileExtension=".otf" mimeType="font/otf" />
      <remove fileExtension=".eot" />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <remove fileExtension=".svg" />
      <mimeMap fileExtension=".svg" mimeType="images/svg+xml" />
      <remove fileExtension=".svgz" />
      <mimeMap fileExtension=".svgz" mimeType="images/svg+xml" />
      <remove fileExtension=".json" />      
      <mimeMap fileExtension=".json" mimeType="application/json" />
    </staticContent>
</system.webServer>
</configuration>

you can add some more file types which is required for your project. It worked fine for me. Hope it will work for you as well.