svg is not working on IIS webserver on localhost

I’m trying to set a “.svg” image as background-image using css, but it is not working. The url is valid and returns 200 status code and works on “.png” images.

What is the problem?

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Your IIS is most likely not configured with SVG as a content type, try adding

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

inside the <system.webServer> scope of your web.config.

This will of course only work if your application is the one serving up the svg. If the svg is not contained inside your application but in a separate directory of the web server, you’ll need to add the same mapping to your web server instead inside the “mime-types” tab.

Method 2

Try This – Your App/Website under Default Settings of IIS Manager

Default Site Under IIS Manager

Then “Add” -> { .svg : image/svg+xml }

Method 3

from web.config

<system.webServer>
    <staticContent>
        <remove fileExtension=".svg" />
        <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
    </staticContent>
</system.webServer>

or in IIS
go to MIME Types and add file name extension:.svg
MIME Type: image/svg+xml

Method 4

In my case, I included all of the mime-types I wanted in the applicationHost.config file (which is usually located at C:WindowsSystem32inetsrvconfig) under the <system.webServer> scope, like Joachim Isaksson mentioned. This allows all of my IIS sites to inherit the same mime-types, and gives you one location to change them if something goes wrong.

Method 5

Just in case, if anyone want to use IIS Manager for the same, select ‘top node’ on ‘Connections’ tree (typically the name of the machine you’re on), and on right side, locate ‘MIME Types’ in ‘IIS’ section – double click the same. You should see list of all file types with ‘Entry Type’ as ‘Local’. Add ‘.svg’ type as mentioned by posts above (which amends same file as mentioned by ‘Markaius’). This enables to ‘inherit’ same MIME type for any application on the machine.


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x