ASP.NET MVC框架4.5的CSS捆绑在托管上无法正常工作。

145

我正在运行一个使用MVC4编写的应用程序,托管在App Harbor上。

一批CSS文件无法工作。在我的本地计算机上处于调试模式时,我可以看到应用程序的代码并且我能够看到这些CSS文件。应用程序正常工作。

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

当我将应用上传到Appharbor时,我在代码中看到了bundle,但应用程序无法正常工作。

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

当我使用href中的链接访问时,我收到“403 - 禁止访问:拒绝访问”的错误提示。

如何进行故障排除?


不确定您是否解决了这个问题,但是这篇文章解决了我的问题。https://dev59.com/HWMl5IYBdhLWcg3wXF5f#18474844 - Jason Foglia
11个回答

287
我的猜测是您的应用程序中硬盘上存在路径为Content/css。在这种情况下,处理请求的是IIS,而不是MVC。
请确保捆绑包的虚拟路径(StyleBundle构造函数的参数)与文件系统中的文件夹不匹配。
根据注释:
“创建捆绑包时要遵循的一个好惯例是在捆绑包名称中包含“bundle”作为前缀。这将防止可能的路由冲突。”

2
谢谢。在本地主机上运行时正常工作是正常的吗? - Ricardo Polo Jaramillo
3
感谢您的答复 - 让我感到十分困扰! - Rich Turner
8
@RicardoPolo,你所说的“localhost”是指在你的开发机上使用iis express运行它吗?那么是的,它可以在那里正常工作,因为你很可能正在以调试模式运行,这将禁用捆绑。 - bvgheluwe
1
谢谢,今天这个问题让我发疯了。 - xingyu
11
+1 这个答案帮助我理解了虚拟路径如何与捆绑工作。我看了 msdn 上的原始帖子(http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification),但在通过你的回答解决了我的问题后,我发现帖子末尾有一小段文字谈到虚拟路径:“创建捆绑时遵循的一个好惯例是在捆绑名称中包含“bundle”作为前缀。这将防止可能的路由冲突。” 我认为这句话应该以粗体字显示,并配上红色/黄色警告图像。:D 谢谢! - Samuel
显示剩余5条评论

46

默认情况下,.NET不会“处理”具有.js或.css扩展名的请求。

有两种解决方法(只需执行其中一种)

A) 从捆绑名称中删除扩展名。(推荐)这将导致.NET处理请求并通过BundleModule运行它。

B) 在web.config的system.webServer部分添加此内容,这将导致.NET通过BundleModule运行.js和.css请求。

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

特别感谢 Ray Moro 发现了真正的原因并在我的博客上与我分享: http://blog.cdeutsch.com/2012/11/fixing-404-errors-for-aspnet-mvc-apps.html


更新了更多关于根本原因的信息,同时提供了第二个选项。 - cdeutsch
1
我遇到了这个问题,因为我的bundle名称是以类似文件夹的名称结尾的“css”。虽然我的bundle并没有确切的文件扩展名,但建议A让我找到了问题所在。 - dsnunez
1
这应该是正确的答案,它帮助我解决了同样的问题。 - psulek
很棒的答案,它帮助了我。 - DKR
这个 web.config 中缺少 <module> 部分的问题,哎呀... - XDS

20

我也遇到了同样的问题,当我尝试在AppHarbor上部署我的ASP.NET MVC应用程序时。

我有一个名称为的样式表bundle

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

文件夹结构如下:

-- Content

-- Content \ Bootstrap \ ...

只需将捆绑包名称更改为 "~/Content/bootstrap-css",我的问题得到了解决。


15

我知道回答这个问题已经晚了4年,但是这对我有用。

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

   BundleTable.EnableOptimizations = true;     // Added this           
}

2
在上下所有的答案中,这是唯一一个对我有效的。 - Haim Katz
3
在调试模式下,这可以实现优化。尽管这是一种检查捆绑包在开发机器上是否正常工作的好方法,但你不应该将此语句保留在你的代码中。 - Rudey

9

403错误已解决。这里有一份关于403错误的详细解释和解决方案。
该解决方案是针对CSS捆绑包演示的。但它同样适用于JavaScript。

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

简而言之,确保虚拟路径 [Script | Style]Bundle("~/content/[script | css]") 不与文件系统中的文件夹匹配(例如 C:\approot\Content\[script | css]),而是使用 [Script | Style]Bundle("~/content/[scriptDiff | cssDiff]")

2
谢谢,这就是我遇到的问题。为了解决它,在BundleConfig.cs中,我将路径从@Styles.Render(“/Content/css”)更改为@Styles.Render(“/bundles/css”)。现在在本地调试模式下运行和发布或调试模式下运行时都可以正常工作。 - Ken Palmer
回复不错,但您不应该仅留下一个链接,在这里提供此文的基本步骤将非常好,以防链接的网站无法访问。 - Vitor M. Barbosa

5
我通过在BundleConfig类中添加以下代码行解决了这个问题。
BundleTable.EnableOptimizations = false;

3

我的工作非常简单,

我在ScriptBundle末尾添加"js",例如:new ScriptBundle("~/bundles/appjs");

我在StyleBundle末尾添加"css",例如:new StyleBundle("~/content/appcss");

我的文件夹名称从不以"js"或"css"结尾。

就是这样。


2
这同样适用于“ScriptBundle类”,请确保构造函数的“参数名称”不与Web应用程序文件系统中的路径匹配。记住,IIS将尝试提供文件/请求。

1

问题也可能来自文件被加密。这个问题发生在我下载了BootStrap并使用提供的文件时。它们在Windows资源管理器中显示为绿色,在Visual Studio中也正常工作,但在部署时出现了403错误。

您可以通过打开属性,然后选择高级属性来查看它们是否被加密,并有一个加密复选框。

取消勾选即可解决问题。


0

我发现 bootstrap.css 文件不在内容文件夹中,所以我在包中寻找并粘贴了进去... 它奏效了!


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接