locked
mimetypes for .svg, .woff and .eot not working in Azure RRS feed

  • Question

  • I've added mimetypes to web.config for .svg, .woff and .eot and they are not getting picked up Here's a repro deployed to cloud:.

     

    http://mimetypetest.cloudapp.net/font.aspx

    The font.aspx page will not pick up the .woff font and will display as the backup font ie9. But if you run the Web project (out of cassini) the font.aspx page will display the Felbridge font in ie9. 

     

     

    I have the following in my web.config:

     

      <system.webServer>

        <modules runAllManagedModulesForAllRequests="true"/>

        <staticContent>

          <remove fileExtension=".svg" />

          <remove fileExtension=".eot" />

          <remove fileExtension=".woff" />

          <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />

          <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />

          <mimeMap fileExtension=".woff" mimeType="application/x-woff" />

        </staticContent>

      </system.webServer>

     

    What’s the story here?

     

    Karsten

    Wednesday, August 18, 2010 5:01 PM

Answers

  • I had the same problem

    The problem is not Azure, but Visual Studio. If you look to the properties of the .woff file, you will see that the "build action" is set to "none" after importing the .woff and .eot files. Set the build action to "content", and you will see your html5 fonts on azure :)

     

     

     


    My company : PurePlexity.com
    Smooth Streaming Demo : Smooth Streaming on Windows Azure

    I had to combine this technique along with the code posted in the original question to get a working solution.
    Thanks.

     

      <system.webServer> 

        <modules runAllManagedModulesForAllRequests="true"/>

        <staticContent>

          <remove fileExtension=".svg" />

          <remove fileExtension=".eot" />

          <remove fileExtension=".woff" />

          <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />

          <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />

          <mimeMap fileExtension=".woff" mimeType="application/x-woff" />

        </staticContent>

      </system.webServer>

     

    Monday, October 3, 2011 1:45 PM

All replies

  • Well, there is a workaround, which is to put those files in blob storage and set the mimetype there. However, it would be nice to understand why you can't set mimetypes via system.webServer in your web role.
    Wednesday, August 18, 2010 9:34 PM
  • Hi Karsten,

    I tested your webpage at http://mimetypetest.cloudapp.net/font.aspx

    By using Fildder, I noticed that it return 404 "File not found" error for request to FelbridgeOTS-Condensed.woff file. I suggest you checking your project, please make sure setting FelbridgeOTS-Condensed.woff build action to "Content" and "CopyIfNewer".

    Thanks,


    Mog Liang
    Thursday, August 19, 2010 5:44 AM
  • Hi Mog - The problem is that the file is there (I have the settings right in VS) but the mimetype from web.config isn't being picked up and IIS is returning a 404.  I can even get a better repro on my local box, in which it returns a 404.3, so it knows that the file is there, but it just won't serve it. Why won't Azure pick up mimetypes set in web.config?

     

    Monday, August 23, 2010 5:52 PM
  • Hi,

    You may have checked this already, but I can't make it out of your question. Do you have the IIS -> WWW-Services -> Common HTTP Features -> Static Content feature checked?


    Regards, Patriek
    Monday, August 23, 2010 6:27 PM
  • Hi Patriek - Thanks for the response. Yes, on my dev box, I do have that feature checked.
    Monday, August 23, 2010 9:46 PM
  • Just a quick note, SVG does seem to be working. Woff is not. Like you noted, it works if you copy it to storage and set the right mime type there.
    Tuesday, September 7, 2010 11:41 PM
  • Hi, did you resolved this annoyed problem? If you have good solution, could you teach me how to do this?
    Tuesday, September 21, 2010 3:07 AM
  • The storage issue actually didn't work out for me in production because the domain names don't match (in testing this worked because everything was running from my local IP).  The client request from the site hosted on an azure compute node to the woff file on the azure storage node is always aborted by the browser due to cross-domain restrictions.

     

    One workaround which works in production is to put everything (aspx, html, css, and the woff file) on the azure compute node.  You need to rename the woff file to a .zip file so that the compute node will serve it.  Then you need to change the path to the woff file accordingly in the css file.  The browser still reads the font even though the file extension is a .zip, this just lets the azure compute node serve it.

     

     

    Monday, September 27, 2010 2:56 PM
  • I had the same problem

    The problem is not Azure, but Visual Studio. If you look to the properties of the .woff file, you will see that the "build action" is set to "none" after importing the .woff and .eot files. Set the build action to "content", and you will see your html5 fonts on azure :)

     

     

     


    My company : PurePlexity.com
    Smooth Streaming Demo : Smooth Streaming on Windows Azure
    • Proposed as answer by PurePlexity Monday, February 21, 2011 8:18 PM
    Monday, February 21, 2011 9:12 AM
  • I had the same problem

    The problem is not Azure, but Visual Studio. If you look to the properties of the .woff file, you will see that the "build action" is set to "none" after importing the .woff and .eot files. Set the build action to "content", and you will see your html5 fonts on azure :)

     

     

     


    My company : PurePlexity.com
    Smooth Streaming Demo : Smooth Streaming on Windows Azure

    I had to combine this technique along with the code posted in the original question to get a working solution.
    Thanks.

     

      <system.webServer> 

        <modules runAllManagedModulesForAllRequests="true"/>

        <staticContent>

          <remove fileExtension=".svg" />

          <remove fileExtension=".eot" />

          <remove fileExtension=".woff" />

          <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />

          <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />

          <mimeMap fileExtension=".woff" mimeType="application/x-woff" />

        </staticContent>

      </system.webServer>

     

    Monday, October 3, 2011 1:45 PM
  • Hi PurePlexity.

    That was it! Thanks.

    Monday, October 24, 2011 4:31 PM
  • I did all of these things, but still not work.

    "NetworkError: 404 Not Found - http://***.azurewebsites.net/Content/fonts/a.otf"

    Do you have any idea how can I fix it?

    Thx

    Thursday, August 6, 2015 9:55 PM