How to Route to CSS/Js Files in MVC.Net

how to route to css/js files in mvc.net

I did not find a way of doing this with mvc routing what i ended up doing is:
I ran this code in a http module:

void context_BeginRequest(object sender, EventArgs e)
        {
            HttpApplication Application = sender as HttpApplication;

            var match = r.Match(Application.Request.Url.AbsolutePath);
            if (match.Success)
            {
                var fileName = match.Groups[2].Value;
                Application.Context.RewritePath("/" + fileName);
            }
        }

r is a regex in my case:

private readonly Regex r = new `Regex("^/gmail(/canvas)?/((content|scripts|images|tinymce).*)$", RegexOptions.IgnoreCase);`

in global.asax i added:

routes.IgnoreRoute("{*staticfile}", new { staticfile = @".*\.(css|js|gif|jpg)(/.*)?" });

to prevent mvc.net from routing these requests.

one might also have to set iis6/iis7 to route requests to static files through mvc.net but i forgot the details.

I picked this method up from several posts that i cannot remember so i apologize that i cannot give proper credit.

Why CSS and JS files bypass Asp.Net MVC routes?

After a little bit more of research I found the following quote from Steven Sanderson's book:

However, the routing system still does check the file system to see if an incoming URL happens to match a file or disk, and if so, routing ignores the request (bypassing any route entries that the URL might also match) so that the file will be served directly. This is very convenient for static files, such as images, CSS, and JavaScript files. You can keep them in your project (e.g., in your /Content or /Script folders), and then reference and serve them directly, just as if you were not using routing at all. Since the file genuinely exists on disk, that takes priority over your routing configuration.

If, instead, you want your routing configuration to take priority over files on disk, you can set the RouteCollection’s RouteExistingFiles property to true. (It’s false by default.)

That was something very interesting to learn and led me to the actual problem. A much simpler one. As it happened, the pertinent scripts were not present on the folder. At least not the ones with the exact same version requested on the view. That was the responsible for Asp.Net MVC thinking it was a controller/action request.

Reference: http://forums.asp.net/t/1536510.aspx/1

Routing to Javascript/CSS Files?

Use absolute, or even better, application relative links for your styles:

<link href="~/dist/css/app.css">

Note the "~". If the URL that ends up in the browser does not start with a / or a scheme, it will be relative to the current URL of the page.

Routing for .js URL in ASP.Net MVC4

The problem was an IgnoreRoute that I was unaware of (the RouteRegistry.cs file is 1,469 lines long... I have not studied it in its entirety, yet). js files are being handled in managed code--they were just being taken out by this before my route could handle the request.

routes.IgnoreRoute("{*path}",
   new { path = new RegexConstraint(@"[^?]*\.(gif|jpe?g|png|ico|js|swf|css|txt|html?|xml|pdf)") }
);

How to make all static files like css/images/js files not be processed by asp.net mvc?

You need to create an ignore route for the specific types of files you don't want to be served through ASP.NET MVC.

Add the following to your routes, for the types of files you want to ignore.

The following works for files in the root:

routes.IgnoreRoute("{file}.css");
routes.IgnoreRoute("{file}.jpg");
routes.IgnoreRoute("{file}.gif");

If you want to ignore files in a specific directory, you can do this:

routes.IgnoreRoute("assets/{*pathInfo}");

If you want to combine these into one route, you can (e.g., ignore specific types of files in a directory):

routes.IgnoreRoute("{assets}", new { assets = @".*\.(css|js|gif|jpg)(/.)?" });

This overload of IgnoreRoute accepts a url (the first argument) and a Constraints object of things to ignore.

Since the RouteConstraints in ASP.NET MVC can be implemented multiple ways (including a regex), you can put standard regexes in the second argument.

If you want to implement a custom constraint, there is lots of useful documentation on that subject (say, if your constraint is dynamic at runtime).

Route MVC 4 application url - css and js not working

Got it right. Some of the scripts of my website was reffered as

 <script src="../Scripts/jquery-1.7.1.js"></script>
 <script src="../Scripts/jquery.easing.1.3.js"></script>

instead of

<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/jquery.easing.1.3.js"></script>

How to include js files in asp.net MVC and have a valid path on all routes

Use the Url Helper:

<script type="text/javascript" src="<%=Url.Content("~/Content/script/MyFile.js")%>"></script>

Hope that helps

How to add js and css files in ASP.net Core?

I added the references inside the _Layout view, inside the <environment> tags:

<environment names="Development">
  <link rel="stylesheet" href="~/css/MyCss.css" />
</environment>

If anyone knows a better way I would welcome it

---

Related Topics