Introduction
When working on modern web applications that use features that are recently supported by browsers such as SVG, you may find that images do not render correctly, or at all in the browser.
Background
When most of use develop and test web applications locally, we use the built-in web server, called ASP.NET Development Server/10.0.0.0. This works fine for testing, and most applications will eventually get deployed to a web server running IIS 7.0 or later.
The Problem
The ASP.NET Development Server is not aware that it should serve SVG with a MIME content-type of image/svg. Instead it uses the generic application/octet-stream. A modern web browser on the other hand will typically either request image/* or explicitly request image/svg+xml. If the response is application/octet-stream, it will ignore the response (tested in IE9, FF14).
The usual way of fixing this is to add this code block to web.config:
<system.webServer>
<staticContent>
<mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
</staticContent>
</system.webServer>
Unfortunately ASP.NET Development Server is unable to understand this directive.
To workaround this problem, install and use IIS 7.5 Express to serve the content locally. This will require instructing Visual Studio to use IIS instead.
Yvan Rodrigues has 30 years of experience in information systems and software development for the industry. He is Senior Concept Designer at
Robotic Assistance Devices
He is a Certified Technician (C.Tech.), a professional designation granted by the Institute of Engineering Technology of Ontario (IETO).
Yvan draws on experience as owner of
Red Cell Innovation Inc.,
Mabel's Labels Inc. as Manager of Systems and Development, the
University of Waterloo as Information Systems Manager, and
OTTO Motors as Senior Systems Engineer and Senior Concept Designer.
Yvan is currently focused on design of embedded systems.
Submit an article or tip
