MVC绑定和CSS相关URL
使用CSSRWriteUrlTransform时,MVC的绑定在CSS图像中返回错误的URL: 我有一个内部网应用程序,其URL是,例如:MVC绑定和CSS相关URL,css,asp.net-mvc,relative-path,asp.net-mvc-5,bundling-and-minification,Css,Asp.net Mvc,Relative Path,Asp.net Mvc 5,Bundling And Minification,使用CSSRWriteUrlTransform时,MVC的绑定在CSS图像中返回错误的URL: 我有一个内部网应用程序,其URL是,例如:http://usid01-srv002/MyApplication。它位于IIS的“默认网站”中 在BundleConfig.cs中具有以下内容: bundles.Add(new StyleBundle("~/bundles/jcss") .Include("~/Scripts/JQueryUI/css/*.css", new CssRewriteU
http://usid01-srv002/MyApplication
。它位于IIS的“默认网站”中
在BundleConfig.cs
中具有以下内容:
bundles.Add(new StyleBundle("~/bundles/jcss")
.Include("~/Scripts/JQueryUI/css/*.css", new CssRewriteUrlTransform())
);
捆绑系统正在为这些CSS文件中引用的任何图像生成错误的URL,从而生成404甚至JQueryUI经过良好测试的CSS文件(来自FireBug):
e、 它正在生成
http://usid01/path/foo.png
应在何时生成:
http://usid01/MyApplication/path/foo.png
如何让捆绑系统生成指向正确位置的URL?CssRewriteUrlTransform使用绝对路径更新CSS URL,如果我们使用-
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css",new CssRewriteUrlTransform()));
我们在“site.CSS”中有以下CSS类
和下面的文件夹结构-
-Web site Root
-Content
--site.css
--Images
---Sandy.jpg
捆绑将为“背景图像”生成以下CSS Url路径-
现在,如果您将网站/web应用程序作为网站托管在path上面的web服务器上,则可以工作,
因为浏览器将使用以下Url发送此资源的请求,因为前导“/”
http://<server>/content/images/sandy.jpg
这对我有用
<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/content/styles/css")" rel="stylesheet" type="text/css" />
图像被破坏的原因是它试图找到与捆绑过程中定义的新路径相关的图像,即 bundles.Add(new StyleBundle("~/Content/woothemes").Include( "~/Content/woothemes/css/style.css", )); 添加(新样式包(“~/Content/woothemes”)。包括( “~/Content/woothemes/css/style.css”, )); 因此,如果style.css中定义了任何图像路径(即背景图像),它将尝试获取其相对于内容/woothemes的路径,而不是内容/woothemes/css/,因此不会找到图像 解决同一文件夹的文件问题的一个解决方法是定义与文件夹(其文件正在缩小)路径相同的新路径,即 添加(新样式包(“~/Content/woothemes/css”)。包括( “~/Content/woothemes/css/style.css”, )); 这样,捆绑的文件和实际的文件路径将匹配,并且将找到css中定义的图像,因此问题将得到解决
如果您出于上述相同的原因混合不同文件夹中的文件,则问题将无法解决您是如何定义CSSRWriteUrlTransform类的?@lin:我没有。据我所知,它没有很多选择:你是对的,它没有很多选择。但如果这些选项设置不正确,则无法获得绝对路径。此链接可能对您有所帮助。我从中得到的是:不要在CSS上使用路径绑定,因为除了非常简单的情况外,它是坏的。直接链接缩小的CSS要容易得多。在不更改
CSS
的情况下复制的可能性是另一种扩展方法,它可能会帮助别人。我认为你的答案是最重要的。如果你要使用一个样式包,重要的是要了解你的css相对url将是相对于该包的,并且包url上的最后一个标记类似于一个文件,而不是一个目录,因此在上面的示例中,“~/Content/woothemes”可以被认为是“~/Content/woothemes.css”,这意味着你的url是相对于~/Content的/
http://<server>/content/images/sandy.jpg
background-image: url("Images/Sandy.jpg");
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
<link href="@System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/content/styles/css")" rel="stylesheet" type="text/css" />
bundles.Add(new StyleBundle("~/Content/woothemes").Include(
"~/Content/woothemes/css/style.css",
));
bundles.Add(new StyleBundle("~/Content/woothemes/css").Include(
"~/Content/woothemes/css/style.css",
));