Unauthenticated users can't see images in website

Question

When I run my website through debug mode in visual studio everything looks great and all the images on the page show up fine. But once I deploy my website to an IIS7 web server (doubt that other versions would make any difference, but you never know) then users can't see the images on the site until they log in.

The website is an asp.net MVC site and I'm new to MVC, though I do have lots of experience with asp.net forms. It seems that only authenticated users are allowed to access the images folder, and there is an authorization section in my web.config saying that only admins can access the site, so how do I make it so that all users, authenticated or otherwise can view the images?

-- Update --

I tried putting in the configuration block suggested, which from everything I can tell makes perfect sense, but it didn't seem to make a difference. The sample below has Content/Images for the path but before that I tried just Content, since it's OK for everything in there to be accessible. I also tried setting the allowOverride setting to false, which also didn't seem to make a difference.

<location path="Content/Images">
    <system.web>
        <authorization>
            <allow users ="*" />
        </authorization>
    </system.web>
</location>  

--Update 2-- Funny thing is that I don't even see any explicit deny entries in my web.config, just an allow for admin's, and when I went into IIS 7 and used the UI to allow all users access to the Content directory it didn't show any deny's on the list either. But then again, this project works fine when I just debug it from my personal computer, it's only after I deploy it that I have problems...

<authorization>
    <allow roles="admin" />
</authorization>
<authentication mode="Forms">
    <forms loginUrl="~/Account/LogOn" timeout="2880" />
</authentication>

Answer 1

In your web.config file, after the </system.web> tag, add the following

<location path="images">
     <system.web>
       <authorization>
        <allow users ="*" />
       </authorization>
    </system.web>
</location>

where path="images" is the name of the folder with your images/css.

Update:

If you're using ASP.NET MVC, I would remove the authorization declaration in the web.config file and use the [Authorize] attribute on the controllers that need to be locked down.

You can also specify the roles you want to grant access to using [Authorize("admin")].

Answer 2

By default, the configuration you define in a Web.config file, applies to every subdirectory of its containing folder. If you have a Web.config in the application root, that configuration will propagate to every subdirectory, including those where you have images and Css style sheets. So, if you have in your root Web.config a rule like this one:

<system.web>
...
<authorization>
  <deny users="?"/>
</authorization>
...
</system.web>

anonymous users will not be able to access the resources needed to display the page like you would expect it.

To fix it, you need to include another Web.config in every subdirectory that has presentation resources, and apply the rules you want to override. In your case, this should do the work:

<?xml version="1.0"?>
<configuration>
   <system.web>
      <authorization>
        <allow users="*"/>
      </authorization>
   </system.web>
</configuration>

If you are using Themes, place a single Web.config file in the theme folder.