ASP.NET MVC framework 4.5 CSS bundle does not work on the hosting

Question

I am runing an App on app harbor written in MVC4.

A bundle of css files doesn't work. In my local computer in debug mode I see the code of the App and I see the files. The App works as expected.

<link href="/Content/css/home/basic-jquery-slider.css" rel="stylesheet"/>
<link href="/Content/css/home/Home.css" rel="stylesheet"/>

When I upload the app to Appharbor I see the bundle in the code but the App doesn't work.

<link href="/Content/css/home?v=zhVOIpUNuvCOZhJyBcQWpMlozayor4te6k-pM29wHqI1" rel="stylesheet"/>

When I browse that link in the href I get 403 - Forbidden: Access is denied.

How to troubleshoot this?

Not sure if you resolved this issue but this article fixed mine. http://stackoverflow.com/a/18474844/955831 — Jason Foglia, Nov 11 '13 at 17:16

Paul · Accepted Answer · 2016-07-14T17:22:28.610

287

My guess is that the path Content/css exists on disk in your app. In this case IIS would be handling the request, not MVC.

Make sure that the virtual path for the bundle (the parameter of the StyleBundle constructor) doesn't match a folder in the file system.

From the comments:

"A good convention to follow when creating bundles is to include "bundle" as a prefix in the bundle name. This will prevent a possible routing conflict."

edited Jul 14 '16 at 17:22

answered Aug 22 '12 at 22:22

Paul

12,392
4
48
58

2

thanks. Is it normal that it works when in run in the localhost? – Ricardo Polo Jaramillo Aug 23 '12 at 19:50
8

@RicardoPolo, by "localhost", do you mean while running it on iis express on your development machine? Then yes, it's normal that it works there because you're most likely running in debug mode, which disables bundling. – bvgheluwe Jan 13 '14 at 15:37
1

Paul, I can't thank you enough for that solution! I was pulling my hair out for an hour trying to figure out what I had wrong! – May 30 '14 at 14:55
11

+1 This answer help me understanding how the virtual paths works with bundling. I read the original post on msdn (http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification) but after solving my problem with your answer, I found at the end of the post a bit of text talking about virtual path: "A good convention to follow when creating bundles is to include "bundle" as a prefix in the bundle name. This will prevent a possible routing conflict.". I think this sentence SHOULD have been put in bold with a red/yellow warning image. :D Thank you! – Samuel Jul 14 '14 at 19:47
I found this thread awhile back, and so, made my bundle paths completely different from my file paths, everything has worked in test, but when the bundles actually kicked in, all of the relative paths embedded within the css fell apart, and started producing 404 errors. As SO questions are supposed to be specific enough to solve a particular problem, I think it is also worth mentioning in comments that the information above must take into account other answers like: https://stackoverflow.com/questions/20484188/mvc-bundling-and-css-relative-urls# if your css uses URL Paths. – Jason D. Jun 19 '17 at 15:34
I have same issue but there is no "Content/css" exists on disk in my app , and it is also working on local . see this https://stackoverflow.com/questions/48983012/css-not-working-after-published – Thisara Subath Feb 27 '18 at 11:41

cdeutsch · Answer 2 · 2013-07-23T23:22:05.883

46

This issue is by default .NET does not "process" requests that have a .js or .css extension.

There are two fixes for this (you only need to do ONE)

A) Remove the extensions from the bundle names. (recommended) This will cause .NET to process the request and run it through the BundleModule.

B) Add this to your web.config in the system.webServer section which will cause .NET to run .js and .css requests through the BundleModule.

<modules runAllManagedModulesForAllRequests="true">
  <remove name="BundleModule" />
  <add name="BundleModule" type="System.Web.Optimization.BundleModule" />
</modules>

Big shout out to Ray Moro who figured out the actual cause and shared it with me on my blog: http://blog.cdeutsch.com/2012/11/fixing-404-errors-for-aspnet-mvc-apps.html

edited Jul 23 '13 at 23:22

answered Nov 28 '12 at 03:07

cdeutsch

3,847
27
25

Updated with more information on the root cause along with a second option. – cdeutsch Jul 23 '13 at 23:22
1

I was having this problem because my bundle's name was a folder-like name ending in "css". Though my bundle didn't exactly had a file extenssion, suggestion A lead me to the problem. – dsnunez Jun 10 '14 at 07:07
1

