Can't render style sheet on my Meteor app (MIME error) - css

This is the error I'm receiving when trying to load CSS/less data:
I looked around StackOverflow for the same problem and I find out that I had to use an absolute URL for the stylesheets. I tried basically every combination of the URL where my stylesheets are located, but I still get the same error but only different link attached.
The stylesheets that I need to render are located in /client/stylesheets/less, but no matter what URL path I type, i get the same MIME/type error.
Can anyone be kind enough to point a fellow in the right direction?

Make sure the .css and .less extension are set up to use text/css as the MIME Type either on the server level or for your web application. You can add this MIME type to your web.config if you do not have access to the server level configuration.
<system.webServer>
<staticContent>
<remove fileExtension=".less" />
<mimeMap fileExtension=".less" mimeType="text/css" />
</staticContent>
</system.webServer>
The remove is included for if the setting is configured at the server level already to not cause a conflict.

Did you forget to install the less compiler?
meteor add less

Related

Where is my max-age header coming from?

I'm well aware of how I could set it myself, but I am concerned about having it configured in two different places. To receive the bounty, please tell me where I should look to find the existing setting.
Places we've already looked for the existing setting, without success:
the web.config <StaticContent> section
IIS output caching section, at all three levels:
machine
site
application
Code (I did a global search for SetMaxAge)
Context
We recently noticed that our CSS and JS files aren't getting refreshed. When I inspect the network traffic, they are coming back from the server with a header (Cache-Control: max-age=604800) that gives them a seven-day lifespan.
We need to reduce the cache lifetime. But for the life of me I can't find where it is set.
It is not set in the web.config <StaticContent> section.
It is not set in the IIS output caching section (I looked under the machine, the site, and the application-- they are all blank).
It is not set in code-- I did a global code search for SetMaxAge and got nuthin'.
Where else can I look?
Is it possible it is being set by the gateway or load balancer in our data center?
You can do like this in web config, or you can use IIS ui to change (see link below):
<configuration>
<system.webServer>
<staticContent>
<clientCache cacheControlMode="UseMaxAge"
cacheControlMaxAge="1.00:00:00" /> <!-- 1 day -->
</staticContent>
</system.webServer>
</configuration>
See more here: https://www.iis.net/configreference/system.webserver/staticcontent/clientcache
IIS documentation states that the default value is 1 day.
Here are some other ways what could have affect these settings:
http://www.galcho.com/blog/post/2008/02/27/IIS7-How-to-set-cache-control-for-static-content.aspx
overrideModeDefault value in applicationHost.config
earlier appcmd.exe settings
or client setting can also override your values.

How do I bypass Accept header validation in IIS?

I have a Nancy website hosted on ASP.Net with a number of custom routes. These routes include mappings which look like file paths (e.g. /path/to/xml_file.xml), but that resolve to HTML files which should display in the browser. For most files, this works correctly. However, with XML files (and possibly other mime types), I am getting a 406.0 HTTP error from IIS 8 Express explicitly stating that
HTTP Error 406.0 - Not Acceptable
The resource cannot be displayed because the file extension is not being accepted by your browser.
The request was rejected because it contained an Accept header for a MIME type that is not supported for the requested file extension.
Verify the MIME settings for the file extension that was requested to make sure this MIME type is acceptable.
Is there any web.config setting or other technique for bypassing this validation so that I don't get this error without having to rewrite the path logic? My Google searching is failing me. For example, I have found this IIS forum post linked from the SO Answer which talks about
map all reqests to ASP.NET and use the ASP.NET's StaticFileHandler to serve them
However, the post does not explain how to do this; nor does it seem applicable.
Edit: (Added error page image above)
As another tidbit, the Nancy route returns an explicit view of the form
return View["view_name", myModel];
And therefore, should bypass content negotiation.
While not a fix or answer per se, my current work around (for anyone who might be interested) is to tweak the routes to use a trailing slash. As an example:
"/path/to/xml_file.xml" // Still returns a 406.0 error
"/path/to/xml_file.xml/" // Works properly (notice the trailing slash)
Here's a link to the Rackspace knowledge center that shows how to change the MIME mapping for static content in the web.config file.
https://www.iis.net/configreference/system.webserver/staticcontent/mimemap
There's also this one from MS that's more in-depth.
https://www.iis.net/configreference/system.webserver/staticcontent/mimemap
They both feature this stanza from the web.config file.
<configuration>
<system.webServer>
<staticContent>
<remove fileExtension=".extension" />
<mimeMap fileExtension=".extension" mimeType="application/example" />
</staticContent>
</system.webServer>
</configuration>
If that's how to actually fix the 406.0 problem...

Styles from dotless files not used