This should be correct answer, it helps me with same problem. – psulek Jul 14 '15 at 12:43
great answer it help me – DKR Sep 10 '15 at 10:56
This thing with the missing section from web.config oh man ... – XDS Sep 14 '17 at 11:09

score 20 · Answer 3 · edited Jun 20 '20 at 09:12

20

Happened with me too, when I tried deploying my ASP.NET MVC app on AppHarbor.

I had a stylesheet bundle with the name

@Styles.Render("~/Content/bootstrap")

and the folder structure was

-- Content

-- Content \ Bootstrap \ ...

By just changing the bundle name to "~/Content/bootstrap-css" my issue got resovled.

edited Jun 20 '20 at 09:12

Community

1
1

answered Jan 30 '15 at 07:22

Yasser Shaikh

46,934
46
204
281

score 15 · Answer 4 · answered Mar 29 '16 at 20:17

15

I know I'm 4 years late to this question but this worked for me.

public static void RegisterBundles(BundleCollection bundles)
{
   ...

   BundleTable.EnableOptimizations = true;     // Added this           
}

answered Mar 29 '16 at 20:17

RayLoveless

19,880
21
76
94

2

Of all the answers above and below. This is the only one that worked for me. – Haim Katz Feb 21 '17 at 12:47
3

This enables optimizations when you're in debug mode. While this is a great way to check if bundles work on a dev machine, you shouldn't leave this statement in your code. – Rudey Feb 28 '17 at 17:19

score 9 · Answer 5 · edited Oct 13 '15 at 17:59

9

403 error solved. here is a detailed explanation and solution for 403 error.
The solution is demonstrated for CSS bundle. However it also applies to JavaScript.

http://www.mvccentral.net/Story/Details/articles/kahanu/stylebundle-403-error-solved

edited Oct 13 '15 at 17:59

SharpC

6,974
4
45
40

answered Apr 18 '14 at 18:01

yantaq

3,968
2
33
34

2

Thanks, this is the problem that I experienced. To solve it, in BundleConfig.cs I changed the path from @Styles.Render("~/Content/css") to @Styles.Render("~/bundles/css"). Now it works when running locally in debug mode and when published in release or debug mode. – Ken Palmer Apr 28 '15 at 19:10
Nice reply, but you shouldn't leave only a link, at least the basic steps of this write-up would be great to have here, in case the linked website is down. – Vitor M. Barbosa May 15 '15 at 14:19

score 5 · Answer 6 · answered Sep 17 '18 at 14:30

5

I solved the issue by adding below line of code at BundleConfig class

BundleTable.EnableOptimizations = false;

answered Sep 17 '18 at 14:30

Ye Yint

859
2
11
21

score 3 · Answer 7 · answered Jun 24 '14 at 17:43

What I do is very simple,

I add "js" at the end of ScriptBundle like so: new ScriptBundle("~/bundles/appjs") And I add "css" at the end of StyleBundle like so: new StyleBundle("~/content/appcss")

My folder names never end with "js" or "css".

That should do it.

score 2 · Answer 8 · answered Oct 30 '12 at 22:17

2

This applies to the 'ScriptBundle class' too, ensure that the 'parameter name' to the constructor does not match a path in web application file system. Remember that IIS will try to serve up the file/request.

answered Oct 30 '12 at 22:17

William

648
8
8

score 1 · Answer 9 · answered Mar 08 '14 at 02:32

The problem can also come from the file being encrypted. This occurred to me when I downloaded BootStrap and used the supplied files. They showed green in Windows explorer and worked fine in Visual Studio, but when deployed, I got a 403 error.

You can see if they are encrypted by going to properties, then advanced properties and there is an encypted checkbox.

Uncheck and it will no longer be a problem.

score 0 · Answer 10 · answered Dec 23 '13 at 10:10

0

I have the same problem with that (403 Forbidden) error. In my case the reason is proxy server in my organization blocks my css file. Css file name matches one of block rules.

answered Dec 23 '13 at 10:10

score 0 · Answer 11 · answered Dec 23 '16 at 17:04

0

I found out the file bootstrap.css wasn't in the content folder, so I looked for it in the packages and pasted there.. it worked!

answered Dec 23 '16 at 17:04

Majid ALSarra

394
2
7

ASP.NET MVC framework 4.5 CSS bundle does not work on the hosting

11 Answers11

Linked