We have a website that makes use of .less files (the pre-compiler dotless has been installed using nuget), however the .less files are not handled as css files.
When trying to view the website in firefox, the console gives use the following error:
The stylesheet http:// website/css/init.less was not loaded because its MIME type, "application/octet-stream", is not "text/css".
Our dotless file is trying to import more files:
#import "imports";
..
But even replacing this text with css code, the styles are still not applied. But if I go to that file in Visual Studio, it is displaying all the css from the files that are imported.
If you're using the dotLess handler to process and serve your .less files on the fly (which is fine for debugging, but you might want to consider pre-compiling for release), you need to ensure that you also send them down with the correct mimetype.
You can do this either at the server level in IIS Admin (if you're likely to using this for multiple sites on the machine), or at the local site level via the web.config - note that you can't do both, IIS will complain that there are multiple entries for the file extension.
To do this in the web.config, within the <configuration><system.webServer> element add the following elements:
<staticContent>
<mimeMap fileExtension=".less" mimeType="text/css" />
</staticContent>
Obviously, if you've already got some mimemap entries, just add the mimemap there.
This will ensure that IIS claims that the .less files served from the handler as CSS rather than the default application/octect-stream.
If that's still not serving them as processed, there are a couple of other things you'll need to check:
Ensure that the handler is correctly registered in both the <system.webserver><handlers> and <system.web><httpHandlers> sections (depending on the version of IIS you're using:
<add name="dotless" path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler,dotless.Core" resourceType="File" preCondition="" />
and
<add path="*.less" verb="GET" type="dotless.Core.LessCssHttpHandler, dotless.Core" />
Ensure that IIS is configured to send all requests through the ASP.NET handlers configured in step 1. By default, .less files are probably being considered "static files" and will only be handled by the StaticFileModule.

ASP.Net IgnoreRoutes Does not work

I have an svg file as my assets and in routeconfig, I have mentioned the below code
routes.IgnoreRoute("{*svg}", new { svg = #"(.*/)?.svg(/.*)?" });
This seem to be working fine with cassini (Visual Studio 2012 Buit-in Deployment Server) but when I deploy it to Azure I get a 404.
Is my IgnoreRoute statement right ? or any other solutions ? all other images, style sheets seems to work ok.
Thanks a lot in advance.
You never have to ignore routes for files that physically exist on disk, the routing module will not try to route those requests. You only need to ignore routes to other virtual resources.
Azure web sites do not have a mime type configured for .svg files, at least at the end of last year they didn't. You can configure a mime type for svg in the <system.webserver> section of your web.config file:
<staticContent>
<remove fileExtension=".svg"/>
<mimeMap fileExtension=".svg" mimeType="image/svg+xml"/>
</staticContent>
The remove is there to prevent errors on servers that already have an entry for .svg. It's an error to add a duplicate fileExtension, but not an error to remove a non-existent extension.
More here: Configuration Tips For ASP.NET MVC 4 on a Windows Azure Website
Looking at Phil's Blog I think what you need is something like:
routes.IgnoreRoute("{*allsvg}", new {allsvg=#".*\.svg(/.*)?"});
Hope that helps.
What order are you declaring the routes? It could be that above that one you have default or catch-all a route that actually already handles the request and so your IgnoreRoute never gets hit.

Is it possible to control Cache-Control headers in IIS for different static file types?

In IIS, can I configure it to return different cache-control headers for different static file types in the same folder?
I'm aware that I can use the HTTP Headers feature to set Expires Immediately, but that seems to affect all content. Is there a way to do it for specific file extensions for static content?
While not an ideal answer, I did find a work-around. In my application, I have control over where my JS, CSS, and other similar files live in the directory structure. What I did was put a web.config in the IIS root directory with these lines (among others, unrelated):
<configuration>
<system.webServer>
<staticContent>
<clientCache cacheControlMode="DisableCache" setEtag="true" />
</staticContent>
</system.webServer>
</configuration>
This sets the default in IIS that nothing should be cached. This is where the HTML page (index.html) for my single-page-application (SPA) lives, so that's what I want.
Then, in immediate subdirectories for images, JS, CSS, etc, I have web.config files with the following:
<configuration>
<system.webServer>
<staticContent>
<clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="14.00:00:00" setEtag="true" />
</staticContent>
</system.webServer>
</configuration>
You can of course set the age to whatever you want. I am starting with 14 days for now until I'm sure I everything right, then I will probably bump that to several months.
This way, the HTML of my SPA will never get cached, but all the JS/CSS/images will live as long as I want. When I rebuild the project for next deployment, web-pack will generate new file names for the packed JS and CSS, so no cache problem there. The HTML file will be the same name of course, but the included JS file names will be different. So it's key that the HTML file not ever be cached, which this setup accomplishes.
IIS should really make this simpler. A cache-by-file-type config would work perfectly and not require strict directory structure management, which not all projects have the flexibility to follow.

Resources